React是什么？
react官方对它的解释，用于构建用户界面的JavaScript库，对于前段来说，主要任务就是构建页面，而构建页面离不开三个技术
HTML:构建页面的解构
CSS：构建页面的样式
JavaScript:页面动态交互
React的特点:声明式编程
声明式编程是目前前端的开发模式 Vue React
它允许我们只需要维护自己的状态，当状态发生改变时候，react可以根据最新的状态去渲染我们的UI界面
组件化开发
组件化开发也是目前前端的流行趋势，在开发过程中，我们可以将一个复杂的界面拆分成一个个小的组件
开发react需要添加三个依赖
三个依赖有三种方式添加
方式一：CDN引入
react依赖:https://unpkg.com/react@16/umd/react.development.js
react-dom依赖:https://unpkg.com/react-dom@16/umd/react-dom.development.js
babel依赖:https://unpkg.com/babel-standalone@6/babel.min.js
方式二：下载后添加本地依赖
方式三：通过npm包管理
这篇以CDN方式引入
在刚接触react时候，会觉得react比较繁琐，这里用vue来对比 想要使用vue直接cdn引入一个依赖就可以开发vue 这是因为vue讲所有依赖集成到了一个
而react需要引入三个 但是呢，这三个库各司其职，目的是为了让每一个库各司其职
为什么要引入三个依赖呢?原因是react-native
react包含了react和react-native所共有的核心代码
react-dom针对web和native所完成的事情不同：
web端：react-dom会讲jsx最终渲染成真实的DOM，显示在浏览器中
native端：react-dom会讲jsx最终渲染成原生的控件（比如Android中的Button，iOS中的UIButton）。
babel是什么？
Babel ，又名 Babel.js。
是目前前端使用非常广泛的编辑器、转移器。
比如当下很多浏览器并不支持ES6的语法，但是确实ES6的语法非常的简洁和方便，我们开发时希望使用它。
那么编写源码时我们就可以使用ES6来编写，之后通过Babel工具，将ES6转成大多数浏览器都支持的ES5的语法。
Hello React
使用react语法，实现hello world
<body>
<div id="app">
</div>
<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/babel.min.js"></script>
<script type="text/babel">
// 将数据定义到变量中
let message = "Hello World";
// 通过ReactDom对象来渲染内容
render();
// 定义一个执行的函数
function btnClick() {
message = "Hello React";
render();
}
function render() {
ReactDOM.render((
<div>
<h2>{ message}</h2>
<button onClick={ btnClick}>改变文本</button>
</div>
), document.getElementById("app"));
}
</script>
</body>
