React技术栈一览

React技术栈一览

ES6、babel、webpack、ESlint、React、react-redux、react-router、UI框架

这些技术栈都需要进行配置支持，新手可能还没写一行React代码，就已经被各种技术栈名词淹没，迷失其中。

ES6

JavaScript的下一代标准，规定今后按年份发布新版。2015年发布的ECMAScript6.0，也叫ES2015。
学习React，要熟悉ES6的模块化、箭头函数、表达式解构、Promise异步编程，以及了解一些新的语法特性和API。

Babel

Babel是一个广泛使用的转码器，可以将ES6代码转为ES5代码。JavaScript在不断发展，各种新的标准提案层出不穷，由于浏览器的多样性导致可能几年之内都无法广泛普及，Babel可以让你无顾虑的使用这些特性。

ESlint

ESlint是一个JavaScript代码静态检查工具，可以检查JavaScript的语法错误，提示潜在的bug，可以有效提高代码质量。维持前端团队高度一致的编码风格。ESLint不但提供一些默认的规则，也提供用户自定义规则来约束所写的JavaScript代码。

Webpack

Webpack是新一代打包工具。如今，前端项目日渐复杂，构建系统已成为开发过程中不可或缺的部分，而模块打包正式前端构建系统的核心。

React

React是Facebook推出的JavaScript库。口号是“用来创建用户界面的JavaScript库”，所以它只是和用户界面打交道，可以把它看成MVC中的V（视图）层。因此，除非项目很简单，否则一般再配上Redux管理数据流和状态。

react-redux

React的核心就是组件，它只负责view，当应用复杂程度增加时，还需要有数据流向控制、状态管理等方案。

React推出了Flux架构及其官方实现。同时业界也推出了很多Flux的实现，其中以Redux为翘楚，它将 Flux 与函数式编程结合一起，很短时间内就成为了最热门的前端架构。

react-redux是Redux官方提供的React绑定，对Redux进行一定封装，用于辅助在React项目中更方便的使用Redux。

学习React，必须了解Flux，熟悉Redux和react-redux。

react-router

路由库React-Router，是React体系的一个重要部分。它是官方维护的，事实上也是唯一可选的路由库。它通过管理URL，实现组件的切换和状态的变化，开发复杂的应用肯定用到。

学习React，必须熟悉它。

UI框架

诸如Ant Design、Amaze UI React、React bootstrap、Material-UI、React Desktop、Semantic-UI-React