Publishing the React Frontend to Azure

In this section, we are going to deploy our React frontend to Azure, to both staging and production environments.

Publishing to production

Let's carry out the following steps to publish our frontend to a production environment:

1. We’ll start by provisioning an Azure app service. So, let’s go to the Azure portal in a browser and go to the “App Services area,” and click the “Add” option.

2. Complete the form that opens by choosing the existing resource group, choosing an app name, and selecting .NET 7 as the runtime stack and Windows as the operating system. Note that the app name we choose needs to be reflected in the Frontend setting in the appsettings.Production.json file in our backend project. Click the “Review + create” button and then the “Create” button to create the app service.

3. Let's move to Visual Studio Code now and create a production build by running the following command in the Terminal: