如何从零学习 React 技术栈
为什么要学习 React?
首先，React 相较于其他框架，其生态圈发展最为完整成熟，有非常多现成的、完整的解决方案。
其次，它适用于大中型应用的开发，便于团队中多人之间协作，很多大厂都在正式的项目中使用了 React。
在学会 React 之后，你的能力将不止局限于浏览器，React 还可以拓宽到使用 React Native 开发原生应用，以及使用 ReactVR 开发虚拟现实等各个领域。
通过本课程可以学到什么？
本课程共六篇文章，除了示例代码的讲解之外，还会对个别核心概念的原理进行讲解介绍，并用实际案例 TodoList 应用来展示。
在课程最后我还会分享一篇学习 React 的心得体会。
课程内容
第01课：实战篇导读
什么是 React ？
React 是由 Facebook 主导开发的一个 JavaScript 框架。它和之前一些流行过的 MVVM 框架，例如 Angular 不同，React 主要只专注于 MVC 中的 V ，也就是视图层。React 是当前最流行的，专门用来构建前端 UI 界面的框架。
React 的优点是它很快、很轻。并且它组件化的思想在开发构建界面时也对我们有很大的帮助。当学过 React 之后你会发现，它这种规范化的写法，对于一个需要共同开发协作的项目组或团队是大有裨益的。
就好像100个人写 jQuery 就可能会有100种写法，但是不管让谁来写 React 组件，我们都能保证他写出来的代码和标准是差不多的。
所以假如你对 JavaScript 已经有了相当的掌握，想要学习框架来开发一些 Web 应用的话，选择 React 准是没错的。
为什么要学习 React?
看到这个课程介绍，有些同学可能会有疑问：现在有很多流行的框架，为什么我非得选 React 不可呢？
首先，React 相较于其他框架，其生态圈发展最为完整成熟，有非常多现成的完整的解决方案。并且它适用于大中型应用的开发，便于团队中多人之间协作，很多大厂都在正式的项目中使用了 React。在学会 React 之后，你的能力将不止局限于浏览器，React 还可以拓宽到使用 React Native 开发原生应用，以及使用 ReactVR 开发虚拟现实等各个领域。
这个课程可以学到什么？
早些时候我在网络上连载了《从零学习 React 技术栈·理论篇》的系列教程。理论篇的教程可以在我的个人公众号或者博客查看：
- 余博伦 博客
- 余博伦 微信公众号
作为理论知识的实践补充，我又设计了《从零学习 React 技术栈·实战篇》，以 GitChat 达人课的形式来展现。本课程共六篇文章，除了示例代码的讲解之外，还会对个别核心概念的原理进行讲解介绍，并用实际案例 TodoList 应用来展示。在课程最后还会分享一篇我学习 React 的心得体会。
课程大纲如下：
- 01-设计原型
- 02-开发准备
- 03-组件开发
- 04-样式编写
- 05-数据处理
- 06-路由配置
每个课时对应的项目源码可以在这里查看：
- React Todo Demo on Github
本课程的优势是？
我在准备教程的过程中查阅大量资料，综合了国内外所有优秀的 React 学习资源，萃取其中最精华的知识点，选择最为流行的 React 技术栈，立足最新版本的官网文档，在帮助新手入门上手的同时，也会对一些重要的知识概念进行讲解，满足初级、中级各个学习阶段和水平的同学。
本教程全部采用当前发布的正式版本库进行教学，确保我用起来是这个样子，你学完之后用起来也是这个样子。
现在的 React 已经不仅仅是一个框架，它逐步发展成了一个非常庞大的生态体系。
现在你去看 React 官网文档，或者一些比较新的 React 教程，我们在书写 JavaScript 的时候，都已经开始采用 ES6 的语法，这些语法乍看起来可能会比较陌生。不过实际上，ES6实现的语法糖和一些新的方法，是能够极大地方便我们的编码的。
教程使用的是目前 React 发行的最新版本，新版本当中引入了非常多的 ES6 的新特性，所以代码看起来和我们以前习惯的 jQuery 风格代码会有很多的不同。
在正式学习 React 技术栈之前，推荐你最好掌握一些 ES6 的基本语法，例如箭头函数、Class类、let、const等一些新的声明变量的方法等等。
MDN JavaScript 参考文档
本课程的设计初衷？
互联网上什么都有，杂乱无章。信息太多，相当于没有信息，选择太多，相当于没有选择。React 的中文资源比较少，大多数都已经过时，使用的是一两年前的版本，跟不上官方的版本更迭，且有一些中文资料由于翻译的不准确存在一些知识性的错误，很有可能会误导初学者。
中文的学习资源还是太少，而且良莠不齐。国内前端学习者普遍英文水平还不够，况且现在前端发展这么快，等学好英语考过四六级，说不定 React 已经过气了。
另外，网上还没有综合 React 技术栈所有库的最新版本的教程和代码示例。一些教程虽然非常优秀，但随着 React 及相关库的新版本发布，这些教程已经过期，甚至提供的示例代码已经不能正常运行了。
本教程的前置知识？
想要学习本教程的同学最好对 JavaScript 基础知识、ES6 新特性等相关内容掌握了解。熟悉 JavaScript 中变量、对象、函数等基本概念，ES6 中 const/class/箭头函数/解构赋值等新语法的基本使用。
另外在正式学习《从零学习 React 技术栈·实战篇》教程内容之前，你最好已经阅读过了《从零学习 React 技术栈·理论篇》的内容，并尝试编写过其中的示例。
本教程使用的框架版本及软件依赖
框架及库
软件及工具
- npm/cnpm
- webpack
- create-react-app
- Codepen/Codepan
- Chrome
- vs code
- VS Code React 技术栈代码补全插件
代码示例
- React on Codepen
- react-router on Codepen
- Redux on Codepen
- React Demo Project on Github
- React Todo Demo on Github
学习资源
- React官方中文文档
- 余博伦个人博客
第02课：设计原型
第03课：开发准备
第04课：组件开发
第05课：样式编写
第06课：数据处理
第07课：路由配置
第08课：我是如何学习 React 技术栈的
阅读全文: http://gitbook.cn/gitchat/column/59ae12fdbc511269a95f9616