1. Build and deploy a GraphQL static web app to Azure

In this article series, you'll create a GraphQL server and a web application to communicate with it. Your GraphQL server will use Azure Cosmos DB to store data, and Static Web Apps to host the application.

Create or use an existing Azure subscription

You'll need an Azure user account with an active subscription. Create one for free.

Prerequisites

Application architecture

The application architecture is shown in the following diagram:

Architectural image of the GraphQL client and server in Azure.

The React client constructs a GraphQL query by using a GraphQL client package (you'll be using Apollo), and calls the API to retrieve the data. Using a GraphQL server (you'll be using the Apollo server implementation), the GraphQL query is converted into resolver calls. You can use these calls to pass the information to a SQL query in Azure Cosmos DB. The SQL query is sent to Azure Cosmos DB, and returns the data requested. The GraphQL resolver returns the results in a well-formatted GraphQL data object.

The React client and API are hosted in Static Web Apps. The data is stored in a SQL database in Azure Cosmos DB.

Next steps