Nesting not called in "Nesting components" code snippet

[thetillhoff]

On section for Nesting components, there's the following code snippet:

function Header() {
  return <h1>Develop. Preview. Ship.</h1>;
}
 
function HomePage() {
  return (
    <div>
      {/* Nesting the Header component */}
      <Header />
    </div>
  );
}
 
const root = ReactDOM.createRoot(app);
root.render(<Header />);

As it is, the components are nested, but the wrong one is then rendered. It should be root.render(<HomePage />); instead.