Creating React Nodes With JSX

To use JSX instead (assuming you have Babel setup) of React.createElement() to create these React nodes one just has to replace React.createElement() function calls with the HTML/XML like tags which represent the HTML you’d like the virtual DOM to spit out. The above code can be written in JSX like so.

Creating React nodes using JSX is as simple as writing HTML like code in your JavaScript files.

Notes

• JSX tags support the XML self close syntax so you can optionally leave the closing tag off when no child node is used.
• The class attribute has to be written className
• The attribute has to be written htmlFor
• All attributes are camel-cased (e.g., accept-charset is written as )
• To represent HTML elements, ensure the HTML tag is lower-cased