Your first JSX content

In this section, we’ll implement the obligatory Hello World JSX application. This initial dive is just the beginning – it’s a simple yet effective way to get acquainted with the syntax and its capabilities. As we progress, we’ll delve into more complex and nuanced examples, demonstrating the power and flexibility of JSX in building React applications. We’ll also discuss what makes this syntax work well for declarative UI structures.

Hello JSX

Without further ado, here’s your first JSX application:

import * as ReactDOM from "react-dom";
const root = ReactDOM.createRoot(document.getElementById("root"));
root.render(
  <p>
    Hello, <strong>JSX</strong>
  </p>
);

Let’s walk through what’s happening here.

The render() function takes JSX as an argument and renders it to the DOM node passed to ReactDOM.createRoot().

The actual JSX content in...