How to Deploy Code to Azure
Automating your web app deployment process is essential. However, automation is about more than making your life easier. Automation also includes eliminating mistakes that can occur from routine actions.
Azure App Services is a great utility to handle the automation of building and scaling the backend infrastructure for things like REST API services. The only thing you need to configure in your toolchain is deploying your codebase to Azure App Services. So, let's discuss how to move your web app from your development environment to production in Azure.
What is Azure App Service?
Azure App Service is a managed web platform for hosting web apps, REST APIs, and mobile backends. Microsoft built Azure App Service with continuous deployment and DevOps in mind. As a result, Azure App Service manages things like security, load balancing, and scaling automatically. That makes Azure App Service an excellent option for hosting applications developed in an agile fashion or with small development teams.
How to Deploy Code to Azure App Service
One of the beautiful things about Azure App Services is how easy it is to deploy code to it. You have four different options for deploying code to an Azure App Services account:
Visual Studio Web Deploy
CI/CD via Source Control
Let's walk through each option.
How to transfer apps to a Azure App Service account with Visual Studio Web Deploy
Pushing code to Azure App Services through Visual Studio is easy. Note that these instructions are for the full version of Visual Studio and not Visual Studio code. To publish your codebase to Azure App Services, follow the instructions below:
Right-click on the Solution name from the project browser window. Then choose Publish from the pop-out menu.
The pop-out menu will have multiple steps to complete through its wizard. We assume that you already have an Azure App Services account created and configured for the rest of these steps. So, choose the 'Select Existing' option.
The wizard’s next step will give you the option to change the Azure account you are logged in with. It will also let you change the subscription level, the resource group, and your pre-configured Azure App. First, make sure you are logged in to Azure with the correct email account. Next, visual Studio will pull your current subscription type and resource group for you. Most people will not need to change those settings. Next, select your app from the Azure App selection list. Finally, press OK.
That's it! Visual Studio will push your app to your Azure App Service account. Azure App Service will then package and deploy your web app automatically.
How do I transfer my app to my Azure App Service account with FTP?
If you have ever transferred files with an FTP client, you should have no issues deploying your code to Azure App Service with FTP. However, you will need to configure an FTP user account in your Azure App Services account first.
Log in to your Azure Web Dashboard and navigate to your Azure App Services portal. Then select the app that you want to configure.
Notice on the left-hand side of the dashboard Azure lists your FTP hostname and username.
Notice that there isn't an FTP username set yet. We need to create that FTP username before we can transfer our application to Azure App Services. So, let's do that.
Click on Deployment Center in the left-hand navigation bar in the Azure Web portal.
The Deployment Center screen will list various deployment methods such as OneDrive, Git, etc.… FTP should be listed at the bottom of this list. Select the FTP option.
The credentials screen for the FTP account will default to the App Credentials tab. So, for the moment, ignore the settings on the App Credentials tab and select User Credentials instead. Then, enter your desired FTP username and password in the form on this tab and click the Save Credentials button.
After creating an FTP user account for your Azure App Services account, use your favorite FTP application to transfer your code to Azure App Services. Next, use the user account you just created to log in to the FTP site. Likewise, use the FTP endpoint listed in the FTP area of the Deployment Center screen as the URL to connect to.
How to Use Kudo to Edit Files in Azure App Services
If you have ever worked with WordPress or CPanel in a shared hosting environment to edit files on your website, then you will be right at home with Kudo. Kudo is the engine that powers a lot of the components of Azure App Services. Those components include source control-based deployment and code ingestion from 3rd party services like DropBox or OneDrive. It just so happens you can browse your app directory and edit files with Kudo in a web browser, too.
To access your Azure App Service deployment with Kudo, follow the directions below:
Log into your Azure App Services web portal and navigate to the Overview page.
In the Overview page, locate your Azure App Services URL, copy the URL link, and navigate to that URL in your web browser.
You need to edit the URL in the address bar for your Azure App Services deployment page. The URL will have a subdomain with your App name followed by 'azurewebsites.net.' Next, add '.scm' between the subdomain for your app and the 'azurewebsites.net' parts of the link. It should look similar to 'https://myappname.scm.azurewebsites.net.' After editing the URL, navigate to this page. This will open the Kudo web dashboard for your Azure App Services deployment.
Locate the Tools menu in the navigation bar on the Kudo Azure App Services web page. In the submenu for Tools, there will be an option called 'Zip Push Deploy.' Select that option.
The Zip Push Deploy page will give you the directory structure for your Azure App Services app. From this page, you can download individual files, edit them, or delete them. Use this page to edit or delete individual files from your app directory.
Your app will need to be restarted in Azure App Services before any changes take effect.
That's it! Editing files directly in your app is that easy. However, it is recommended to only use this option if you need to update a specific file or make minor changes. Keep in mind, changes made using the Kudo web dashboard will not replicate to your source control.
An Overview How to Deploy Code to Azure [Video]
In this video, Knox Hutchinson covers various code deployment options for your Azure app service. There are four primary options with benefits that range from being very user-friendly and easy to use to being incredibly powerful and integrating with Github. By the end of the video, you should feel comfortable choosing the best code deployment option for your situation.
Now that you understand how to deploy code to Azure App Service, you might be interested in utilizing Azure for the rest of your DevOps toolchain. If that is the case, consider taking our Azure Development training course to learn how Azure can streamline your IT infrastructure.
We covered three different ways to upload, edit, and deploy your codebase to your Azure App Services account:
Deploy to Azure App Services directly through Visual Studio
Upload files to Azure App Services via FTP
Edit files in your active app in Azure App Services with Kudo
If you use Visual Studio as your IDE and code editor of choice, deploying apps to Azure App Services through Visual Studio is the easiest option. However, keep in mind, that option is only available for Visual Studio and not VS Code.
If you use Git or SVN for your source control, using the FTP method to deploy apps to Azure App Services may be the better option. The same instructions used to create an FTP account for your Azure App Services account can also be used to create credentials and an automated pipeline for Git or SVN services.
Finally, Kudo is an excellent option to inspect your app deployment in Azure App Services through the web browser. You only need to add '.scm' after the subdomain for your Azure App website to use the Kudo web dashboard for your app. In addition, you can edit, delete, and upload new files to your app in the Kudo web dashboard. Of course, you will need to restart your app if you make any changes to the Kudo dashboard.
Each option has its pros and cons. We hope that understanding the differences between each deployment method will make using Azure App services much faster.