Okay.
And before we start working on the Navbar, let's also cover React Icons Library, which we're going
to use in this project to generate our icons.
Now, the reason why I really prefer this particular library is because they have tons and tons and
tons of libraries to choose from.
And second, we import icons as components.
So it's very easy to set up the logic, the styles and the rest of the stuff.
If you navigate to the docs, you'll see the libraries that are available to us.
So essentially these are all the libraries that we can use.
We can even search for the icon, let's say, home.
So we set up the search and notice these are going to be all the home icons we can use.
Now, the one gotcha.
We need to be very specific which library we're looking for, and then we can just start using it as
a component.
Now, in order to get started, you want to install the library and then you want to import the icon
name and then the React Icons library, forward slash, and then the actual icon library you're going
to use.
So let's try it out.
I'm going to go to NAV Bar since that's the.
Next component we're going to work on.
And effectively I want to get the home icon.
So this icon is coming from Font Awesome library.
So we're going to go with for home from then React icons and then forward slash and for as a side note
in their docs, you can just click on the icon and the name will be automatically copied to the clipboard.
Which of course makes it very easy to go back to the project and grab the icon.
But again, make sure that you import from the specific library, otherwise you'll get the error.
And when it comes to a NAV bar.
For now.
I'm just going to place it over here.
I'll set up a heading two with the nav bar.
Again, this is temporary.
We'll change all of this in the next video.
And let's just go with home.
And if everything is correct, we should see the home icon in the nav bar.