How To Deploy Web App To Azure Using Visual Studio

In this article, you will learn how to deploy Web app to Azure, using Visual Studio.

Let's create a simple ASP.NET MVC Project for a demo. You can choose to create any Web Application like Empty, WebForms or MVC.

Creating a MVC Project

Step 1

Open Visual Studio.

Step 2

Go to File => New Project.
  1. Select Visual C# => Web => ASP.NET Web Application.
  2. Name your Solution (eg. EasyCRM) and Project (EasyCRM.UI), followed by clicking OK.
  3. Select MVC.
  4. Change Authentication to Individual Accounts.

    ASP.NET
Now, you will see the screen given below.

ASP.NET

Now, run the Application (Start without debugging).

You will notice the screen given below.

ASP.NET

Creating Azure app

Step 1

Login to Azure. www.portal.azure.com 

ASP.NET

Step 2

New => Web + Mobile => Web App.

ASP.NET

Now, you will see a new Window, as shown below.

ASP.NET
  • App Name - This is the name of your app. Please note that your Website link will be your_app_name.azurewebsites.net.
  • Subscription - Type of Azure Subscription (Can be MSDN Visual Studio Subscription or DreamSpark Subscription).
  • Resource Name - Resource name of your app. You can add the new app to an existing Resource Group.or Create New.
  • Pin to Dashboard - Tick on this to pin the newly created WebApp to Azure dashboard.
Fill the form given above and now you will be able to see your Web app being deployed on Azure dashboard.

ASP.NET

Once your app is deployed, you will see your app, as shown below.

ASP.NET

Get Publish file

Azure Web App Publish Files are the files with .PublishSettings extensions. This is a XML file with all the information like
  • Server Name.
  • Username.
  • Password of the Web host (As of now, it is Azure).
Steps to get Publish Setting Files for Azure Web app

Step 1

Navigate to your newly created Web App. You will see Windows, as shown below.

Step 2

Now, click Get Publish Profile to download Publish Settings File.

ASP.NET

Publishing an app using Visual Studio

Publishing Web App from Visual Studio is very easy.

Step 1

Right click on your Project.

Step 2

Select Publish.

ASP.NET

Step 3

Select Import.

Step 4

Now, import the downloaded Publish File and click OK.

Step 5

Click OK, followed by Next.

ASP.NET

Step 6

Now, select Publish Method.

There are four types of Publish method provided by Visual Studio.
  • Web Deploy
  • WebDeploy Package
  • FTP
  • File System

For now, we will select Web Deploy

All the information related with your Server is filled here automatically, as shown below.
  • Server Name
  • Site Name
  • Username
  • Password
  • Destination URL
Step 7

Click Next.

ASP.NET

Step 8

Select Release Mode (If you want to publish your Web app in Debug mode, then you can easily do it).

Step 9

Click Next.

ASP.NET

Step 10

Select Web Deploy.

Step 11

Publish.

ASP.NET

Now, you will notice that Visual Studio will build the project first and then start Publishing files to Azure.

ASP.NET

Once Visual Studio finished publishing app to Azure you will be redirected to your site.

ASP.NET

Please notice that the URL of the Website will be "your_app_name.azurewebsites.net"

Summary

You learned,

  • How to create a simple ASP.NET MVC Application, using Visual Studio. '
  • How to create a Web app, using Azure.
  • Get Publish file for Azure Web App.
  • How to publish ASP.NET MVC Application to Azure Web app, using Visual Studio.