Creating an ASP.NET Core web app in Azure

  1. Home
  2. Creating an ASP.NET Core web app in Azure

Return to AZ-104 Tutorial

On this page, you’ll learn to create and deploy your first ASP.NET Core web app to Azure App Service. When you’re finished, you’ll have an Azure resource group consisting of an App Service hosting plan and an App Service with a deployed web application. So, let’s begin:

Prerequisites

  • An Azure account with an active subscription. So, first, create an account for free.
  • To expand to App Service on Linux.
  • Also, install Visual Studio 2019 with the ASP.NET and web development workload.

Creating an ASP.NET Core web app

To create an ASP.NET Core web app in Visual Studio by following these steps:

  1. First of all, open Visual Studio and select Create a new project.
  2. Next, create a new project, select ASP.NET Core Web Application and verify that C# is listed in the languages for that choice, then select Next.
  3. After this, in Configure your new project, name your web application project myFirstAzureWebApp, and select Create.Configure your web app project
  4. Moreover, you can deploy any type of ASP.NET Core web app to Azure. Then, select Create.Create a new ASP.NET Core web app
  5. From the Visual Studio menu, click Debug > Start Without Debugging to run your web app locally.Web app running locally

Publishing your web app

To publish, you must first create and configure a new App Service that you can publish your app to.

So, follow these steps to create your App Service and publish your web app:

  1. First of all, in Solution Explorer, right-click the myFirstAzureWebApp project and select Publish.
  2. Then, in the Pick a publish target dialogue box, select App Service, click Create New, and then decide Create Profile.Pick a publish target
  3. In the App Service: Create new dialogue, render a globally unique Name for your app by either accepting the default name.
  4. And, for Subscription, allow the subscription that is listed and select a new one from the drop-down list.
  5. From the Resource group, click New. In New resource group name, list myResourceGroup and select OK.
  6. For Hosting Plan, click New.
  7. For Hosting Plan: Create a new dialogue.
  8. Now, leave Application Insights set to None.
  9. After this, create a new dialogue box, select Create to start creating the Azure resources.Create new app service
  10. After completion, select Publish.Publish web app to Azure Visual Studio publishes your ASP.NET Core web app to Azure, and launches the app in your default browser.Published ASP.NET web app running in Azure

Update the app and redeploy

To update, Follow the steps mentioned below:

  1. Begin with, in Solution Explorer, under your project, open Pages > Index.cshtml.
  2. Reinstate the entire <div> tag with the following code: HTMLCopy<div class="jumbotron"> <h1>ASP.NET in Azure!</h1> <p class="lead">This is a simple app that we've built that demonstrates how to deploy a .NET app to Azure App Service.</p> </div>
Practice Test for AZ-104
  1. And,to redeploy to Azure, right-click the myFirstAzureWebApp project in Solution Explorer and click Publish.
  2. On the Publish summary page, click Publish.Publish update to web app

In the end, Visual Studio launches a browser to the URL of the web app.

Updated ASP.NET web app running in Azure

Manage the Azure app

In order to manage the web app, visit the Azure portal, and search for and select App Services.

Select App Services

Moving on the App Services page, click the name of your web app.

ASP.NET

The left menu offers further pages for configuring your app.

ASP.NET App Service in Azure portal

Cleaning up resources

In the above-mentioned steps, we created Azure resources in a resource group.

From the Azure portal menu or Home page, click Resource groups, and on the Resource groups page, click myResourceGroup.

On the myResourceGroup page, make sure that the listed resources are the ones you want to delete.

Select Delete resource group, type myResourceGroup in the text box to confirm, and then select Delete.

This image has an empty alt attribute; its file name is testpreptraining.com-2-750x117.png

Reference: Microsoft Documentation

Return to AZ-104 Tutorial

Menu