sample environment in azure cloud platform based on the shared cloud architecture -Part 1

Heshani Bandaranayake
4 min readAug 15, 2020

--

Deploy a web application into Azure

The article is as an requirement of course SENG 41283 : Distributed and Cloud Computing. https://science.kln.ac.lk/tunits/setu/index.php/component/sppagebuilder/90-seng-41283

Hello everyone,

In this blog, I’m going to walk through about how to deploy a web application (HTML, CSS, JS and AngularJS) which have a springboot backend and MySQL database in azure.

Microsoft Azure, formerly known as Windows Azure, is Microsoft’s public cloud computing platform. It provides a range of cloud services, including compute, analytics, storage and networking. Users can pick and choose from these services to develop and scale new applications, or run existing applications in the public cloud.

I split this blog into two, otherwise this is going boring. :)

Before you plan to deploy it in azure, implement a frontend, backend and DB and make sure it is working.

So, this blog I will discuss about how to deploy the web application into Azure.

First of all, you should have an azure account. You can try a free account. As below; https://azure.microsoft.com/free/?WT.mc_id=A261C142F

Here the plan what we are going to do;

· Implement or clone a simple web application

· Creating a storage in azure

· Uploading the files of web application

· Create a CDN and set the endpoints

First, you should have a web application. You can create it or you can clone the source code which I implemented. Here the link.

https://github.com/Heshanibandaranayake/sample-environment-in-azure-cloud-platform

I implemented a simple To Do application and when you enter the activity what you have then the data goes to DB through the springboot backend.

What is Azure Storage Account?

n Azure storage account contains all of your Azure Storage data objects: blobs, files, queues, tables, and disks. The storage account provides a unique namespace for your Azure Storage data that is accessible from anywhere in the world over HTTP or HTTPS

Go to the Azure Portal https://portal.azure.com/ and create a storage account.

Figure 1 azure services
Figure 2 creating azure storage

Then Review and create a storage.

Figure 3 overview of azure storage

In the left panel, there is a menu called static website. Go to that and set index document and error document names. Those are the pages that you website launched and if there is error what page should be displayed.

Storage Account -Static WebSites

I used VS Code for deploy the application into Azure.

Go to VS Code and open your project through it. This is how left panel is displayed

Figure 4 left panel in vs code

In the Azure Tab, You have to select your storage that you created in azure portal.

VS Code-Azure view

Then deploy the static website.

The files are uploading to the $web in Azure Storage Static website.

What is Azure CDN?

Azure Content Delivery Network (CDN) is a global CDN solution for delivering high-bandwidth content. It can be hosted in Azure or any other location.

Now we need to create a CDN. When you move to the storage that you create, in the left panel, there is Azure CDN under Blob Services.

Create a CDN and placed the endpoints.

Hope you enjoy the article. Next we will meet in sample environment in azure cloud platform based on the shared cloud architecture -Part 2

--

--

No responses yet