Web apps – deploy to Microsoft Azure

Microsoft Azure deployment for web apps.

 

Assumptions and prerequisites

You are registered in the level-4 ASP.NET MVC web apps programming course, in Winter 2016 or later.

A web app was created with Visual Studio 2015 with Update 1 or later.

You have a Microsoft Account (signup.live.com).

If your app uses Entity Framework, then Code First Migrations have been configured.

 

Redeem your Azure Pass

Recently, you received an Azure Pass.

In a browser, visit this page to redeem the pass: microsoftazurepass.com

 

Microsoft Azure services, and planning to use them

For this course, we will use Microsoft Azure web apps and sql databases.

An Azure Pass enables you to create up to ten (10) web apps, and two (2) database servers. A database server can hold one or more sql databases.

Database Server

For this course, you will use one (1) database server. (In that server, you will use three (3) sql databases for sure, for Assignments 7, 8, and 9.)

The database server name can be the same as your Microsoft Account login name. For example:

pmcintyr-wa2016

During the creation of the database server, you must create or define credentials. This is a normal task, and similar to your past experience with database servers. We suggest (and recommend) that you use the same login name and password as your Microsoft Account.

SQL Databases

A database server can hold one or more sql databases, and each sql database name will be customized for the assignment. For Assignment 7, the sql database name will be:

Assign7Store

Web Apps

For this course, you will use three (3) web apps for sure, for Assignments 7, 8, and 9. The recommended web app names will be a composite of part of your Microsoft Account login name, and the assignment name.

For example, if your login name is “pmcintyr-wa2016”, and you want to create a web app for Assignment 7 (“a7”), then use this web app name:

pmcintyr-wa2016a7.azurewebsites.net

 

In the next section, you will implement these plans.

 

Login to the Microsoft Azure portal

In a browser, login to the Microsoft Azure management portal, using your Microsoft Account credentials.

https://portal.azure.com

The portal will give you a brief tour of its capabilities. Follow the tour and learn. Then, look around on your own.

 

Create a sql database and a database server

Choose New > Data + Storage. The list of services appears. Choose “SQL Database”.

ap-new-sql-db

 

The “SQL Database” configuration panel appears (below, left). Enter the database name:

Assign7Store

Next, click the server setting (which states “Configure required settings”). The database “Server” configuration panel appears (below, right).

ap-new-sql-db-settings

 

For the “Resource group” setting, create a new resource group; we suggest naming it “BTI420” (or “INT422” if you are in the INT422 class).

Yes, choose to Create a new server. A new panel appears.

ap-db-new-server

 

As noted above, the database server name can be the same as your Microsoft Account login name. For example:

pmcintyr-wa2016

We suggest that you select “South Central US” for the location. In a later step, it appears that the portal creates web apps in that location, and we want to have the same location for our web app and database server.

When you’re ready, click the Create button. The portal will create the database, within a few seconds or minutes.

 

Create a web app

The following procedure will enable you to create the web app for your Assignment 7 work.

In the Azure portal, choose New > Web + Mobile, and then “Web App”.

ap-web-app

 

The “Web App” configuration panel appears. Enter the app name (which will be the host name), suggested earlier:

pmcintyr-wa2016a7.azurewebsites.net

The other settings are good as they are. Click the Create button when ready.

ap-web-app-settings

 

Publish (deploy) your web app and sql database to Azure

Before you leave the Azure portal, you will need a “connection string”.

On the Azure dashboard (desktop), select your sql database item (e.g. Assign7Store). A setting panel opens.

ap-sql-db-settings

 

Show database connection strings. You will need the ADO.NET string. Use the right-side icon to copy it to the clipboard. Later, you will paste it into the Visual Studio “publish” dialog, and enter your own database server password.

ap-db-conn-string-1

 

Open your project in Visual Studio

Make sure that it builds/compiles without error.

And runs locally, successfully.

And has been configured with the Migrations feature.

In Solution Explorer, right-click your project item, and choose Publish.

publish01

 

In the Profile settings, choose “Microsoft Azure Web Apps” as the publish target. A dialog appears. You may have to provide credentials, and select a subscription. After doing so, you will see your existing web apps in a resource group.

publish02

 

On the next panel – Connection – click the Validate Connection button, to ensure that the settings are correct.

publish03

 

Click the Next button. This panel – Settings – needs some work.

Paste the connection string that you copied above (from the Azure portal). Then, replace…

{your_password_here}

…with your database server password.

Then, select (check) the checkbox, “Execute Code First Migrations…”.

publish04

 

Click Next. On this panel – Preview – you get an opportunity to preview the actions that will happen. It is always a good idea to do this.

publish05

 

If the list of files to be added or updated makes sense, then click the Publish button. Visual Studio will copy the web app and sql database definition to Azure.

Then, it will open the web app in a browser.

Please note that this publish task will NOT copy data from your local computer’s database, to the Azure database. Therefore, you MUST re-create user names, and any initial data that you need.

 

 

 

 

 

 

 

 

 

 

.

.

.

.

.

.

.

.

.

.

.

.

.

.

.

Advertisements
  1. No comments yet.
  1. No trackbacks yet.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: