Project: YugabyteDB (App Definition and Development / Database)
File: azure-app-service.md

title: Build Applications Using Azure App Service and YugabyteDB headerTitle: Use Azure App Service with YugabyteDB linkTitle: Azure App Service description: Build Applications Using Azure App Service and YugabyteDB headcontent: Extend scalability and reliability to the data layer image: /images/tutorials/azure/icons/App-Service-Icon.svg menu: preview_tutorials: identifier: tutorials-azure-app-service parent: tutorials-azure weight: 10 type: docs In this tutorial we'll walk you through the steps to build and deploy a scalable web application using YugabyteDB and Azure App Service. Deploying to Azure App Service allows developers to leverage cloud infrastructure and build more scalable and available applications. Connecting these applications to YugabyteDB extends this scalability and reliability into the data layer! In the following sections, you will: Examine YB Shoes, a sample eCommerce dashboard application. Create a web application on Azure App Service. Provision a database cluster on YugabyteDB Managed and seed it with data. Deploy YB Shoes to Azure App Service from a local repository. A YugabyteDB Managed account. Sign up for a . An Azure Cloud account with permission to create services. Let's start by introducing YB Shoes and its functionality. YB Shoes is an eCommerce dashboard that displays current shoe inventory and recent sales. YB Shoes is backed by a Node.js server which connects to YugabyteDB Managed. The queried inventory and sales data is displayed on a ReactJS frontend. Visit GitHub to download the you will be deploying to Azure App Service. Here's the application in action, after deploying to Azure App Service. Let's cover the components required to build and deploy this application. With Azure App Service, developers can deploy applications in a variety of programming languages and application architectures. For YB Shoes, we will create a web app using Node.js. From the Azure portal, under App Services, create a web app with Node.js as the runtime stack. This allows Azure to configure the runtime environment with Node.js and the dependencies required to run the application. As we're deploying our application to Azure from a local repository on our machine, we can forego all settings related to continuous deployment and GitHub Actions. However, for production applications, these integrations greatly improve the development process by deploying applications to Azure automatically when the repository is updated, without the need for manual intervention. Additionally, by selecting a free or basic tier of Azure App Service, we will deploy our application to a single zone by default. Premium pricing plans allow for multi-zone deployments for increased

After creating your application, visit the associated URL to confirm it's up and running! Now that we've set the foundation on Azure, let's deploy a database cluster for YB Shoes on YugabyteDB Managed. For steps on creating a cluster in YugabyteDB Managed, see the . This example shows a on Azure in the westus3 region, which provides fault tolerance across availability zones, but the application also runs fine on the always-free single-node . Add the to your cluster's . Find these addresses in the Networking tab of the Azure portal. This will ensure that a connection can be made between Azure App Service and YugabyteDB. Now that we have a working cluster in YugabyteDB Managed, let's add some data. Now that our cluster is running in the cloud, we can seed it with data using the provided `schema.sql` and `data.sql` files. Use the to connect to your cluster. Execute the commands in the `schema.sql` script against your cluster. Execute the commands in the `data.sql` script against your cluster. Now that your cluster is seeded with data, it's time to deploy and run the application on Azure. As we're deploying the application from a local git repository, let's use the . It's also worth noting that Azure has a powerful extension for Visual Studio Code, which can execute the same commands. First, you need to in Azure: ```sh az webapp config appsettings set -g GROUPNAME -n APPLICATIONNAME --setting DBHOST=[YBDBHOST] DBUSERNAME=admin DBPASSWORD=[YBDBPASSWORD] DBCERTIFICATE=[BASE64ENCODEDDBCERTIFICATE] ``` After you execute this command, you can view the configuration settings in Azure portal. Next, use the Azure CLI to deploy your application code to the cloud, as follows: In the Azure Deployment Center, configure your Local Git / FTPS Credentials under User Scope. Configure the project for local git deployment as follows: ```sh az webapp deployment source config-local-git --name APPLICATIONNAME --resource-group RESOURCEGROUP ``` This outputs the git URL, similar to the following: ```output { "url": "https://bhoyer@yb-shoe-sales.scm.azurewebsites.net/yb-shoe-sales.git" } ``` Set git remote for Azure using the URL from previous output. ```sh git remote add azure https://bhoyer@yb-shoe-sales.scm.azurewebsites.net/yb-shoe-sales.git ``` Push to the Azure remote. ```sh git push azure main:master ``` After pushing code to the remote repository, Azure automatically builds and publishes the application. Once this is complete, visit your application's default domain to view YB Shoes, running in the Azure cloud infrastructure! As you see, moving an application to the cloud with Azure App Service and YugabyteDB Managed doesn't require much additional configuration. For more insight into building Node.js applications with YugabyteDB, check out .