This content originally appeared on DEV Community and was authored by Romanus Onyekwere
- Azure is the Cloud computing platform and Suite of cloud services provided by Microsoft.
- Azure provides various services including building and deploying web apps, logic apps, configuring databases, etc.
- In this article, let us understand the step by step how to deploy a Web App with CI/CD pipeline on Azure app service.
Step 1; Create and set up your Microsoft Azure account
- Sign in to your Azure Portal
- After signing in, you will preview this dashboard.
Create Your App Service Plan
- On the search bar of the dashboard, type app service plan and click on it and create
In the Basic tab
Under Project Details
- Choose your subscription.
- Create new Resource group or choose the existing one. Under App Sevice Plan
- Enter the name of your App service
- Select the operating system that will integrate Github action either Linux or Windows
- Select the region close to you
Under pricing tier
Click on expolore pricing plans to access free plan
Under Access App Service Pricing PlansBy default leave it at hardware view
Select free plan
Click on select
Under zone redundacyLeave it at Disabled
Click Review + Create to Validate
- Click on Create for depolyment
Go to Resource
Step 2; Create App ServiceOn Azure dashboard search for app services
Open it on new tab
On the + create dropdown, click on web app
Proceed for Configuration
On the Basics tab
Under Project DetailsSelect your Subscription
Use the existing Resource group
Under Instant DetailsChoose the name of your web app and confirm the avaliability by unchecking the botton
Leave the publish at code
For runtime stack, select PHP 8.3
Operating system is at Linux by default
Select the region of your choice
Leave others in default position
- Select next Deployment
- Leave Networking, Monitor + secure Tags in default
Click on review + create
Step 3; Create New RepositoryLogin to your Github account
Create new account and follow the prompt
If you already have account, login directly
Click on Create Repository
Make sure you fill in the neccessary fields
Repository name
Description is optional
Leave it in Public window
Add a readme file
Leave others in default
Click on Create
Create the VsCode to Clone the Repository
- Click on Code dropdown
- Copy the web url to clone by pasting it on a browser
- Open the already Installed VSCode in your system
- You will be prompted to Login with your Github details for integration with VSCode
- You can clone the repository at the Github bar from the dropdown, you will see the file name created
You can also clone directory at Git Repository
-Clone using the terminal to be more professoionalClick on the terminal botton on the three dots at the left upper window close to Run icon
Follow the prompt to create new terminal
Switch from powershell to Gitbash though both works
Type git clone which is the command or keyword used to clone the application which is the repository we just created
Copy the code Url link of the repository and paste after git clone
Hit the enter key and wait for the cloning prompt
Create directory project
Create cd project
Create git clone plus repository link all in powershell
Open a folder to view the cloned file
- Go to file icon at the upper right side of Vscode
- From the dropdown, locate create a folder
- Locate the folder following the prompt
- Select the folder and open to view the created folder
Create a file
- On Vscode, click on the terminal on top of bar
- Switch to gitbash
- Input touch index.php
- Type cd romanusapp and observe the change in directory
- Type touch index.php
- Observe thier appreance at the upper left side of Vscode
You can run html file
- Impute nano idex.php
- We can do simple expression like <?php echo:helow World"
- If we have html file that will still be alright
- From your computer keyboard, use control x to exist
- Choose Yes and press enter to save
- Impute cat index.php to see our output
- Back to Azure portal to make our connection at Depolyment center
- Click select code source to view avaliable connection options including CI/CD
- Select Github
Step 4;Push The Repository Created
This content originally appeared on DEV Community and was authored by Romanus Onyekwere
Romanus Onyekwere | Sciencx (2024-08-10T15:38:40+00:00) Deploying Web App With CI/CD Pipeline On Azure. Retrieved from https://www.scien.cx/2024/08/10/deploying-web-app-with-ci-cd-pipeline-on-azure/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.