Outline
Create a new file in /src/components
called NavBar.js
. Import React and create a simple function component. Inside of it, move the Link
tags for /about
and /
.
The component will look like this:
export default () => (
<div>
<Link to="/">Home</Link> | <Link to="/about">About</Link>
</div>
)
After that, add the NavBar
component to index.js
and about.js
. Don't forget to clean up the extra links!
In the next video, we'll recap what we've learned about layouts in Gatsby.