Ops / IT Pro
The course is part of these learning paths
There's a lot of effort that goes into keeping our applications available, and secure. That's why so many cloud vendors offer platforms for hosting web-based applications. If you're building web apps, APIs, mobile backends, or business processes then you should consider looking into App Service! App Service has a lot of functionality. It meets compliance standards from around the world, it's highly scalable, it supports multiple languages and makes it easy to get your code deployed.
This Getting Started with Azure App Service course it's basically an intro, but for developers and IT Pros. In this course, you'll learn about the features of App Service at a high level as well as for each component. Then you'll learn about each of the 4 components of App Service through some demos. If you're a developer or IT Pro working with Azure, but new to App Service, this course is for you.
This course will help get you up-to-speed on App Service so that you can start developing / managing apps.
Getting Started With Azure App Service: What You'll Learn
|Lecture||What you'll learn|
|Course Intro||What to expect from this course|
|App Service Overview||A high-level overview of App Service|
|Web, Mobile, API App Overview||A high-level overview of Web, Mobile, API Apps|
|Logic App Overview||A high-level overview of Logic Apps|
|Mobile Apps: Easy Tables||How to use Easy Tables as a "no-code" option|
|Mobile Apps: Client||Running the client code from an iOS simulator|
|Mobile Apps: .NET Backend||Using a .NET backend|
|Mobile Apps: Auth||Using authentication with App Service|
|API Apps||Creating API Apps|
|Logic Apps||Automating business processes|
|Web Apps||Authentication and remote debugging|
|Deployments||Deployment slots and GitHub based deployments|
|Monitoring and Logging||Monitoring and logging options|
|Scaling||Scaling up and out|
|Next Steps||What's next|
Welcome back! In this lesson we’ll check API apps, which are very similar to the Mobile Apps backend. And since Web, Mobile and API apps are basically the same thing, there’s going to be a bit of overlap.
Let’s start in the portal and create an API app, it’s really no different than the mobile app except instead by selecting an API app, the quick start will be be a bit different. So, let’s give it a name…
And now a resource group...and...let’s fast forward to once this has been created.
Okay, with the API App service created, let’s check out the quick start. Notice it has options for ASP.NET, NodeJS and Java. This is similar to the mobile quick start. If you want to try this out, then it’s worth using this option.
For this lesson we’ll create an API app inside of Visual Studio. It’s basically just Web API app, so if you’re not familiar with Web API you’ll probably want to familiarize yourself with it before we keep going.
If you’re still here then I’m going to assume you’re familiar with at least the basic structure of a Web API application.
Let’s jump into visual studio and create a new Web API app. I’ll search for Web API, and this top option is for Visual Basic, so I’ll select this second option for C#.
And then I’ll give it a name of “azure_api_app_demo” and then click okay.
Here we can select the template to use, and an Azure API App is one of the options. So I’ll select that, and notice it opens up the ability to add Web Forms and MVC. We don’t need that for this demo, however it’s an option should you need it. Similar to Mobile Apps, Auth is handled by App Service, so we don’t need to add that here. So, let’s click ok.
This will take just a moment to prepare the solution...and...there it is.
If you look through the code you’ll see that this is really just a standard web api template. Looking at the WebApiConfig shows the same route setup code you’ve probably seen a million times.
Looking at the boilerplate values controller you’ll see a familiar sight, however there are some differences, namely all of these Swagger attributes. So, this begs the question, what is Swagger?
Swagger is an open source framework for designing, documenting and consuming APIs. Microsoft didn’t want to reengineer the wheel, so they looked at the options that existed for this and landed on Swagger.
By using Swagger with your APIs you can enable APIs to be clearly documented and defined in a JSON format. By having your API so clearly defined, you allow consumers of that API to auto generate client side code to consume the API.
Swagger also has a nice UI that you can enable to make it easier to interact with your APIs, which is especially useful in development.
There’s another library that pairs with Swagger called Swashbuckle that allows your APIs to be auto discovered. We’ll check out how to enable the Swagger UI and see how it auto discovers a new controller in a bit.
Back to the code, looking at the Global asax you can see there’s not much going on here. Here’s a glimpse of the packages used by this app, notice the Swashbuckle packages, which will auto discover the APIs for us.
Okay, let’s see this API in action by running this locally. It’ll take just a moment to get started. By default there’s no home page, so it’ll throw a 403 error, however that’s expected...and there it is.
The API runs under /api and this controller will be /values. So there it is, the two hard coded values from the GET call.
There isn’t anything exciting here, you’ve probably done much more interesting stuff with Web API. However we’ll get into the cool stuff in a bit. First, I want to create a slightly more interesting controller. I’m going to use Cognitive Service’s QnA Maker and I’ll create a controller that we can pass a question to and get an answer back. You don’t need to know anything about QnA Maker for this demo, however in case you’re curious, it’s a service that parses FAQs to allow a bot to answer questions.
I’m not going to make you watch me write code, so I’m going to jump forward to once the code is complete.
Welcome back! Let’s go through the code, I have a model here called QnaAnswer that represents an answer and score that is returned from the QnA Maker API. Then I have a class called EventHubQnA, since this question and answer API is based on facts about Event Hub.
This here is a basic code sample provided by QnA Maker. It sends the question to the API...notice that it constructs the JSON string without sanitizing the user input, which means don’t use this code in production!
Once the response comes back we deserialize it into the QnaAnswer object, and return it.
Then we have this new question controller, it’s a standard Web API controller except I’ve added some logic to the GetAll and Get by ID methods.
Let’s run this locally to see if everything works… this will take just a moment to finish up...and there we go.
So if I append /api/question it should run the GetALL method, and what I expect to be returned is the string Hello, because that’s what the bot returns when you say hi, which I’ve hardcoded in that GetAll method.
And there it is, an answer of Hello, with a Score of 100.
So now if I pass in a question to the get param, it’ll send it to QnA Maker and send back a response. Let’s ask it about throughput for EventHub.
And it sends back an answer and a score. If I ask another question, it’ll send back another answer. So you can see the API is working. Let’s get this deployed to App Service with Web Deploy.
Once it’s deployed we can see if it all works inside of App Service. This takes just a moment... Okay, there is is, deployed to App Service.
If I append /api/question it returns “Hello” which is what we expect.
So far this has been all basic Web API functionality, so let’s check out Swagger through the Swagger UI. Under the App_Start folder is a Swagger Config file, and we need to enable the UI here.
So I’ll scroll down to the commented out “EnableSwaggerUI” section and uncomment it. There are a lot of settings you can adjust here, and I recommend checking this out further.
Let’s run this locally to test things out. Once this loads you need to append /swagger to the URL to get the Swagger UI to load.
So, I’ll add that...and here we go, notice we have the values controller and question controller listed here.
Expanding question shows the methods, and you can expand them to see more into and even test them out. In this case, I didn’t add anything to the Post, so let’s check out the GET. If I click “Try it out” it’ll make a get request to this endpoint and return the JSON. It also gives you the CURL syntax to use if you’re doing this on the command line with CURL.
So, let’s publish this updated code to Azure. With this code deployed to Azure, we can now use this basic API in other applications. With Swagger, you can generate client code to consume the API. And one of the ways you can consume your APIs is from Logic Apps, which are a cool part of App Service. So in the next lesson we’re going to check out how to use Logic Apps, including how to incorporate your own APIs into logic apps.
So if you’re ready to keep learning more about App Service, then let’s get started in the next lesson!
About the Author
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.