Tooling
- Chrome Dev Tools:DOM inspect & JS debugger: Chrome Dev Tools算是最为优秀的调试工具了，Firefox也有很多不错的扩展。
- npm: 官方开源的JavaScript包管理工具。
- git** & Build software better, togetherGitHub:** 分布式版本管理系统，很适合团队协作。
- Babel: 能够将ES6代码编译到ES5使之能够兼容老版本浏览器。
- Webpack: 最著名的模块打包工具之一，有不少优秀的模板配置奥，譬如Webpack2-React-Redux-Boilerplate。
- Atom, VSCode, or WebStorm** + Vim Cheat Sheet - Englishvim:** 你需要为自己选择合适的编辑器来辅助你快速开发。Atom与VSCode都是非常优秀的JavaScript编辑器，WebStorm也不错但是它是收费版本。如果你打算直接在服务端开发的话，Vim是个不错的选择。
- ESLint: ESLint能够帮助开发者更快地发现语法错误与样式问题，在Code Review与TDD之后这是个不错的减少Bug的方法。
- Tern.js: 基于编辑器插件的标准JavaScript类型推导工具，不需要任何编译步骤或者注解支持。
- Yarn*: 类似于NPM的工具，不过安装起来更为可靠快速。
- TypeScript*: JavaScript的静态类型支持，不过需要特别注意的是，除非你在学习Angular 2，不然我觉得你如果要选用Angular 2的话还是要慎重考虑。我个人很喜欢TypeScript，也很钦佩他们团队的优秀工作，不过任然有很多的权衡，可以参阅 “The Shocking Secret About Static Types” & “You Might Not Need TypeScript”.
- Flow*: JavaScript静态类型检测工具，可以阅读 “TypeScript vs Flow” 来对于这二者有个大概的了解，如果你打算Flow的话也是推荐我的编辑器Nuclide。
React
React 是个专注于构建用户视图层的JavaScript库，其基于单向数据流的设计思想，也就意味着：
- React 以Props的形式将参数传入Components，并且在数据发生变化的时候选择性重渲染部分DOM。在重渲染阶段发生的数据变化并不会立刻触发重渲染，而是在下一个绘制阶段的时候才会进行重渲染。
- 渲染完毕之后，就进入了事件处理，React使用特殊的合成事件帮助开发者监听与响应事件，将所有的节点上的事件交托单一事件监听器处理以获得更好的性能体验。你可以在这些事件的监听函数中通过外部传入的回调重新设置Props或者直接修改内部State。
- 对于数据的任何变化都会重复步骤1。
这种单向数据流与当时以Angular 1 / Knockout为代表的双向数据绑定形成对比，双向数据绑定中如果发现绑定的数据发生变化则会立刻触发重渲染，而无论当前是否处于渲染流程中，这一点也就导致了Reflows与Repaints的性能表现非常差。React并没有预置专门的数据管理系统，不过官方推荐基于Flux的解决方案。React 的单向数据流的概念借鉴了很多函数式编程的设计思想，并且对于不可变数据结构的应用也在很大程度上改变了我们对前端框架的认识。如果你希望了解更多关于React与Flux架构的知识，推荐阅读 “The Best Way to Learn to Code is to Code: Learn App Architecture by Building Apps”。