title: Jade - Loading templates from different directories
body: <p>I'm trying to work on Peepcode's Node.js Full Stack videos and it seems they're using an older version of express/jade. No mention of using block/extends to render layouts. </p>
  
  <p>The setup used in the app is to have a /views/layout.jade file that loads for all sub-apps. The sub-apps' views are located in /apps//views.</p>
  
  <p>My server.js seems pretty standard. Express is version 3.0.0rc1</p>
  
  <pre><code>require('coffee-script');
  
  var express = require('express')
    , http = require('http')
    , path = require('path');
  
  var app = express();
  
  app.configure(function(){
    app.set('port', process.env.PORT || 3000);
    app.set('views', __dirname + '/views');
    app.set('view engine', 'jade');
    app.use(express.favicon());
    app.use(express.logger('dev'));
    app.use(express.bodyParser());
    app.use(express.methodOverride());
    app.use(app.router);
    app.use(express.static(path.join(__dirname, 'public')));
  });
  
  app.configure('development', function(){
    app.use(express.errorHandler());
  });
  
  require('./apps/authentication/routes')(app)
  
  http.createServer(app).listen(app.get('port'), function(){
    console.log("Express server listening on port " + app.get('port'));
  });
  </code></pre>
  
  <p>My routes file for the sub-app is in /apps/authentication/routes</p>
  
  <p>routes.coffee</p>
  
  <pre><code>routes = (app) -&gt;
  
    app.get "/login", (req,res) -&gt;
      res.render "#{__dirname}/views/login",
        title: "Login"
        stylesheet: 'login'
  
  module.exports = routes
  </code></pre>
  
  <p>The view I intend on rendering for this.</p>
  
  <p>login.jade</p>
  
  <pre><code>extends layout
  
  block content
    form(action='/sessions', method='post')
      label
        | Username
        input(type='text', name='user')
      label
        | Password 
        input(type='password', name='password)
      input(type='submit', name='Submit')
  </code></pre>
  
  <p>And Finally the layout.</p>
  
  <pre><code>doctype 5
  html
    head
      title= title
      link(rel='stylesheet', href='/stylesheets/#{stylesheet}.css')
    body
      block content
  </code></pre>
  
  <p>Going to localhost:3000/login renders this:</p>
  
  <p>Express
  500 Error: /Users/StevenNunez/code/HotPie/apps/authentication/views/login.jade:1 > 1| extends layout 2| 3| block content 4| form(action='/sessions', method='post') ENOENT, no such file or directory '/Users/StevenNunez/code/HotPie/apps/authentication/views/layout.jade'</p>
  
  <p>My folder structure:</p>
  
  <pre><code>.
  ├── '
  ├── apps
  │   └── authentication
  │       ├── routes.coffee
  │       └── views
  │           └── login.jade
  ├── package.json
  ├── public
  ├── server.js
  └── views
      ├── index.jade
      └── layout.jade
  </code></pre>
  
  <p>Thank you for your time.</p>