Giter Site home page Giter Site logo

react-journey's Introduction

React 相关的优秀资源

以下列出的资源主要来自自己学习react过程中看过的觉的不错的文章、教程,也算是一个学习过程的记录。

React

教程

名称 简介
fullstackreact 如果只看一个react教程,并且希望全面的了解其生态圈,这本书就够了。
reactjsprogram 有几个大的系列(redux/react native等),其中react基础部分是免费的,内容对初学者来说很优质。

文章

名称 简介
Presentational and Container Components 介绍了react中Presentational和Container Components的概念和区别,以及使用场景
React Components, Elements, and Instances 详细介绍了React中令人困惑的Component和Element的区别,以及React底层是如何将Component解析为DOM树的。
Learning React Without Using React 作者抛开react库本身,围绕react中的render方法,virtual DOM,Component,单向数据流动等概念,实现了一个todolist的例子,demo虽易,但是**非常棒。
React.js in patterns react的设计模式
初识React中的High Order Component 介绍了react中的高阶组件,通俗易懂,顺带还提了下react-redux中的connect的实现。
React Higher Order Components in depth 介绍了高阶组件(HOC)的两种实现方式,以及如何通过它来重用代码、操作WrappedComponent的props/state,render劫持等等。
react-interview-questions react相关的"面试题", 很有意思
How to develop a React library 介绍了如何开发一个react相关的库(组件),便于其他开发者集成到自己的应用中

Redux

教程

名称 简介
Full-Stack Redux Tutorial 这是一篇博客文章,内容相当的多,作者从零搭建了一个实时投票系统,从服务端到浏览器前端,介绍了如何使用mocha,chai进行功能测试,如何使用Immutable.js,以及如何进行react组件的测试。作者在整篇文章中,一点点引入redux中的概念,深入浅出。还有一点非常有意思的是,作者在前后端分别建立了个redux。

文章

名称 简介
so-youve-screwed-up-your-redux-store-or-why-redux-makes-refactoring-easy 主要讲述了对reducers的几种改进方式来对redux进行重构。
The Redux Journey Dan在react-europe 2016上关于redux一年发展过程的总结,并且示范了如何使用redux的优秀特性。

CSS Modules

文章

名称 简介
What are CSS Modules? A visual introduction 介绍了什么是css modules,以及它是如何解决css global问题的。
CSS Modules by Example 7个例子涵盖了css modules在React开发中使用的场景。

Webpack

文章

名称 简介
Webpack中hash与chunkhash的区别,以及js与css的hash指纹解耦方案 比较深入的介绍了hash和chunkhash的一些东西
Progressive loading for modern web applications via code splitting 介绍了如何使用require.ensure来实现code-split,同时实现延迟加载。

教程

名称 简介
http://survivejs.com/webpack/introduction/ 目前看过最全面,也是唯一一本专门介绍webpack的书(webpack是个巨坑==)。
Webpack Deep Dive 深入介绍如何在项目中使用webpack2。视频是workshop上录制的,有现场讲师和学生的提问互动,非常赞。

GraphQL && Relay

教程

名称 简介
https://learngraphql.com 非常详细的介绍了graphql的基础用法,很好的入门教程。

其他

名称 简介
http://flexbox.io/ flexbox视频教程,共20个小视频,前13小节讲述了flexbox的各种属性,后7小节实例演示。
Functional Programming in JavaScript React生态圈中到处透露着函数式编程的**,这本书对于函数式编程接触较少的人来说内容非常丰富,并且一些地方讲的比较深入,适合多次阅读。
learnrx 前面章节讲了大量的函数式**(其实就是map,filter,reduce,concatAll,concatMap这五个函数啦),后面引入Rx,并和数组进行对比,讲解Observable和array有什么联系和区别。

问答

问题 简介
How to dispatch a Redux action with a timeout? 回答者是Redux的作者,阐述了如何在Redux中进行异步操作,什么情况下需要对异步操作进行封装,以及redux-thunk中间件的使用。
Why is 'key' needed? 解释了为什么在一个React Elements数组中需要指定每个元素的key属性。
what-does-webpack-mean-by-xx-hidden-modules webpack运行时,控制台出现+n hidden modules的原因。

Advanced

Newsletter

react-journey's People

Contributors

ywwhack avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.