From the course: Build Modern Web Apps with React, Hooks, State Management, and APIs Using Vite or Next.js

Unlock this course with a free trial

Join today to access over 25,200 courses taught by industry experts.

Protected routes: Introduction

Protected routes: Introduction

Hello and welcome to lesson number 7. In this lesson, we are going to discuss how we can protect our routes and use them inside the authentication flows. Before the implementation, I'm going to briefly explain what protected routes are. So right now in our application, we have a login route. If I go here and I type the correct credentials, which we have hard-coded, we get to route on this dashboard screen. But even if we type the wrong credentials and we are not directly calling the login page, we can directly call this route as well. This is not what we want, right? Every user can see its own data. So there are certain routes that we need to protect, like dashboard or products, etc. So only after the user is successfully logged in, they can view this route. Otherwise, any user who is not logged in should not be able to view this route. So right now, all these routes in our application are public routes. So we need to have a way to protect our routes and have some protected routes…

Contents