Navbar Component

Let's add the navbar component to handle navigation in our app.

We’ve now completed user signup, logging them in automatically and redirecting them to a dashboard. We also have a route guard in place to prevent unauthorized users from accessing the dashboard. In this chapter, we’re going to add Bootstrap’s navbar to reflect our logged-in and logged-out states, updating some links in the navbar based on their status.

Component setup

First, we’ll create the component. There’s no need for a module here because the component only consumes one service (AuthService) which is provided by AppModule. Additionally, our navbar has no routing module of its own, since it’s a component that will be shown in every view within our application.

ng g component navbar

Get hands-on with 1200+ tech skills courses.