Introduction
Deploying a web application to Azure is a crucial skill for any cloud engineer. In this guide, I will walk through the step-by-step process of deploying a simple HTML web app resume, on Microsoft Azure using the Azure Portal. By the end of this tutorial, you will have your web app hosted on Azure App Service, making it accessible from anywhere.
Step 1: Create an Azure Account
If you don’t have an Azure account yet, you can create a free one at Azure Portal. Azure offers a free tier with credits that allow you to test and deploy small applications.
Step 2: Create a Resource Group
- Log in to the Azure Portal.
- Click on Resource Groups in the left-hand menu.
- Click Create and enter:
- A Resource Group Name (e.g.,
MyResourceGroup
) - A Region (e.g.,
North Europe
)
- A Resource Group Name (e.g.,
- Click Review + Create, then Create.
I will be using a Resource Group created for this lab exercise called SheroGlobalRG
.
Step 3: Create a Web App
- In the Azure Portal, search for App Services and click Create.
- Fill in the details on the Basics page:
-
Name: A unique web app name (e.g.,
ahmadkuraishiresume
). -
Resource Group: Select
MyResourceGroup
(the one you created in step 1). Mine isSheroGlobalRG
. - Publish: Choose Code.
- Runtime Stack: Select HTML.
- Operating System: Choose Windows.
- Region: Select the same region as your resource group.
- App Service Plan: You can create a new one or use the default service plan.
-
Name: A unique web app name (e.g.,
- Click Review + Create, then Create. Leaving every other tab in the default setting.
- After deploying the web app, select Go to Resource to access it.
Step 5: Use the Advance Tool to Deploy Web Content
- Search for the Advance Tool on the left-hand menu, launch the tool, and select Go to access the Kudu+ web page.
- Click on Debug Console and select CMD.
- Select Site, followed by wwwroot in the next page.
- Click on the edit or pen icon shown below to paste the content of your HTML file.
- Note: You can easily generate a HTML simple resume of your choice using ChatGPT if you're not familiar with it.
- Paste your HTML code here and select Save.
Step 6: Access Your Web App
After saving your code on Kudu+, head back to the web app resource created earlier and copy the default domain, and lunch it on a browser of your choice.
This is the outcome you should expect in yours:
Conclusion
Congratulations! You have successfully deployed a simple HTML resume web app to Azure using the Azure Portal. This guide covered creating a resource group, setting up an App Service Plan, and deploying your code through the Azure Portal. Happy coding!
If you found this guide helpful, feel free to share your thoughts in the comments below.
Top comments (0)