Your first JSX content – Hello JSX

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.

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

import { createRoot } from "react-dom/client";

createRoot(document.getElementById("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 createRoot().

The actual JSX content in this example renders a paragraph with some bold text inside...