react的安装使用

react的重要思想是通过组件来开发应用，而组件就是能够完成某个特定功能而独立、可复用的代码。

react是可以像JQuery那样直接下载引入使用，也可以直接引用官网提供的CDN的地址：

<script src="https://unpkg.com/react@16/umd/react.development.js"></script>

<script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script>

<script src="https://unpkg.com/babel-standalone@6.15.0/babel.min.js"></script>

 

另一个方法就是通过npm使用react，先安装node.js，虽然react开发中不依赖node.js。但是在开发过程中我们会用到很多的工具需要node支持。安装了node就安装了npm，开发过程中会用到很多现有的安装包，这时npm就起了很大作用。react是依赖于庞大的技术栈，例如转译JavaScript就需要依赖Babel，模块打包就用到了webpack,定制build用到了grunt等等技术，这些都是需要写配置文件的。Feacbook提供了一个快速开发React应用的工具，create-react-app。可以创建一个已完成基本配置的应用，快速进入开发（现在想体验一下React的魅力所在，快速进入开发React应用。后续再仔细学一下配置文件～_~）

安装create-react-app命令：

npm install  -g  create-react-app

执行该命令后，电脑便create-react-app的命令。现在就可以使用create-react-app命令创建一个目录了。

执行命令：

create-react-app   project

在当前目录下就成功创建了project的目录，在目录中会自动下载一个应用的框架。create-react-app命令结束后执行以下命令：

cd project

npm start

这时会启动开发模式的服务器，同时浏览器自动开打开地址为：localhost:3000的网页

下次启动该项目时，直接切换到该项目所在目录执行命令：npm  start  即可。

所创建应用的入口文件 src/index.js:

import React from 'react';

import ReactDOM from 'react-dom';

import './index.css';

import Click from './Click';//导入Click组件

import registerServiceWorker from './registerServiceWorker';

ReactDOM.render(<Click />, document.getElementById('root'));

registerServiceWorker();

 

渲染的是一个为 Click的组件，其中的import是ES6（EcmaScript 6）语法引入文件模块的方式，虽然有些浏览器尚未支持ES6，但是create-react-app已经把ES语法的JavaScript代码转译为所有浏览器都支持的ES5了。