JSX

JSX是react语法基础，也是react的核心部分。

它使用XML标记的方式去直接声明界面，界面组件之间可以互相嵌套。可以理解为在JS中编写与XML类似的语言,一种定义带属性树结构（DOM结构）的语法，它的目的不是要在浏览器或者引擎中实现，它的目的是通过各种编译器将这些标记编译成标准的JS语言。

我们可以完全不使用JSX语法，只使用JS语法，但还是推荐使用JSX，个人感觉JSX语法用起来真的太棒啦，只不过刚接触的时候你会觉得这种语法太奇怪，看起来简直乱七八糟。一旦你习惯并且熟悉之后，相信我，你就真的回不去了。代码非常易于阅读，你再回去阅读JS的代码，你内心是拒绝的。

当我们使用JSX语法后，你必须要引入babel的JSX解析器，把JSX转化成JS语法，这个工作会由babel自动完成。同时引入babel后，你就可以使用新的es6语法，babel会帮你把es6语法转化成es5语法，兼容更多的浏览器。

下面是官网的一个简单的栗子：

我们可以看到最后一个script标签中的type属性为text/babel而不是text/javascript。这是因为React独有的JSX语法跟JavaScript不兼容，所以凡是使用JSX的地方都要加上

在上面，我们一共引用了三个库：react.js, react-dom.js, browser.js
react.js 是react的核心库。
react-dom.js 是提供与DOM相关功能。
browser.js 作用则是将JSX语法转化为JavaScript语法。

将 JSX 语法转为 JavaScript 语法，这一步很消耗时间。现在前端项目，都会使用前端工程化，不会直接在html页面中直接写js代码，写好的js代码都会使用工具进行编译压缩等。这样的话，我们的jsx也会通过编译直接转化成js语法，让浏览器直接使用。

ReactDOM.render是 React最基本的用法，其作用是将模板转化为HTML语言，并将其插入到指定的DOM节点。

未完待续。。。