Without further ado, here's your first JSX application:
import React from 'react';
import { render } from 'react-dom';
render(
<p>
Hello, <strong>JSX</strong>
</p>,
document.getElementById('root')
);
Let's walk through what's happening here. First, we need to import the relevant pieces. The render() function takes JSX as the first argument and renders it to the DOM node passed as the second argument.
The actual JSX content in this example renders a paragraph with some bold text inside. There's nothing fancy going on here, so we could have just inserted this markup into the DOM directly as a plain string. However, the aim of this example is to show the basic steps involved in getting JSX rendered onto the page. Now, let's talk a little bit about the declarative UI structure.
JSX is transpiled into JavaScript statements; browsers have no idea what JSX is. I would highly recommend downloading the companion...
