在使用React的时候，就不得不提JSX， JSX可以理解为JavascriptXML，其标准的官方网站为：https://github.com/jsx/JSX，安装JSX也很简单：
E:\React\learn>npm install -g jsx C:\Users\rodney\AppData\Roaming\npm\jsx-profile-server -> C:\Users\rodney\AppData\Roaming\npm\node_modules\jsx\bin\jsx-profile-server C:\Users\rodney\AppData\Roaming\npm\jsx-with-server -> C:\Users\rodney\AppData\Roaming\npm\node_modules\jsx\bin\jsx-with-server C:\Users\rodney\AppData\Roaming\npm\jsx -> C:\Users\rodney\AppData\Roaming\npm\node_modules\jsx\bin\jsx C:\Users\rodney\AppData\Roaming\npm `-- jsx@0.9.89 +-- escodegen@0.0.28 | `-- estraverse@1.3.2 +-- esmangle@0.0.17 | +-- escope@1.0.3 | | `-- estraverse@2.0.0 | +-- esshorten@0.0.2 | | `-- estraverse@1.2.0 | `-- optimist@0.6.1 | +-- minimist@0.0.10 | `-- wordwrap@0.0.3 +-- esprima@1.0.4 +-- source-map@0.1.43 | `-- amdefine@1.0.1 `-- source-map-support@0.2.10 `-- source-map@0.1.32 通过这个JSX工具，就可以执行一些jsx命令，把一些jsx文件，转换成为特定的输出。比如下面的一个helloworld.jsx 文件，
class _Main { static function main(args : string[]) :void { log "Hello, world!"; } } 经过下面的命令： jsx --run example/hello.jsx其转换输出为： Hello, world!那么为什么JSX会用在React里面呢？
下面来具体看一个HelloWorld的例子
在使用React的API我们能够输出一个HelloWorld，代码如下：
<!DOCTYPE html> <html> <head> <title>hello React</title> <meta charset="utf-8"> </head> <body> <div id="app"> <!-- my app renders here --> </div> <script src="react/build/react.js"></script> <script src="react/build/react-dom.js"></script> <script> ReactDOM.render( React.DOM.h1( {id: "my-heading"}, React.DOM.span(null, React.DOM.em(null, "Hell"), "o" ), " world!" ), document.getElementById('app') ); </script> </body> </html> 大家会发现，其实用React.DOM.*的API去输出一个HTML格式的文件，还是挺繁琐的，里面包含了很多的圆括号，以及里面有很多的嵌套，稍微不留神，就写错了。那么有没有更好的办法呢？ 其中的方法之一，React借助了JSX的思想，写一个Hmtl的模板，然后通过ReactJS的一个工具（Babel，其实就是一个browser.js）来进行转换
下面是通过Babel工具来转换JSX模板的一个例子。
<!DOCTYPE html> <html> <head> <title>Hello JSX React</title> <meta charset="utf-8"> </head> <body> <div id="app"> <!-- my app renders here --> </div> <script src="react/build/react.js"></script> <script src="react/build/react-dom.js"></script> <script src="babel/browser.js"></script> <script type="text/babel"> ReactDOM.render( <h1 id="my-heading"> <span><em>Hell</em>o</span> world! </h1>, document.getElementById('app') ); </script> </body> </html>简单明了，
<h1 id="my-heading"> <span><em>Hell</em>o</span> world! </h1>,
取代了，
React.DOM.h1( {id: "my-heading"}, React.DOM.span(null, React.DOM.em(null, "Hell"), "o" ), " world!" ),
简单，方便。
但是需要多引入一个转换，React JSX模板的库：<script src="babel/browser.js"></script>
但是也是值得的，安装方式为（假设已经安装了npm和bower）
好了，通过上面的文字和描述，大家应该都能了解JSX的基本用法了。下面的链接就是一些，学习JSX比较好的网站。
https://babeljs.io/repl
