Private Routes and Restricted Routes

There are three main types of routes that we’ll encounter in most react-router applications:

1. Public
2. Private
3. Restricted

We’ll review these routes in greater detail throughout this lesson.

What is a public route?

The public routes can be accessed by anyone, whether or not they’re logged. The home pages of most websites are public routes.

In the following application, the Home page is the public route.

What is a private route?

Private routes are only accessible to authenticated users. Common private routes include profile pages and user settings pages. In our application, a profile page should be private so that unauthenticated users can’t access it.

We’ve created a file called PrivateRoute.js in the components folder. Let’s run the coding widget in the exercise section. Open the PrivateRoute.js file, add the following code, and import it into the App.js file.