Learn React Hooks

Using the Header component

After creating the Header component, we are going to use it in the App component, as follows:

1. Edit src/App.js, and import the Header component:

import Header from './Header'

2. Then, render the Header component before the UserBar component:

    return (        <div style={{ padding: 8 }}>            <Header text="React Hooks Blog" />            <UserBar user={user} dispatch={dispatch} />

You might want to refactor the React Hooks Blog value into a prop that is passed to the App component (app config), because we are already using it three times in this component.

Now, our Header component will be rendered in the app and we can move on to implementing the Context Hook in the Post component.