With React hooks, we’re able to implement a pattern that makes it so authenticated routes are easy.

Simply put, if a user isn’t authenticated then the routes don’t exist.

How do we do that?

Let’s create an authentication scenario.

Though this is very trivial, imagine each component here would contain more complex routing logic.

The pattern shines in its simplicity. Let’s demonstrate how we will ensure authentication.

Easy

The authenticated routes will not exist if the user does not exist either.

Finally, the root App component will be quite simple as well.