Question

I have started a small webapp with everyauth and express, based on the sample project in Mircosoft’s WebMatrix 2.
What I cannot get my head around is how information is passed to the view and how the views are stiched together from partial views.

The view is generated from a parent view called layout.jade and the partial view for example index.jade. These views do however not seem to reference each other.

The routing seems to be managed with this code:

app.configure(function() {
    app.set('views', __dirname + '/views');
    app.set('view engine', 'jade');
    app.use(express.bodyParser());
    app.use(express.methodOverride());
    app.use(require('./middleware/locals'));
    app.use(express.cookieParser());
    app.use(express.session({ secret: '[secret]' }));
    app.use(everyauth.middleware());
    app.use(express.compiler({ src: __dirname + '/public', enable: ['less'] }));
    app.use(connect.static(__dirname + '/public'));
    app.use(app.router);
});

and the routes are defined like this:

app.get('/', function(req, res) {        
    res.render('index', { title: 'Home Page.  ' })
});

This seems to perfectly merge the layout and partial view, but I cannot work out how. Can anyone shed light how this works?

Answer 1

If you are not coming from a ruby background it can be kind of hard to grasp, hopefully this helps.

By default express will render a “layout” (in your case layout.jade). A layout is then rendered on every page unless specified else where. Although this maybe helpful with websites and blogs where the head is always the same, I find it to be cumbersome on web applications. You can disable if you like by adding the code below to your app settings:

app.set('view options', {layout: false});

Express will then render your view (in this case index.jade). The index is the majority of the content.

Express can also render partials, which is a partial view inside of a view. This is helpful for items like footers, but can effect performance. It is important to note that a partial is different then a view.

I find that people without Jade/Tempting experience have an smaller learning curve using EJS instead of Jade, since it flows much like HTML.

Below are some videos that really helped me grasp views/partials, and middleware when I first started with express. Nodetuts is an excellent resource. The Express documentation has also evolved to be a very valuable resource as well, happy coding, and good luck!
express documentation
nodetuts express