Deploying Code to a Web App using Azure App Services

Image for post
Image for post

I will write a tutorial on what Azure is and what Web Apps are in a different article. For now we are gonna get right into action.

Step 1:

Upon creation lets go into Resource Groups in your dashboard. If it’s not in your dashboard, just click the arrow for more services and find it, or type in App Services in the search bar.

Image for post
Image for post

After that we will hit the Add button with the Plus icon on the top left corner,

Image for post
Image for post

Fill in any name you want under Resource Names, I picked my youtube channel name:

Image for post
Image for post

Proceed with the creation

Image for post
Image for post

Now we can go back to our dashboard and select App Services

Image for post
Image for post

Then go ahead and hit Add here ->

Image for post
Image for post

Step 2:

Image for post
Image for post

I’ve filled them out as so, also important to notice the Sku and size, let’s change this so we don’t get charged any fees… There is a free option. So click on that to get to the next part:

Image for post
Image for post

Click Dev / Test tab and select option F1 for 1GB memory for free cost.

Hit apply and hit next for the creation process, so we can move to the monitoring tab.

Image for post
Image for post

Okay, we got an error. Application Insights is not supported because we selected Linux in the previous menu, but doesn’t mean we can’t create it. so let’s hit next to tags

Don’t worry about tags for this lab, let’s hit next again to Review + Create

You may get an error here if you’re using a resource group that isn’t setup for the pricing tier you selected, but if you followed my steps, we should be doing just fine.

Let’s create it!

Image for post
Image for post

Hopefully you got the same green checkmark as me for creating our deployment service.

Step 3:

Image for post
Image for post

Lets hit the dropdown arrow for Deployment details and check out the resource group we made —

Image for post
Image for post

As you can see the app is already running, so let’s go ahead and stop it, and then restart it.
Once it is running again, let’s check out some monitoring logs to see what happened.

Image for post
Image for post

So just a heads up before you view the next 2 screenshots, remember with Linux, we get a lot less options in Azure for this specific feature, so we won’t get to see many different logs. — There would be way more options here if we setup with a Windows OS.

Image for post
Image for post
Image for post
Image for post

So the only thing we’re modifying is setting the Retention Period for 5 days. What that means is the system is going to be deleting logs older than 5 days.

Step 4:

Image for post
Image for post

We see a few different options.
Local Git : If we want to Deploy from a local repository
Azure Repos : If we want continuous integration with Azure repositories
Bitbucket : If we want continuous integration with bitbucket repositories
GitHub : If we want continuous integration with a GitHub repository

Let’s go with GitHub to keep things simple.

It will ask you to login to GitHub if you aren’t already signed in. If you don’t have an account, it’s free and very easy to setup @ https://github.com

Image for post
Image for post

Again when you hit continue we will get a bunch of CI/CD options.
Kudu App Service build service : Helps us automate code building during our deployment process
GitHub Actions: Helps us automate building, testing and deployment steps.
Azure Pipelines: Helps us configure intricate pipelines with many different options and helping us automate the tedious aspects of deployment.

For this exercise I am running Kudu App Service Builder.

Image for post
Image for post

Next we get to pick our Organization/Or GitHub account, the repository (will be different for everyone) and our Branch.
If you don’t have a repository, feel free to download my Simple Calculator Python app here:
https://github.com/B00tyBay/BasicCalculator
Upload it to your GitHub so we can continue with this lab.

Once you have chosen a repository we can hit continue and finish the process.
It will take a few minutes for the deployment to go through, or longer depending on how big your code is.

Image for post
Image for post

We can click on the logs icon to monitor the status of the deployment process.

Image for post
Image for post

If you see Success (Active) then we are happy campers.

That brings us to the end of this short lab, I hope you learned something.
If you have any questions, please reach out to me on LinkedIn.

https://www.linkedin.com/in/adam-marton-beke-01458416b/

Written by

Aspiring DevOps Engineer

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store