Create navigation between pages using `@reach/router`
In this lesson, we will use the @reach/router library to create navigation that will take us to different pages in our application.
We will create a homepage and about page and switch between these without page re-renders
Sara Vieira: [00:00] Let's import also, Link from '@reach/router'. This will allow us to create our navigation. Let me start by defining a nav that's empty, so nav, and closing this nav. Also, since I have two JSX elements that are adjacent -- I think that's how you say it -- let me do this. Now I can add a link in here.
[00:19] If I say Link to -- instead of href, we say to -- and I add a forward-slash, and I say home page. I close this Link, let me save, and now we have a link to the home page that does absolutely nothing, because we need to add the new one. Let me say, <Link to, and let me say, about, and I'm going to put About. Now if I try to navigate, everything works.
[00:42] As a side-note, you can add the slash or not add the slash, both things work. Also, in here, so if I delete these two slashes, everything still works fine. This is how you can add a navigation using Reach Router.