Introduction

App Service Editor, formerly known as Visual Studio Online (Monaco), is a web-based editor for App Service.



It is a helpful tool for quick editing the App Service. This is a very useful tool for editing HTML, CSS, Javascript, jQuery, Angular JS or any client-side scripting effectively. On editing the files are auto save and changes are reflected on the fly to the App service URL.



Quick steps to use App Service Editor

Step I: Select App Services from your Microsoft Azure Subscription

Go to your subscription to Microsoft Azure >> App Services as depicted in below #1 diagram





Step II: Select an App Service

App Services as depicted in above #2 diagram



Step III: Select App Service Editor from Development Tools section

As highlighted in below diagram, please select App Service Editor from Development Tools section.







Step IV: Click Go to open the editor

As highlighted below, click Go to open the editor,





Step V: Remove the hostingstart.html file

As depicted in below diagram delete the hostingstart.html,





Step VI: Create new index.html file

As shown below create an index.html file





Step VII: Add the HTML code as below

Add below source code to index.html file, update the content as per your need.

<!DOCTYPE html>
<html>
<head>
    <title>Amjad Web App Home</title>
</head>
<body>
    <h1 style="color:Green;">
        Amjad has added heading here..
    </h1>
</body>
</html>




The content of index.html automatically saved.

Step VIII: Verify the changes reflect on your App Service URL

Go to your App Service URL to verify the changes as below.



Hope this article is useful for the quick development of Azure App Service.