Passing Props into the Layout Component

In this video, we learn how to use props to toggle parts of the layout on and off depending on which pages needs what.

In Layout.js, we can add a boolean check for whether we have a noHeader prop. If we don't, we'll display the Header. The code looks like this:

<div>
  {!noHeader && <Header />} 
  {children}
</div>

Then, in about.js, we can add a noHeader prop to the Layout component to turn hide that h1 tag.

Let's do an assignment to help you remember how to nest layout components.