React的深入解密一

　　React起源于Facebook 的内部项目，用来架设 Instagram 的网站，并于2013年5月开源。由于工作学习需要，我花了一些功夫学习了React，并小有收获，最近我抽空整理了下文档，在此与大家分享，望一起学习进步。

React 是一个用于构建用户界面的 JAVASCRIPT 库，主要用于构建UI，很多人认为React是MVC中的V。根据官方api中的方法，我们可以用以下命令创建单页面应用程序:

npm install -g create-react-app
create-react-app project
cd project
npm start

创建React应用程序不处理后端逻辑或数据库; 它只是创建一个前端构建管道，所以你可以使用它与任何后端你想要的。它使用webpack，Babel和ESLint在引擎盖下，只是为你配置他们。

接下来，我们就开始准备安装React了。在这里有两种包管理工具可以使用，一个是npm，另外一个是Yarn。

要安装React with Yarn，请运行：

yarn init
yarn add react react-dom

要使用npm安装React，请运行：

npm init
npm install --save react react-dom

Yarn可能会更加好用一点。

　　完成安装之后呢，我还建议我们使用Babel，这能够让我们在JavaScript代码中使用ES6和JSX。ES6是一组现代JavaScript特性，能够使得开发更加容易，而JSX则是对React非常有效的JavaScript语言的扩展。如果你不知道如何配置Babel，那么在Babel setup instructions中解释了如何在许多不同的生成环境配置Babel。再说一句我在编写代码的时候使用了webpack打包器。有兴趣的童鞋可以去看看https://webpack.js.org。接下来我们可以开始使用React了！我先举个例子：

import React from 'react';
import ReactDOM from 'react-dom';

ReactDOM.render(
  <h1>Hello, world!</h1>,
  document.getElementById('root')
);

此代码呈现为具有id的DOM元素，root因此您需要<div id="root"></div>在HTML文件中的某个位置。同样，您可以在使用任何其他JavaScript UI库编写的现有应用程序内部的DOM元素内部渲染React组件。

　　至此，正式开始了React的深入之路。之后我将会整理出常用的代码，和一些关键知识点。

　　我在这里收集了几个React的CDN供大家方便使用。

开发版：

<script src="https://unpkg.com/react@15/dist/react.js"></script>
<script src="https://unpkg.com/react-dom@15/dist/react-dom.js"></script>

精简，生产版本

<script src="https://unpkg.com/react@15/dist/react.min.js"></script>
<script src="https://unpkg.com/react-dom@15/dist/react-dom.min.js"></script>