So this is the fourth blog post about the new features of Windows Azure and the second part of Windows Azure Web Sites. But this is not just focus on the WAWS since the function I’m going to introduce is available in both Windows Azure Web Sites and Windows Azure Cloud Service (a.k.a. hosted service).

In the previous post I talked about the Windows Azure Web Sites and how to use its gallery to build a WordPress personal blog without coding. Besides the gallery we can create an empty web site and upload our website from vary approaches. And one of the highlighted feature here is that, we can make our web site integrated with a source control service, such as TFS and Git, so that it will be deployed automatically once a new commit or build available.

Create New Empty Web Site

In the developer portal when creating a new web site, we can select QUICK CREATE item. This will create an empty web site with only one shared instance without any database associated. Let’s specify the URL, region and subscription and click OK.

After a few seconds our website will be ready. And now we can click the BROWSE button to open this empty website.

As you can see there is a welcome page available in my website even thought I didn’t upload or deploy anything.

This means even though the website will be charged even before anything was deployed, similar as the cloud service (hosted service). It is because once we created a website, Windows Azure platform had arranged a hosting process (w3wp.exe) in the group of virtual machines.

Create Project in TFS Preview Service and Setup Link

Currently the Windows Azure Web Sites can integrate with TFS and Git as its deployment source, and it only support the Microsoft TFS Preview Service for now. I will not deep into how to use the TFS preview service in this post but once we click into the website we had just created and then clicked the “Set up TFS publishing”, there will be a dialog helping us to connect to this service. If you don’t have an account you can click the link shown below to request one.

Assuming we have already had an account of TFS service then we need to create a new project firstly. Go to your TFS service website and create a new project, giving the project name, description and the process template.

Then, back to the developer portal and clicked the “Set up TFS publishing” link. In the popping up window I will provide my TFS service URL and click the “Authorize now” link.

Click “Accept” button to allow my windows azure to connect to my TFS service.

Then it will be back to the developer portal and list all projects in my account. Just select the one I had just created and click OK.

Then our website is linking to the TFS project I specified and finally it will show similar like this below. This means the web site had been linked to the TFS successfully.

Work with TFS Preview Service in VS2010

In the figure above there are some links to guide us how to connect to the TFS server through Visual Studio 2010 and 2012 RC. If you are using Visual Studio 2012 RC, you don’t need any extension. But if you are using Visual Studio 2010 you must have SP1 and KB2581206 installed.

To connect to my TFS service just open the Visual Studio and in the Team Explorer, we can add a new TFS server and paste the URL of my TFS service from the developer portal.

And select the project I had just created, then it will be listed in my Team Explorer.

Now let’s start to build our website. Since the website we are going to build will be deployed to WAWS, it’s NOT a cloud service, NOT a web role. So in this case we need to create a normal ASP.NET web application. For example, an ASP.NET MVC 3 web application.

Next, right click on the solution and select “Add Solution to Source Control”, select the project I had just created.

Then check my code in.

Once the check-in finished we can see that there is a build running in the TFS server.

And if we back to the developer portal, we will see in our web site deployment page there’s a deployment running.

In fact, once we linked our web site to our TFS then it will create a new build definition in our TFS project. It will be triggered by each check-in and deploy to the web site we linked automatically. So that when our code had been compiled it will be published to our web site from our TFS server.

Once the build and deployment finished we can see it’s now active on our developer portal.

Now we can see the web site that created from my Visual Studio and deployed by my TFS.

Continue Deployment through VS and TFS

A big benefit when using TFS publishing is the continue deployment. Now if I changed some code in my Visual Studio, for example update some text on the home page and check in my changes, then it will trigger an new build and deploy to my WAWS automatically.

And even more, if we wanted to rollback to a previous version we can just select an existing deployment listed in the portal and click REDEPLOY at the bottom.

Q&A: Can Web Site use Storage work with a Worker Role?

Stacy asked a question in my previous post, which was “can a web site use Windows Azure Storage and furthermore working with a worker role”. Since the web site is deployed on the windows azure virtual machines in data center, it must be able to use all windows azure features such as the storage, SQL databases, CDN, etc.. But since when using web site we normally have a standard ASP.NET web application, PHP website or NodeJS, the windows azure SDK was not referenced by default. But we can add them by ourselves.

In our sample project let’s right click on my MVC project and clicked the “Manage NuGet packages”. And in the dialog I will search windows azure packages and select the “Windows Azure Storage” to install.

Then we will have the assemblies to access windows azure storage such as tables, queues and blobs. Since I have a storage account already, let’s have a quick demo, just to list all blobs in a container. The code would be like this.

   1: using System;

   2: using System.Collections.Generic;

   3: using System.Linq;

   4: using System.Web;

   5: using System.Web.Mvc;

   6: using Microsoft.WindowsAzure;

   7: using Microsoft.WindowsAzure.StorageClient;

   8:  

   9: namespace WAASTFSDemo.Controllers

  10: {

  11:     public class HomeController : Controller

  12:     {

  13:         public ActionResult Index()

  14:         {

  15:             ViewBag.Message = "Welcome to Windows Azure!";

  16:  

  17:             var credentials = new StorageCredentialsAccountAndKey("[STORAGE_ACCOUNT]", "[STORAGE_KEY]");

  18:             var account = new CloudStorageAccount(credentials, false);

  19:             var client = account.CreateCloudBlobClient();

  20:             var container = client.GetContainerReference("shared");

  21:             ViewBag.Blobs = container.ListBlobs().Select(b => b.Uri.AbsoluteUri);

  22:  

  23:             return View();

  24:         }

  25:  

  26:         public ActionResult About()

  27:         {

  28:             return View();

  29:         }

  30:     }

  31: }

   1: @{

   2:     ViewBag.Title = "Home Page";

   3: }

   4:  

   5: <h2>@ViewBag.Message</h2>

   6: <p>

   7:     To learn more about ASP.NET MVC visit <a href="http://asp.net/mvc" title="ASP.NET MVC Website">http://asp.net/mvc</a>.

   8: </p>

   9: <div>

  10:     <ul>

  11:         @foreach (var blob in ViewBag.Blobs)

  12:         { 

  13:             <li>@blob</li>

  14:         }

  15:     </ul>

  16: </div>

And then just check in the code, it will be deployed to my web site. Finally we can see the blobs in my storage.

This is just an example but it proves that web sites can connect to storage, table, blob and queue as well. So the answer to Stacy should be “yes”. The web site can use queue storage to work with worker role.

Summary

In this post I demonstrated how to integrate with TFS from Windows Azure Web Sites. You can see our website can be built, uploaded and deployed automatically by TFS service. All we need to do is to provide the TFS name and select the project.

Not only the Windows Azure Web Site, in this upgrade the Windows Azure Cloud Services (hosted service) can be published through TFS as well. Very similar as what we have shown below.

But currently, only Microsoft TFS Service Preview can be integrated with Windows Azure. But I think in the future we can link the TFS in our enterprise and some 3rd party TFS such as CodePlex to Windows Azure.

Hope this helps,

Shaun