Publish Site from TF Service to Azure Website

Today, we are going to go through all the steps of connecting a project in TF Service to Azure using integrated continuous build.

First thing we’ll do is create a new Team Project in TF Service by browsing to the root of your visualstudio.com site and clicking New Team Project.

Complete the new project form selecting Team Foundation Source Control.

Open Visual Studio and create a new web application selecting to add to source control.

For the purpose of this tutorial, make a small change to the application and then check-in the code.

At this point, you should be able to go into your TF Service interface and you’ll see the latest changes to your website as you’d expect. Next, we’ll go to the Azure portal and create a new blank website and connect it to our source control.

Browse to https://manage.windowsazure.com/, in the bottom left (after logging in) you’ll notice a new button. Click it.

Click Compute > Web Site > Custom Create

Type a URL for your site and click Publish from source control. And click next.

You’ll find a variety of source control vendors including the local GIT repo that was recently introduced to TF Service, for this tutorial we will select Team Foundation Service which is where we checked our website into earlier, and click next.

Type your visualstudio.com account URL in and click Authorize Now. This should bring up a window as below which you should now select Accept.

Next, you should select the Team Project Name that you want to connect to and click complete.

You’ll see for a short while that there will be a little loader saying creating, this is creating your site in Azure and also adding a build definition to TF Service for continuous integration.

When the creating changes to running, you can click on the site and at the bottom you’ll see a browse button. This should browse to your new site and it should have the default blank Azure site.

Now if you go back into Visual Studio and click on the menu bar in Team Explorer and select Builds...

...you’ll notice that there is a new build definition for your new site (if the definition is disabled, right click and click edit Build Definition, select enable under the general tab and save the definition).

Now right click on your build definition and click Queue New Build, and then click Queue (if the build didn’t run automatically by itself).

If you click on the build request you should see a screen like this, that will update with results of the build so you don’t need to refresh to see progress.

Now if you refresh your Azure site, you’ll notice your website has been published.

Obviously you can alter the Build definition, maybe you’d rather not have builds off every check in and only configure manual deploys.

Hopes this tutorial helps.