I was wondering how easy it might be to build a Silverlight application and have it host in on Windows Azure and it turned out to be much simpler than I thought!
The steps below will demonstrate everything from creating a Silverlight application all the way to having it live hosted on Windows Azure. It’s easy?
Step 1: Create a new Azure Application in Visual Studio 2010
To begin we’ll start off by creating a new ‘Windows Azure Cloud Service’ in Visual Studio 2010 by selecting the ‘Cloud’ option under the Visual C# section as shown below, for the purpose of this project the solution will be named TimeServe.
Step 2: Create a new ASP.NET Web Role for the Azure application
To be able to run an an application in Windows Azure you need to setup roles to host the application in that is Web Roles or Workers roles or both.
For the purpose of this post we’ll just create a single web role for our application which I have named *TSWebRole. *A windows azure role is basically a Virtual Machine in the cloud on which your application will run. You can create multiple roles in your application or create multiple instances of the application within a role.
Below is a screenshot of creating the new TSWebRole mentioned above.
Step 3: Create a Silverlight application which we will host on Windows Azure
After creating the Web Role which we will use to host our application we can then create the actual application. As can be seen in the two screenshots below.
Step 4: Choose where the application will be hosted
Once you’ve created the application which you will host in Azure as per the previous steps the following dialog appears for specifying the application configuration and where to host it.
As can be seen above, I have chosen to host the newly added Silverlight application in the ‘TSWebRole‘ I created earlier. For the Silverlight application I’ve basically created a digital clock which displays the current time (to match the theme of the project ‘TimeServe’) which is a slightly modified version from the code which you can find on CodeProject in the following link. https://www.codeproject.com/KB/silverlight/SLdigitalClock.aspx
Step 5: Package the application for uploading to Windows Azure
Now that our application development has been completed we’re basically ready to upload the application to the cloud. To do so we need to create the two package files which we will then upload to azure.
To begin, right click on the cloud service application we created in step 1and select the Publish option
rather than publish directly to the Windows Azure account I’ve chosen to just create the package files only as can be seen in the two screenshots below.
Step 6: Create a Windows Azure Service for uploading our application
Once the package files are ready as per the previous steps we now need to create the Windows Azure service for uploading our application as shown below
- Login into your Windows Azure portal at https://windows.azure.com and choose the New Service option shown below.
- Choose the Hosted Services Option from the options shown below as in this case we don’t have any storage required.
- Specify the service label & description similar to what’s shown below.
- Choose an application name which we’ll use later to access the application in production as shown below as well a location of which the application will be hosted.
Step 7: Choose a deployment option for uploading the service packages
Once the service is created you can then upload the service packages in either a Production environment (as shown in the screenshot below) or in a staging environment as can be seen later.
Step 8: Upload your Windows Azure Application packages
For this application I have opted to use the Production Deployment Option directly as shown below.
After the paths to the package files created earlier have been specified as shown above you can then click Deploy to upload your application to Windows Azure.
As you can see in the screenshot above, our application is now uploaded and ready to run in the cloud! From the options above you can either upload the package files to Production or to *Staging *depending on your preferences and you can switch between each deployment.
Step 9: Run your application to make it Live!
When the application has been uploaded into your Staging or Production environments you can click on the Run button shown above to switch on your application.
After the application status turns to *Ready *as shown above you are then able to access your application via the application name we’ve defined earlier. As you can see below typing in https://timeserve.cloudapp.net will display the Silverlight application we created and we’re now up and running in the cloud!
Step 10: Use a custom domain to point to your Windows Azure application
Now that the application is live we may want to use a custom domain name to point to our application rather than use the Windiws Azure URL https://appname.cloudapp.net.
In order to do this, the only remaining thing to do is to go to your Host provider and create a CNAME record which points to your application’s cloud URL. How to setup this may vary from one hosting provider to another but below is an example on how you can set this up.
https://blog.smarx.com/posts/custom-domain-names-in-windows-azure
For my sample demo above I used the above method to point my custom domain https://www.timeserve.net to the Windows Azure application so that my application can be accessed via this domain name as shown below.
I shall be posting more on Windows Azure & Silverlight as this sample application advances over time.