React安装：创建React应用
上一节：在现有项目上使用React
React安装：创建react应用
- 使用React工具链的好处
- 推荐的工具链
- Create React App
- Next.js
- Gatsby
- 更灵活的工具链
- 从零开始打造工具链
（本文根据react官网翻译，并加入了部分个人想法，如有遗漏请联系作者）
使用React工具链的好处
- 扩展文件和组件的范围
- 使用npm集成第三方库
- 自动检测语法错误
- 实时编写CSS和Javascript
- 优化生成输出
提示：本章所推荐的工具链不需要特定的配置
提示：你可能不需要工具链
如果你没有遇到之前讲述的问题或者觉得使用JavaScript工具十分方便，那么你可以把react作为纯粹的脚本script添加到html中，同时也可以根据需求选择是否使用JSX。
这也是将react集成到现有项目的最简单的方式，当然如果你觉得工具链对你更有帮助的话你也可以使用它。
推荐的工具链
React开发团队推荐以下几种工具链
- 如果你想学习react或者开发一个单页面应用的话，查看 Create React App
- 如果你想用Node.js构建服务器端渲染的网站，请查看Next.js
- 如果你想构建面向内容的静态网站，请查看Gatsby
- 如果你想创建一个组件库或继承一个已有的代码库，请查看More Flexible Toolchains
Create React App
Create React App 对于学习React来说是一个非常友好的环境，同时这也是使用React创建单页面应用最好的方式。
它帮你搭建了开发环境因此你可以在此环境下使用最新的JavaScript特性，同时它提供了一个良好的开发环境并且会对你的生产输出进行优化。
创建一个React应用，你需要在电脑上安装Node（>=8.10版）和npm（>=5.6版）。使用以下命令即可创建一个React应用
npx create-react-app my-app
cd my-app
npm start
提示：npx不是错字，他是npm5.2+自带的package运行工具
Create React App不需要操作后端逻辑或者数据库，它只是创建前端的流水线，所以你可以使用任何你想使用后端框架。尽管它在内部使用Babel和webpack，但是你完全可以不对他们做任何的了解。
当你准备部署你的项目时，在终端运行
npm run build
这段命令将会在build文件夹中生成应用的优化版本。你可以从README和User Guide中了解到更多关于Create React App的内容。
Next.js
Next.js是一个流行的轻量级框架，用于配合React创建的静态服务端渲染应用。它包含了立即可用的样式和路由解决方案，并且假设你使用Node.js作为服务器环境。
从官网了解更多Next.js。
Gatsby
Gatsby是使用React创建静态网页的最好的方法。它能让你在使用React组件的同时输出预渲染的html以及CSS以确保最快的加载速度。
从官网和入门示例集中学习Gatsby。
更灵活的工具链
以下的工具链提供了更多的选择性。我们推荐富有经验的开发者使用它们。
Neutrino 把webpack的强大功能和简单的预设结合在一起，包括了对React app和React 组件的预设。
nwb特别适于将React组件发布到npm上，同样的，它也可用于创建React 应用。
Parcel是一个快速、零配置的web应用打包器，并且可以搭配React一起工作。
Razzle是一个不需要任何配置的服务器渲染框架，而且相比于Next.js，它有着更高的自由度。
从零开始打造工具链
一个JavaScript构建工具链一般由以下几部分组成：
●一个包管理器，就像是yarn和npm。它能够让你利用庞大的第三方package生态系统，并且轻松地安装和更新它们。
●一个打包器，就像是webpack和Parcel。它能把你写好的模块化代码打包进一个小的package，并以此来优化加载时间。
●一个编译器，就像是Babel。它能让你编写的现代JavaScript代码运行在较老的浏览器上。
如果你喜欢从零开始设置你的JavaScript工具链，查看这个指导，它重选创建了一些Create React App功能。
请确认你设置的工具链对生产环境进行了正确的配置。
上一节：在现有项目上使用React
下一节：JSX简介