1. Home
  2. Training Library
  3. Microsoft Azure
  4. Courses
  5. Design Azure Web Apps for Azure 70-534 Certification

Creating Web Apps


Web App Overview
Wrap Up
1m 32s
Start course


This course will provide you with the practical knowledge and experience needed to master the Designing Web Apps section of the Architecting Microsoft Azure Solutions 70-534 certification exam. In addition to full coverage of all exam topics, this session will focus on the key competencies tested by the exam. We will start by creating a Web App, and we will discuss designing and deploying web apps for scalability and performance as well as the business continuity issues of Web App design.


Welcome back. In this lesson, we'll be talking about creating a web app, and we'll be deploying that web app to App Service.

Since we'll be talking about web apps throughout this course, it makes sense to start by actually creating one with Visual Studio. Visual Studio 2013 and greater all make interacting with Azure rather trivial. It's certainly not a requirement that development happens with Visual Studio. However, if you ask any software engineer who has done .NET development, they're likely going to tell you that it's the best IDE for .NET development. So, that's what we're going to use to create a web app. It's worth mentioning web apps aren't new to Azure, they've existed for ages. The difference here is that we're deploying the app to Azure's app service platform as a service offering.

So. Let's start in Visual Studio. We're going to select File, New, and then Project. We'll select the Web Option under Templates, and then we're just going to leave the default option. We're not going to go into detail on the other options, since it's outside of the scope of this course. We're going to give it a name, and select OK.

Alright, for this example I'm going to use an MVC app. Now, it wants to know about creating our app service. I'm going to leave the default here and just click Create. And now, our project has been created locally, however, it doesn't exist in Azure until we publish it.

So, creating a web app that will be hosted in Azure's app service is no different than web apps that we've always created. The difference here is that it ends up living in a different place. So, let's see how to get this into Azure. We're going to right click on the app in our Solution Explorer, and we'll select Publish. It'll use the Web Deploy option, and it has the information from our connection already populated. If we had an existing app in Azure already, we could download that profile and then use it here. However, we're just going to create a new one. So, we'll click the Validate Connection option. And in a moment, hopefully, it's going to come back indicating that this was successful. Okay, there it is.

So, you can see that we have some settings, we can go through on the side nav here. We don't need to edit any of these in this example, so I'm just going to click Publish. And it's going to take just a moment. And there we are. This is a site running from Azure. So, you can see why we're using Visual Studio. The integration is so nice that we never had to leave the IDE.

Let's make a change to the text on the page and then redeploy it. So, let's just change this text here. And save it, great. Now, we're going to publish this again. And it's going to take just another moment. And there, our text is now live.

So, for our example, we used C Sharp. However, App Service also supports Python, PHP, Java, Node.js, and while we did just C Sharp, any .NET language is supported. So, we do have some limits on the supported languages. However, we have pretty good coverage.

Okay, now that we've created an app, we should talk about debugging. I know that these tasks are often handled by developers. However, this is a useful skill for architects to have. So, let's check out how we can remotely debug our web app. In order to remotely debug, we first need to deploy the app to Azure with a debug configuration. So, I've already done that. And once that's set, we can use the Cloud Explorer to find our app, and then we can attach a debugger.

Okay. The page is loaded. And at the top of the page, we have this header here. It says "Deployed to Azure." And below that, you can see we have this H3, and it just says "Hello World." What I want to do is change that "Hello World." So, let's use the break point in the index method of the home controller to make that change. Alright. So, we've hit the break point. And now let's edit that message with the Immediate window. We're going to change it to Live Debugging, and we'll continue. Okay, and when the page loads, you can see that the H3 is now set to Live Debugging. And you may be wondering, what did we actually just do here? What we did is we debugged our web application that is running in Azure with our local developer tools. As architects, if we're going to recommend using Azure app service to host web apps, then the topic of debugging is bound to come up. So, knowing how to do this very useful for the real world as well as for the exam.

There are some additional tools that we can use for debugging, and we can access those from the Azure portal. Let's check those out. From the web app blade, we can scroll down to the Development Tools section, and we have a few options here. The ones that we're going to focus on are the Console and the Advanced Tools.

Now, what the Console does is it's gonna spawn a command line shell from a sandboxed environment. And we can use this to run unprivileged commands to check environment variables, get system info, etc.

And now, the next one that I like is the Advanced Tools, which launches Kudu. And with Kudu, we have all kinds of diagnostic information with an intuitive user interface. So we can see, we have environment variables at a glance. We can list off running processes. We can spawn shells, which is similar to the console that we looked at a moment ago, and we can even spawn power shell terminals as an option. So, this is a very powerful tool. And it gives us some additional options when it comes to debugging.

Alright, we've covered a lot in this lesson, so let's summarize what we've done. Azure App Service supports several languages, including the .NET languages, Python, PHP, Java, and Node.js. Also, when it comes to building web apps, Visual Studio makes it easy, because Visual Studio 2013 and greater is really well integrated. As you saw in the demo, we never had to leave Visual Studio to deploy our web app. Using paths can sometimes limit our ability to effectively debug, however, that's not the case here. We can use Visual Studio to remotely debug. We can use Azure App Service Console, as well as Kudu, under the advanced options.

So, now that we've created an app, let's talk more about the scalability and performance of App Service hosted web apps in our next lesson. So, if you're ready to keep going, then let's get started.

About the Author

Learning paths14

Ben Lambert is a software engineer and was previously the lead author for DevOps and Microsoft Azure training content at Cloud Academy. His courses and learning paths covered Cloud Ecosystem technologies such as DC/OS, configuration management tools, and containers. As a software engineer, Ben’s experience includes building highly available web and mobile apps. When he’s not building software, he’s hiking, camping, or creating video games.