react.js 教程之 Installation 安装

运行方法

运行react有三种方式
1.如果你只是学习react，可以在http://codepen.io/gaearon/pen/rrpgNB?editors=0010上只写写代码
2.如果你想用自己的编辑器，https://facebook.github.io/react/downloads/single-file-example.html可以下载这个html文件，直接编写代码，编译速度很慢
3.如果是自己开发app，可以通过安装create-react-app命令行工具，或者直接添加到自己正在开发的项目中

创建一个新的app应用

这是开发react单页面应用最好的方式，提供了完善的开发环境，你可以使用最新的js特性，拥有非常好的开发体验，并且生产环境的代码优化了，使用如下命令运行react应用
npm install create-react-app -g
create-react-app my-app
cd my-app
npm start
创建的程序不会处理后端的逻辑和数据库，仅仅是创建了一个前端的构建通道，所以你可以使用任何的后端语言。在此程序的背后使用了诸如Babel和webpack的构建工具，尽管这些工具有很复杂的配置，但是react保证让你零配置运行项目，当你写好了项目，可以使用npm run build创建优化后的代码，这些代码将放在build文件夹中，关于create-react-app命令行工具的更多介绍，请访问https://github.com/facebookincubator/create-react-app#create-react-app- 和 https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md#table-of-contents

将react添加到已经存在的项目中

添加react并不需要重写项目，我们建议你将react添加到你项目的一个小的部分中，作为一个独立的部件，看react是否能够正常工作，react可以单独使用不需要构建管道，但是我们建议你在设置这个功能，因为这样会是你的开发更高效，一个现代的构建管道包括以下几方面内容
    1.包管理器，如Yarn或者npm，方便管理第三方包
    2.打包器，如webpack或者Browserify，能够帮助你书写模块化代码并且打包成小的包用来节省下载时间
    3.编译器，如Babel，能够帮助你书写现代化的js代码，在老浏览器中照样可以用
步骤：
    1.安装react
        npm init 
        npm install --save react react-dom
    2.安装Babel和JSX
        Babel要包含babel-preset-react或者babel-preset-es2015
    3.安装webpack
        简单的react的程序
        import React from 'react';
        import ReactDOM from 'react-dom';
        ReactDOM.render(
            <h1>Hello,world!</h1>,
            document.getElementById('root')
        )
    4.指定生产和开发使用的react版本

上面有些内容没有讲到，这涉及后面的知识，后面再讲