Over a million developers have joined DZone.

Build and Deploy a Node.js Website to Windows Azure Using WebMatrix

DZone 's Guide to

Build and Deploy a Node.js Website to Windows Azure Using WebMatrix

· Cloud Zone ·
Free Resource

Curator's note: this tutorial originally appeared at WindowsAzure.com.

This tutorial shows you how to use WebMatrix to develop and deploy a Node.js application to a Windows Azure Website. WebMatrix is a free web development tool from Microsoft that includes everything you need for website development. WebMatrix includes several features that make it easy to use Node.js including code completion, pre-built templates, and editor support for Jade, LESS, and CoffeeScript. Learn more about WebMatrix for Windows Azure.

Upon completing this guide, you will have a Node.js web site running in Windows Azure.

A screenshot of the completed application is below:

Windows Azure node Website


To complete this tutorial, you need a Windows Azure account that has the Windows Azure Web Sites feature enabled. You can create a free trial account and enable preview features in just a couple of minutes. For details, see Create a Windows Azure account and enable preview features.


Create a Windows Azure Web Site

Follow these steps to create a Windows Azure Web Site.


To complete this tutorial, you need a Windows Azure account that has the Windows Azure Web Sites feature enabled.


  1. Login to the Windows Azure Management Portal.

  2. Click the + NEW icon on the bottom left of the portal

    The Windows Azure Portal with the +NEW link highlighted.

  3. Click WEB SITE, then QUICK CREATE. Enter a value for URL and select the datacenter for your web site in the REGION dropdown. Click the checkmark at the bottom of the dialog.

    The Quick Create dialog

  4. Once the web site status changes to Running, click on the name of the web site to access the Dashboard

Import the web site into WebMatrix and apply the Express template

  1. From the Dashboard, click the WebMatrix icon at the bottom of the page to open the web site in WebMatrix 2.

    Launch WebMatrix

  2. If WebMatrix 2 is not installed, Web Platform Installer 4.0 will install Microsoft WebMatrix 2 and all necessary prerequisites. WebMatrix will launch and display a dialog indicating Empty Site Detected. Click Yes, install from the Template Gallery to select a built-in template.

    empty site detected

  3. In the Site from Template dialog, select Node and then select Express Site. Finally, click Next. If you are missing any prerequisites for the Express Site template, you will be prompted to install them.

    select express template

  4. After WebMatrix finishes building the web site, the WebMatrix IDE is displayed.

    webmatrix ide

Publish your application to Windows Azure

  1. In WebMatrix, click Publish from the Home ribbon to display the Publish Preview dialog box for the web site.

    publish preview

  2. Click Continue. When publishing is complete, the URL for the web site on Windows Azure is displayed at the bottom of the WebMatrix IDE

    publish complete

  3. Click the link to open the web site in your browser.

    Express website

Modify and republish your application

You can easily modify and republish your application. Here, you will make a simple change to the heading in in the index.jade file, and republish the application.

  1. In WebMatrix, select Files, and then expend the views folder. Open the index.jade file by double-clicking it.

    webmatrix viewing index.jade

  2. Change the second line to the following:

    p Welcome to #{title} with WebMatrix on Windows Azure!
  3. Save your changes, and then click the publish icon. Finally, click Continue in the Publish Preview dialog and wait for the update to be published.

    publish preview

  4. When publishing has completed, use the link returned when the publish process is complete to see the updated site.

    Windows Azure node Website





Published at DZone with permission of

Opinions expressed by DZone contributors are their own.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}