This is hello word app created with react.js This is my first simple script. Yes, I know it’s easier to do this in html. But I wanted to do this in JSX to make thing more complicated.
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Jsx</title> </head> <body> <!-- container node --> <div id="jsx"> </div> <!-- container node --> <div id="dom"> </div> <script src="https://fb.me/react-0.11.1.js"></script> <script src="https://fb.me/JSXTransformer-0.11.1.js"></script> <script type="text/jsx"> /** @jsx React.DOM */ var MessageBox = React.createClass({ render: function(){ return ( <div className="container"> <h1>Hi</h1> <SubMessage /> </div> ); } }); var SubMessage = React.createClass({ render: function(){ return ( <small>Sub message</small> ); } }); var reactComponentJSX = React.renderComponent( <MessageBox />, document.getElementById('jsx') ); </script> </body> </html>