Creating the Authentication Frontend
Learn how to fetch user details and send requests to the Strapi backend.
We'll cover the following
In this lesson, we’ll develop a frontend that’s capable of fetching users’ details and sending them to the Strapi API. The frontend will also perform actions based on the response it gets from the Strapi API.
For our application, we want to allow users to save recipes to their favorites so they can look up recipes that they want quickly and without having to search for them again. To associate users with their saved recipes, we’ll need to authenticate them and fetch their details.
Because we have the backend set up already, we need to create a front-end application capable of consuming the back-end APIs and authenticating users.
Creating the authentication context
Before we can implement our application’s authentication functionality, we need to set up a few things. We’ll need a few helpers, as well as an authentication context and context provider. Let’s get started with those implementations.
The helpers.js
and constants.js
files will go in the /utils
folder. Both of these files contain a few utilities and helper functions that will be used for multiple pages. We’re keeping them in a separate file to keep the code modular and to avoid redundancy.
Get hands-on with 1200+ tech skills courses.