Azure for Students: Setting up a high score server – Part 1: Creating and publishing a web app

I recently gave a “Rather Useful Seminar” at Hull University in which I talked about and tried to show off how we can do cool things using the free Microsoft Azure subscription that students can access through Microsoft’s DreamSpark program. One of the things I went through was setting up a server to store and retrieve high scores from a web server.

However, there’s only so much I can get across in a 10-minute talk, so in this post I’m going to go through that in more detail. I’m going to assume that anyone reading this has at least basic knowledge of programming in C#, but not necessarily any experience with web development. If you need to brush up on C#, I’d recommend Rob Miles’ Yellow Book.

To follow along, you’ll need three things:

  • A Microsoft account
  • The Azure SDK (which you can download from Microsoft’s website)
  • A copy of Visual Studio 2015 – any edition (including Community) should work

What’s Azure?

Microsoft Azure is Microsoft’s cloud platform. A bunch of server farms located all over the world are operated by Microsoft, and you can host things on them such as web apps and databases and access them from anywhere. A big advantage of this is that it lets you run an app, store data, and retrieve data without needing any infrastructure. That’s useful for students, especially, as it means that the university doesn’t have to host anything, and you don’t need access to a physical server to run anything either – Microsoft takes care of all of that for you. All you need to do is publish your app.

Setting up an Azure subscription

If you have a DreamSpark subscription through your university, you can set up an Azure account for free, by doing the following:

  1. Go to the DreamSpark software catalogue: https://www.dreamspark.com/Student/Software-Catalog.aspx
  2. Select “Microsoft Azure for DreamSpark” under “Servers and Applications”
  3. Follow the instructions to finish setting up your account. You will be asked to provide proof of academic enrolment. Usually, this involves confirming your identity with your .ac.uk email address or entering credentials for your account at the university.
  4. You’ll be able to link your Azure subscription to a Microsoft account here – one you’ve done this, you’re good to go with your Azure subscription.

What we’re making

What this post will go through is the basics of setting up a server to store high scores on a video game. To do this, we’ll be setting up a web service with a REST API which lets us retrieve scores and submit them. Then, to store the scores between sessions, we’ll be linking the web service to a MySQL database.

What’s a REST API?

REST stands for “REpresentational State Transfer”. A RESTful service is a web service that performs different actions depending on the web request sent to it.
For example, sending a GET request might retrieve some data, whereas sending a POST along with some data might store that data in the database.

Getting started

The first thing we need to do is open a new project in Visual Studio. Select “Web > ASP.NET Web Application” from the list of project types:
ASPnetAppSelected

Then, select “Web API” from the list of templates. Set the “Authentication” to “No Authentication”.

To make things a bit easier later on, sign in to Visual Studio using the Microsoft account your Azure subscription is linked to.

Setting up a web app on Microsoft Azure

On the last screenshot, you probably noticed a checkbox saying “Host in the cloud”. If you tick it, you’ll be prompted to create a new web app on Azure from within Visual Studio, and your site can be published to there. You can also create a web app after creating your project, which is what we’re going to go through here.

Setting up a web app is relatively easy. The first thing you need to do is go to manage.windowsazure.com and sign in with the Microsoft Account you used to set up your Azure subscription.

From here, you’ll be taken to the Azure management portal, which should look a bit like this:
AzurePortal

This portal lets you set up and manage everything you’ve got running on Azure. Now we’re here, we can set up a new web app. Click “New”, and then select “Web and Mobile” > “Web App”:
NewWebAppSelected

Give it a unique name (the portal will validate it to make sure it’s unique), select “Dreamspark” under “Subscription”, and click “Create” to start creating a new web app on Azure. As you haven’t uploaded anything to it yet, this is basically a placeholder for now.

Publishing our app to Azure

Now that we’ve created a web app, we can publish our code to it. To do this, right-click the project in Visual Studio. From the menu, select “Publish”:
PublishSelected

On the wizard, select “Microsoft Azure App Service” and click “Next”. On the list of web apps, select the app you just set up and click “OK”. Finally, click “Publish” to upload all the files from your web app, and you now have a site hosted in the cloud.

You’ve probably noticed that there’s nothing but the default content on our web service. Next post, I’ll go through linking a database to our site and setting up a custom API.

Leave a Reply

Your email address will not be published. Required fields are marked *