Deploy an ASP.NET web app to Azure App Service, using Visual Studio

10 min to read Contributors

Overview

This tutorial shows how to deploy an ASP.NET web application to a web app in Azure App Service by using Visual Studio 2015.

The tutorial assumes that you are an ASP.NET developer who has no previous experience with using Azure. When you're finished, you'll have a simple web application up and running in the cloud.

You'll learn:

  • How to create a new App Service web app while you create a new web project in Visual Studio.
  • How to deploy a web project to an App Service web app by using Visual Studio.

The diagram illustrates what you do in the tutorial.

Visual Studio create and deploy diagram

At the end of the tutorial, a Troubleshooting section gives ideas on what to do if something doesn't work, and a Next steps section provides links to other tutorials that go into more depth about how to use Azure App Service.

As this is a getting-started tutorial, the web project it shows how to deploy is a simple one that doesn't use a database and doesn't do authentication or authorization. For links to more advanced deployment topics, see How to deploy an Azure web app.

Apart from the time required to install the Azure SDK for .NET, this tutorial will take about 10-15 minutes to complete.

Prerequisites

Set up the development environment

The tutorial is written for Visual Studio 2015 with the Azure SDK for .NET 2.9 or later.

  • Download the latest Azure SDK for Visual Studio 2015. The SDK installs Visual Studio 2015 if you don't already have it.

    Note

    Depending on how many of the SDK dependencies you already have on your machine, installing the SDK could take a long time, from several minutes to a half hour or more.

If you have Visual Studio 2013 and prefer to use that, you can download the latest Azure SDK for Visual Studio 2013. Some screens may look different from the illustrations.

Configure a new web project

Your next step is to create a web project in Visual Studio and a web app in Azure App Service. In this section of the tutorial you configure the new web project.

  1. Open Visual Studio 2015.
  2. Click File > New > Project.
  3. In the New Project dialog box, click Visual C# > Web > ASP.NET Web Application.
  4. Make sure that .NET Framework 4.5.2 is selected as the target framework.
  5. Azure Application Insights monitors your web app for availability, performance, and usage. The Add Application Insights to Project check box is selected by default the first time you create a web project after installing Visual Studio. Clear the check box if it's selected but you don't want to try Application Insights.
  6. Name the application MyExample, and then click OK.

    New Project dialog box

  7. In the New ASP.NET Project dialog box, select the MVC template, and then click Change Authentication.

    For this tutorial, you deploy an ASP.NET MVC web project. If you want to learn how to deploy an ASP.NET Web API project, see the Next steps section.

    New ASP.NET Project dialog box

  8. In the Change Authentication dialog box, click No Authentication, and then click OK.

    No Authentication

    For this getting-started tutorial you're deploying a simple app that doesn't do user log-in.

  9. In the Microsoft Azure section of the New ASP.NET Project dialog box, make sure that Host in the cloud is selected and that App Service is selected in the drop-down list.

    New ASP.NET Project dialog box

    These settings direct Visual Studio to create an Azure web app for your web project.

  10. Click OK

Configure Azure resources for a new web app

Now you tell Visual Studio about the Azure resources that you want it to create.

  1. In the Create App Service dialog, click Add an account, and then sign in to Azure with the ID and password of the account that you use to manage your Azure subscription.

    Sign in to Azure

    If you already signed in earlier on the same computer, you might not see the Add an account button. In that case, you can skip this step or you might need to reenter your credentials.

  2. Enter a Web App Name that is unique in the azurewebsites.net domain. For example, you can name it MyExample with numbers to the right to make it unique, such as MyExample810. If a default web name is created for you, it will be unique and you can use that.

    If someone else has already used the name that you enter, you see a red exclamation mark to the right instead of a green check mark, and you have to enter a different name.

    The URL for your application is this name plus .azurewebsites.net. For example, if the name is MyExample810, the URL is myexample810.azurewebsites.net.

    You can also use a custom domain with an Azure web app. For more information, see Configure a custom domain name in Azure App Service.

  3. Click the New button next to the Resource Group box, and then enter "MyExample" or another name if you prefer.

    Create App Service dialog

    A resource group is a collection of Azure resources such as web apps, databases, and VMs. For a tutorial, it's generally best to create a new resource group because that makes it easy to delete in one step any Azure resources that you create for the tutorial. For more information, see Azure Resource Manager overview.

  4. Click the New button next to the App Service Plan drop-down.

    Create App Service dialog

    The Configure App Service Plan dialog appears.

    Configure App Service dialog

    In the following steps, you configure an App Service plan for the new resource group. An App Service plan specifies the compute resources that your web app runs on. For example, if you choose the free tier, your API app runs on shared VMs, while for some paid tiers it runs on dedicated VMs. For more information, see App Service plans overview.

  5. In the Configure App Service Plan dialog, enter "MyExamplePlan" or another name if you prefer.
  6. In the Location drop-down list, choose the location that is closest to you.

    This setting specifies which Azure datacenter your app will run in. For this tutorial, you can select any region and it won't make a noticeable difference. But for a production app, you want your server to be as close as possible to the clients that are accessing it, to minimize latency.

  7. In the Size drop-down, click Free.

    For this tutorial, The free pricing tier will provide good enough performance.

  8. In the Configure App Service Plan dialog, click OK.
  9. In the Create App Service dialog box, click Create.

Visual Studio creates the project and web app

In a short time, usually less than a minute, Visual Studio creates the web project and the web app.

The Solution Explorer window shows the files and folders in the new project.

Solution Explorer

The Azure App Service Activity window shows that the web app has been created.

Web app created in Azure App Service Activity window

The Cloud Explorer window lets you view and manage Azure resources, including the new web app that you just created.

Web app created in Cloud Explorer

Deploy the web project to the Azure web app

In this section, you deploy the web project to the web app.

  1. In Solution Explorer, right-click the project, and choose Publish.

    Choose Publish in Visual Studio menu

    In a few seconds, the Publish Web wizard appears. The wizard opens to a publish profile that has settings for deploying the web project to the new web app.

    The publish profile includes a user name and password for deployment. These credentials have been generated for you, and you don't have to enter them. The password is encrypted in a hidden user-specific file in the Properties\PublishProfiles folder.

  2. On the Connection tab of the Publish Web wizard, click Next.

    Click Next on Connection tab of Publish Web wizard

    Next is the Settings tab. Here you can change the build configuration to deploy a debug build for remote debugging. The tab also offers several File Publish Options.

  3. On the Settings tab, click Next.

    Settings tab of Publish Web wizard

    The Preview tab is next. Here you have an opportunity to see what files are going to be copied from your project to the API app. When you're deploying a project to an API app that you already deployed to earlier, only changed files are copied. If you want to see a list of what will be copied, you can click the Start Preview button.

  4. On the Preview tab, click Publish.

    Preview tab of Publish Web wizard

    When you click Publish, Visual Studio begins the process of copying the files to the Azure server. This may take a minute or two.

    The Output and Azure App Service Activity windows show what deployment actions were taken and report successful completion of the deployment.

    Visual Studio Output window reporting successful deployment

    Upon successful deployment, the default browser automatically opens to the URL of the deployed web app, and the application that you created is now running in the cloud. The URL in the browser address bar shows that the web app is loaded from the Internet.

    Web app running in Azure

    Tip

    You can enable the Web One Click Publish toolbar for quick deployment. Click View > Toolbars, and then select Web One Click Publish. You can use the toolbar to select a profile, click a button to publish, or click a button to open the Publish Web wizard. Web One Click Publish Toolbar

Troubleshooting

If you run into a problem as you go through this tutorial, make sure that you're using the latest version of the Azure SDK for .NET. The easiest way to do that is to download the Azure SDK for Visual Studio 2015. If you have the current version installed, the Web Platform Installer lets you know that no installation is needed.

If you're on a corporate network and are trying to deploy to Azure App Service through a firewall, make sure that ports 443 and 8172 are open for Web Deploy. If you can't open those ports, see the following Next steps section for other deployment options.

After you have your ASP.NET web app running in Azure App Service, you might want to learn more about Visual Studio features that simplify troubleshooting. For information about logging, remote debugging, and more, see Troubleshooting Azure web apps in Visual Studio.

Next steps

In this tutorial, you've seen how to create a simple web application and deploy it to an Azure web app. Here are some related topics and resources for learning more about Azure App Service: