Learning Node.js, Express, and Jade.

I spent most of today trying to come up with a sample site that I would be happy to have live on the Internet.

The work in progress is at https://github.com/FinVamp1/NodeGIT and I am happy with what I’ve done today.

To set the scene I should explain that in order to demonstrate the GIT Integration that is included in Windows Azure Web Sites I have a dummy Node.js site that I store on GitHub.

I can then show the workflow where I edit the site locally in WebMatrix and then commit the changes up to GitHub and then onto Windows Azure Web Sites.

Here’s the view of the default route.

h1= title

p Welcome to #{title}

I knew I wanted to extend this into a proper web site and so I did some reading on the Jade View Engine and decided I wanted to use the layouts and blocks support as discussed in this link.


The issue with this approach is that the default site comes with Express 2.5.7 and the Blocks and sections comes up with Express 3.

So I decided to upgrade to Express 3.

This was relatively pain-free as I just needed to pop out to the command line and run this command.
”npm install express@latest –save”

This upgraded both my Express configuration and saved the package changes.

Then I should be ready to go, right?

Well first I needed to update my version of Node.js on my dev machine to the latest to support Express 3.

Then I needed to edit my Server.Js as the Express() is a JavaScript function and app.Address is no longer present.

So I changed from

var app = module.exports = express.createServer();


var app = express();

and commented out the line with the calls to app.address etc.

//console.log(“Express server listening on port %d in %s mode”, app.address().port, app.settings.env);

Then I was ready to go.

I could now have a layout like this with all my main areas and just extend that on each of the pages


    title #{title}
    link(rel=’stylesheet’, href=’/stylesheets/style.css’)
        include header
        block content
        block sidebar
        include footer

Extended Home Page.
extends layout
block content
   h2 About Me
   a(href=”http://blogs.msdn.com/finbar_ryan”, title=”Work Blog”) My Work Blog.
   a(href=”http://www.finbarrsweb.com”, title=”Personal Blog”) My Personal Blog.
block sidebar
     h2 Social Media
     a(href=”https://twitter.com/FinVamp1″, title=”My Twitter”) Find me on Twitter.
     a(href=”https://www.facebook.com/finbar.ryan”, title “My Facebook”) Find me on Facebook.
     a(href=”http://uk.linkedin.com/pub/finbar-ryan/10/717/b44″, title=”My LinkedIn”) Find me on LinkedIn.

Note: You’ll also see that I used include which gives me the flexibility of having a Header and Footer with the content defined in jade files of those names.


Nicola Hibbert and her migration blog.

The Express Wiki on Migration.

Jade Node Template Engine

ExpressJS App Framework

Node.js Home Page

Jaspreet Chahal’s Tutorial Post

Ben Gourley’s Tutorial Post.

Home Media Setup

I thought I would share how my Media streaming is setup at home.
It’s complicated a little by a kind of cross-platform devices but it works for me.
Downstairs I have a little Shuttle PC that sits under the TV and records stuff from FreeView. That sits above a Sky HD Box that records all of the HD stuff I like to watch.

I also have an XBox setup with NetFlix, BBC iPlayer, 4OD, Channel 5 OnDemand and Lovefilm.

The Shuttle PC is running Windows 7 Media Center and has a dual tuner card. This records onto an SSD drive and then archives the recordings off to a HP MediaSmart Home Server.

Then in the bedroom upstairs I have a litter Acer Revo Nettop computer that streams the recordings off the Web Server. I also have a little Apple TV device also for Netflix and if there is something on iTunes I would like to watch.