Quickstart: Use Data API builder with Azure SQL and Azure Static Web Apps

In this Quickstart, you deploy an Azure Developer CLI (AZD) template. The template deploys an Azure Static Web App that hosts the Data API builder using it's database connections feature. The template also includes a sample application that you can use as a starting point for your solutions.

Prerequisites

• Azure subscription. If you don't have an Azure subscription, create a free trial account
• .NET 8
• Azure Developer CLI

Tip

Alternatively, open this Quickstart in GitHub Codespaces with all developer prerequisites already installed. Simply bring your own Azure subscription. GitHub accounts include an entitlement of storage and core hours at no cost. For more information, see included storage and core hours for GitHub accounts.

Deploy the template

First, deploy all of the required services using the AZD template.

1. Open a terminal in the root directory of the project.

2. Authenticate to the Azure Developer CLI using azd auth login. Follow the steps specified by the tool to authenticate to the CLI using your preferred Azure credentials.

   azd auth login
   

3. Use azd init to initialize the project.

   azd init --template dab-azure-sql-quickstart
   

   Important

   If you are running in GitHub Codespaces, you can safely omit the --template argument since the code has already been cloned to your environment.

4. During initialization, configure a unique environment name.

   Tip

   The environment name will also be used as the target resource group name. For this quickstart, consider using msdocs-swa-dab.

5. Deploy the Azure Static Web Apps solution using azd up. The Bicep templates deploy an Azure SQL database along with the supporting storage, identity, and host services. A sample web application is deployed to the web host.

   azd up
   

6. During the provisioning process, select your subscription and desired location. Wait for the provisioning process to complete. The process can take approximately five minutes.

   Note

   Not all Azure services are available in every Azure region. For more information, see Azure products by region.

7. Once the provisioning of your Azure resources is done, the template outputs a SUCCESS message along with the duration of the run.

   SUCCESS: Your application was provisioned and deployed to Azure in 5 minutes 0 seconds.
   

Configure the database connection

Now, use the database connections feature of Azure Static Web Apps to create a connection between the deployed static web app and the deployed database. This feature uses Data API builder seamlessly to create a connection to a running Azure SQL database using the credentials you specify.

1. Navigate to the Azure Static Web App resource in the Azure portal.

2. Configure the static web app to add a Database Connection to the Azure SQL database using these settings. Then, select Link.

   	Value
   Database type	Azure SQL Database
   Subscription	Select the subscription you used for the AZD deployment
   Resource group	Select the resource group (environment) you used for the AZD deployment
   Resource name	Select the only SQL server resource with a prefix of srvr-*
   Database name	adventureworkslt
   Authentication type	User-assigned managed identity
   User-assigned managed identity	*Select the only managed identity resource with a prefix of ua-id-*

   

3. Now, select the Browse option on the resource page to observe running web application.

   

Clean up

When you no longer need the sample application or resources, remove the corresponding deployment and all resources.

1. Remove the deployment from your Azure subscription.

   azd down
   

2. Delete the running codespace to maximize your storage and core entitlements if you're using GitHub Codespaces.

Next step

REST endpoints