Deploy an ASP.NET Core web app to Azure using Visual Studio

By Rick Anderson and Cesar Blum Silveira

Set up the development environment

Note

The SDK installation can take more than 30 minutes if your machine doesn't have many of the dependencies.

Create a web app

In the Visual Studio Start Page, tap New Project....

Start Page

Alternatively, you can use the menus to create a new project. Tap File > New > Project....

File menu

Complete the New Project dialog:

  • In the left pane, tap Web

  • In the center pane, tap ASP.NET Core Web Application (.NET Core)

  • Tap OK

New Project dialog

In the New ASP.NET Core Web Application (.NET Core) dialog:

  • Tap Web Application

  • Verify Authentication is set to Individual User Accounts

  • Verify Host in the cloud is not checked

  • Tap OK

New ASP.NET Core Web Application (.NET Core) dialog

Test the app locally

  • Press Ctrl-F5 to run the app locally

  • Tap the About and Contact links. Depending on the size of your device, you might need to tap the navigation icon to show the links

Web application open in Microsoft Edge on localhost

  • Tap Register and register a new user. You can use a fictitious email address. When you submit, you'll get the following error:

Internal Server Error: A database operation failed while processing the request. SQL exception: Cannot open the database. Applying existing migrations for Application DB context may resolve this issue.

You can fix the problem in two different ways:

  • Tap Apply Migrations and, once the page updates, refresh the page; or

  • Run the following from a command prompt in the project's directory:

    dotnet ef database update
    

The app displays the email used to register the new user and a Log off link.

Web application open in Microsoft Edge. The Register link is replaced by the text Hello abc@example.com!

Deploy the app to Azure

Right-click on the project in Solution Explorer and select Publish....

Contextual menu open with Publish link highlighted

In the Publish dialog, tap Microsoft Azure App Service.

Publish dialog

Tap New... to create a new resource group. Creating a new resource group will make it easier to delete all the Azure resources you create in this tutorial.

App Service dialog

Create a new resource group and app service plan:

  • Tap New... for the resource group and enter a name for the new resource group

  • Tap New... for the app service plan and select a location near you. You can keep the default generated name

  • Tap Explore additional Azure services to create a new database

New Resource Group dialog: Hosting panel

  • Tap the green + icon to create a new SQL Database

New Resource Group dialog: Services panel

  • Tap New... on the Configure SQL Database dialog to create a new database server.

Configure SQL Database dialog

  • Enter an administrator user name and password, and then tap OK. Don't forget the user name and password you create in this step. You can keep the default Server Name

Configure SQL Server dialog

Note

"admin" is not allowed as the administrator user name.

  • Tap OK on the Configure SQL Database dialog

Configure SQL Database dialog

  • Tap Create on the Create App Service dialog

Create App Service dialog

  • Tap Next in the Publish dialog

Publish dialog: Connection panel

  • On the Settings stage of the Publish dialog:

    • Expand Databases and check Use this connection string at runtime

    • Expand Entity Framework Migrations and check Apply this migration on publish

  • Tap Publish and wait until Visual Studio finishes publishing your app

Publish dialog: Settings panel

Visual Studio will publish your app to Azure and launch the cloud app in your browser.

Test your app in Azure

  • Test the About and Contact links

  • Register a new user

Web application opened in Microsoft Edge on Azure App Service

Update the app

  • Edit the Views/Home/About.cshtml Razor view file and change its contents. For example:
@{
       ViewData["Title"] = "About";
   }
   <h2>@ViewData["Title"].</h2>
   <h3>@ViewData["Message"]</h3>

   <p>My updated about page.</p>
  • Right-click on the project and tap Publish... again

Contextual menu open with Publish link highlighted

  • After the app is published, verify the changes you made are available on Azure

Clean up

When you have finished testing the app, go to the Azure portal and delete the app.

  • Select Resource groups, then tap the resource group you created

Azure Portal: Resource Groups in sidebar menu

  • In the Resource group blade, tap Delete

Azure Portal: Resource Groups blade

  • Enter the name of the resource group and tap Delete. Your app and all other resources created in this tutorial are now deleted from Azure

Next steps