初学 React 的时候,相信大部分人都有这样的体会:React 技术栈水太深,涉及的技术点太多了。
如今网上有不少 React 相关的教程,但多的是是完整的 React 项目,少的是庖丁解牛式的、一步步的搭建 React 项目框架的教程。而且,React 涉及的技术点很多,常常让人有种无从入手的感觉。
如果,你也有这样的困惑,不妨阅读一下 如何学习React(react-howto) 。这篇文章提出了一个合理的学习 React 技术栈的顺序,我认为很有道理。
本教程采用 react-howto 中提出的 React 技术栈学习路线,由浅入深,循序渐进的为你一一讲解 React 。
如果,你有任何疑问或建议,欢迎在 Issues 中提出。
- Prepare - Html, Css, Javascript
- Chapter01 - React
- Chapter02 - Node, Npm, Yarn
- Chapter03 - Webpack
- Chapter04 - ES6, Babel, ESLint
- Chapter05 - React Router
- Chapter06 - Flux, Redux
Editing...
本教程已使用 Gitbook 生成电子书。:point_right: react-step-by-step 电子书
-
codes :所有示例代码存放于
codes
目录。我在学习 React 过程中,发现网上大部分示例动不动就是一大堆 React 技术整合在一起。这让初学者经常感觉很无力:一个技术还没搞懂,就要学另外一个技术,立不动心啊。
所以,我建立了一个连续性项目:
jigsaw(拼图)
。之所以叫连续性项目,是因为它是一步步引入 React 技术。每个
jsgsaw
目录,都是基于前面 chapter 的基础上,引入本 chapter 重点学习的技术。我觉得,通过这种方式,能更加晰的理解,如何搭建一个完整的 React 项目。 -
docs :所有文档存放于
docs
目录。并且文档遵循 GitBook 规范。为了取得更好的阅读效果,建议参照 docs 说明 阅读本教程。 -
Git :采用 gitmoji 规范填写提交信息(带图标的提示信息很有趣)。