Welcome back, how's it going? So up until now we have successfully hooked up React Router to allow us to go to the slash about and slash products page, but the problem is we only do that directly through the URL. Obviously don't want the user to be doing that to navigate between pages, so what we need to do is to have some links, let's say from the main page that will link to the about page and to the product page. Now to do that you could of course create a link that points to the pound slash about and pound slash products using the anchor tag, but React Router provides its own link component that we can make use of. So let's get started. So let's go to the app component and create some sort of menu that has a link to the about page and a link to the products page. So let's go to app.js. Now in the return value here for the render function what we want to do is before the attacks this is the main page, we're going to add the links. So to use a link from React Router, this is called the link component, you do it like this, you say the link and then you give to. This too here is a location object, but you can also use a string with the path, for example. If we want to make a link to the about page we can say slash about, okay, and then let's give it some content for the link like this. So link to slash about. Now since we're using link here we have to import it and we just so import, don't forget the braces, link from React Router as so. So this way you are navigating to the about page when you click link. So let's go and test it out. From the, you see about there, click the about, you can see it goes back, it goes to the about page, okay. If we go back here and click there you can see in the bottom the link to about. So this is the link component from React Router. Now I want to see you add another link to the product page using the same manner, in the same manner, same fashion, let's see it. So how did it go? So let's add a separator here with link, I just add a pipe there so we can separate the links. We're going to say link, use the component link to slash product. I'm going to say products slash link, let's maybe add a div so they both stay in the same place and then just line break before it gets to the this is the main page. Save it, there you go, about and then products. There's no space for that pipe, I can add a space here actually, if I do it like this, there you go. So actually this should be on a nav, it's more appropriate to use a nav since it's a menu for navigation. So we have about and products and I added here this, actually it's just a space followed by a pipe followed by a space. Before this, there was no space, there's no way you can add a space there because it's going to collapse into a single thing so I had to do the this kind of trick to actually use force it to use a space before and after, okay? There you go, have about, have products, let's check it out. Click products, everything working, very good. Go back, check about, everything working. So that's great, now we can navigate between pages using the link component. Alright so let's review what we did in this lecture. We learned how to use the link component from React Router, it's very simple, all you have to say is you pass this probe called 2 and in this case the easiest value you can pass to 2 is a string with the path to the route, okay? This case to about and the other case to products and that's it. That's how you navigate to different pages using link from React Router. Until the next lecture then, bye.