Routing and authentication in React applications
To achieve authenticated experiences, we will be using routing. Before jumping into how we do this in Gatsby, let's familiarize ourselves with how routing works within React applications. Routing is the process of navigating a user around different parts of an application.
For this example, I will be bootstrapping a React project using create-react-app
. I have included steps for its installation but feel free to skip them and use your own React implementation. Keep this section's demo separate from your Gatsby project.
Important Note
In the following example, we will be using the @reach/router
package for routing. Gatsby uses @reach/router
under the hood, so by using the package here in React, it will be easy to recognize patterns when we move on to implementing them in Gatsby.
As React developers, routing is a common part of building applications – let's remind ourselves of the routing basics:
...