Azure App Deployment: Step-by-Step Guide from VS Code

Azure App Service provides a seamless way to host and manage web applications in the cloud. If you’re using VS Code, deploying your application becomes even easier with the Azure App Service extension (Azure widget).

In this article, we’ll walk through the step-by-step process of deploying your build to Azure App Service directly from VS Code, ensuring a smooth and efficient workflow for your cloud applications.

Deploy to Azure App using Command Line

To deploy your build to Azure App Service from VS Code, follow these steps:

Step 1: Install Required Extensions

1. Open VS Code.
2. Go to Extensions (Ctrl+Shift+X).
3. Install:
   • Azure Tools (Includes Azure App Service)
   • Azure CLI (If not already installed)

Step 2: Sign in to Azure

1. Open VS Code Terminal (`Ctrl+“`).
2. Run az login
3. A browser window will open for Azure authentication.
4. After signing in, close the browser.

Step 3: Create/Configure Azure App Service

If you already have an App Service, skip this step. Otherwise:

1. Open Azure Extension (Ctrl+Shift+X → Azure).
2. Click “Sign in to Azure” if not signed in.
3. Under App Service, click “Create New Web App”.
4. Select:
   • Subscription
   • Resource Group
   • App Name
   • Runtime (Node.js, .NET, Python, etc.)
   • Operating System (Linux/Windows)
5. Wait for the App Service to be created.

Step 4: Deploy to Azure

1. Open your project in VS Code.
2. Press Ctrl+Shift+P to open the Command Palette.
3. Search “Azure App Service: Deploy to Web App…” and select it.
4. Choose your Azure subscription.
5. Select the App Service where you want to deploy.
6. Choose the folder or ZIP containing your build (dist, publish, etc.).
7. Confirm deployment.

Step 5: Verify Deployment

1. After deployment, VS Code will show a successful deployment message.
2. Click the link to open your Azure App Service in the browser.

Azure App Deployment with VS Code Extension

You can deploy your build to Azure App Service from VS Code using the Azure App Service extension (Azure widget). Follow these steps:

Step 1: Install Required Extensions

1. Open VS Code.
2. Go to Extensions (Ctrl + Shift + X).
3. Search for “Azure App Service” and install it.

Step 2: Sign in to Azure

1. Click on the Azure icon in the Activity Bar (left side).
2. Click Sign in to Azure.
3. Sign in using your Azure account credentials.

Step 3: Open Your Project in VS Code

Make sure your application (React, .NET, Node.js, etc.) is ready for deployment.

Step 4: Deploy to Azure App Service

1. In the Azure App Service extension, find your Azure subscription.
2. Expand the App Services section.
3. Right-click on your App Service and select “Deploy to Web App…”.
4. Select the folder or project to deploy.
5. Click Yes when asked to deploy the build.

Step 5: Verify Deployment

1. Once deployed, you will see a success message.
2. Click on the provided URL to open your app.

Additional Notes:

• If you are deploying a .NET Core app, make sure you build it using:

dotnet publish -c Release -o ./publish

Keep Following – SharePointCafe.NET