Move to Azure with a Web App
Published May 03 2023 10:49 AM 5,766 Views
Microsoft

I recently saw a discussion on what value does the cloud actually bring to people. Why migrate? Beyond the most stated reasons, elasticity (aka add a host, VM, app or container on the fly), resiliency with Azure regions, Availability sets and zones. Maybe we should ask why wouldn't you migrate applications that make sense to move from on-premises to Azure?


There will always be debate on what's right for your organization but there are many ways you can benefit from cloud.  I thought it simplest to start with a web application.  These can be run on a physical server, a virtual machine, a container but you can also run them as an Application Service in Azure.


Have I done this before? No.  I followed these instructions with some modifications that I'll show in this post.  Is it a Hello World type of output? Yes, but we all start somewhere.

 

If you want to just jump to the Why click here

 

Azure App Service

You can deploy pretty much any flavor to the Azure App Service; Node.js, Python, Wordpress, Java. etc and even a static HTML site.  I chose ASP.NET which also has different (.NET) versions and are supported.  Azure App Service is also cross platform functional so you can host on Linux or Windows.  Along with being able to scale, and self-patch while hosting your web service.  There are also different platforms to deploy from depending on your comfort level - PowerShell, Visual Studio, Visual Studio Code, Azure Portal and Azure Cli.  I used PowerShell when the .NET Cli commands are referenced.

 

Creating an ASP.NET Web APP

So open up PowerShell make sure you have the Pre-requisites mentioned in the Learn Module

In the Learn Module, it references the .NET CLI because we're basically running the .NET commands but, in our PowerShell Terminal,

 

Creating a new webapp called MyFirstAzureWebApp and changing the local directoy to MyFirstAzureWebApp

 

 

dotnet new webapp -n MyFirstAzureWebApp --framework net6.0
cd MyFirstAzureWebApp

 

 

In the terminal you will then see

 

 

PS C:\WINDOWS\system32> dotnet new webapp -n MyFirstAzureWebApp --framework net6.0
cd MyFirstAzureWebApp

Welcome to .NET 6.0!
---------------------
SDK Version: 6.0.408

Telemetry
---------
The .NET tools collect usage data in order to help us improve your experience. It is collected by Microsoft and shared with the community. You can opt-out of telemetry by setting the DOTNET_CLI_TELEMETRY_OPTOUT environment variable to '1' or 'tru
e' using your favorite shell.

Read more about .NET CLI Tools telemetry: https://aka.ms/dotnet-cli-telemetry

----------------
Installed an ASP.NET Core HTTPS development certificate.
To trust the certificate run 'dotnet dev-certs https --trust' (Windows and macOS only).
Learn about HTTPS: https://aka.ms/dotnet-https
----------------
Write your first app: https://aka.ms/dotnet-hello-world
Find out what's new: https://aka.ms/dotnet-whats-new
Explore documentation: https://aka.ms/dotnet-docs
Report issues and find source on GitHub: https://github.com/dotnet/core
Use 'dotnet --help' to see available commands or visit: https://aka.ms/dotnet-cli
--------------------------------------------------------------------------------------
The template "ASP.NET Core Web App" was created successfully.
This template contains technologies from parties other than Microsoft, see https://aka.ms/aspnetcore/6.0-third-party-notices for details.

Processing post-creation actions...
Running 'dotnet restore' on C:\WINDOWS\system32\MyFirstAzureWebApp\MyFirstAzureWebApp.csproj...
  Determining projects to restore...
  Restored C:\WINDOWS\system32\MyFirstAzureWebApp\MyFirstAzureWebApp.csproj (in 99 ms).
Restore succeeded. 

 

 

Now we're going to run this locally with the command:

 

 

dotnet run --urls=https://localhost:5001/

 

 


If you open up a web browser, you'll get a lovely ASP.NET Welcome template page.

AmyColyer_0-1682553361647.png

Now we have it created locally, let's push it to Azure.

Publish the Web App

Again following the Learn Module  you need to connect to your Azure subscription using Azure PowerShell or the cloudshell

 

 

Connect-AzAccount

 

 

I had to use this command because we have dual factor authentication

 

 

Connect-AzAccount -UseDeviceAuthentication

 

 

Now we create a new resource group, App Service plan and App Service resource in Azure by using the "New-AzWebApp" command also giving it a name and location.  

 

 

New-AzWebApp -Name AmysFirstWebApp -Location westus

 

 

Final output:

AmyColyer_0-1682609687568.png

 

Now back to your local setup you can prepare our fancy website for deployment to Azure

On the terminal use

 

 

dotnet publish --configuration Release

 

 

Change to the release directory with

 

 

cd bin\Release\net6.0\publish
Compress-Archive -Path * -DestinationPath deploy.zip

 

 

Now you have that zip file local and the next step says to push it to Azure. I did this by uploading the file using the cloudshell

2023-04-27_10-42-24.gif

 

After uploading the zip file I ran the command in cloudshell to Publish

 

 

Publish-AzWebApp -ResourceGroupName AmysFirstWebApp -Name AmysFirstWebApp -ArchivePath (Get-Item .\deploy.zip).FullName -Force

 

 


Now I can go to the published URL and see the same website.

AmyColyer_0-1682610446866.png


The rest of the Learn Module is fun to do, you update the html page and end up overwriting the original home page of the web app and end up with below.  To follow those remaining steps follow here

AmyColyer_0-1682610580558.png

 

I wanted to show 1 how easy it is to get a simple app up and running there are also instructions on deploying with an Azure SQL Database - Deploy an ASP.NET Core and Azure SQL Database app to Azure App Service - Azure App Service

 

The Why

Now that we are in Azure, we can scale up or out manually or automatically, provide load balancing and start integrating DevOps capabilities (staging environments, continuous deployment, etc).  App Service is a PaaS offering providing a managed hosting service for web apps like the one we built.  You can also deploy in different ways: as code, VMs or containers and have security and compliance requirements for your Production environment.  Microsoft Defender will point out vulnerabilities and give you ways to mitigate.

AmyColyer_0-1683134956542.png

 

My Web App now has alerts, metrics, deployment slot options, authentication settings, identity and backup options as well as changing the App Service plan for autoscaling needs.

Azure Portal Options for Web AppAzure Portal Options for Web App

 

 

There is also a great flowchart here that can start you out on what compute make sense to lift and shift vs being optimized to run in the cloud.

 

You can also read more on the reasons why here.   No matter how you decide to start I think it's enjoyable to see what options you have when migrating or starting a new application in the cloud.


Thanks for reading and leave any comments below!

Co-Authors
Version history
Last update:
‎May 04 2023 08:26 AM
Updated by: