DEV Community

Cover image for App service
Ugonna
Ugonna

Posted on

App service

App Service is a managed hosting service for web apps and mobile back-ends. It allows quickly build, deploy, and scale of web apps either as code or containers. it is the easiest and cheapest service in azure that can be used to host web application. App service is platform as a service (PAAS)
To host an application on app service, you need the following:
1.A Resource group
2.An empty web application
3.App service plan
A resource group is a container that holds related resources for an Azure solution.
An App Service plan defines a set of compute resources for a web app to run.
These compute resources are created in a specific region and are used by the apps within that App Service plan.
In the article, the steps to create an app service will be outlined
Go to Azure portal, search for app service
Image description
In the app service, click +create and select web app
Image description
In project detail create the resource group named Ugonnaapp
In instance details, name the empty web application Ugonnaappone;
in public select code; in runtime stack select .NET 6(LTS); in operating system and region leave it as default which is windows and canada central respectively
Image description
In pricing plans, in Windows Plan (Canada Central) select create new and create ugonnaapponeplan.
in pricing plan select Basic B1 (100 total ACU, 1.75 GB memory, 1 vCPU) and leave the rest as default.
Image description
In tags, in name type name and in value type ugonnaappone. Then select review and create
Image description
Then select create
Image description
After the deployment, click on go to resources
Image description
To confirm it is an empty web app, below default domain copy the link and paste on a browser (https://ugonnaappone-bmfwb8bjhpa7bga0.canadacentral-01.azurewebsites.net/)
Image description
To build a bible app, search in chatgpt for sample HTML CSS JavaScript bible all in one file
Image description
copy the code
Image description
Return back to the app service, in the search bar search for advanced tools
Image description
click on advanced tools, and select go
Image description
The above action, takes you to another browser
Image description
In debug console, select CMD
Image description
A new page comes up, select site
Image description
Another page comes up, then select wwwroot
Image description
In another page, select the pencil icon beside hostingstart.html
Image description
Remove the default code there and paste the bible code from chatgpt and save
Image description
Reture back to the web app, under the link in default domain (ugonnaappone-bmfwb8bjhpa7bga0.canadacentral-01.azurewebsites.net) and paste it another browser and select click me
Image description.

Top comments (0)