Cannot find view in node/express

Problem

As my username implies, I'm new to node.js. I'm trying to learn it. As part of this process, I'm working to setup a basic web site. This web site will show a couple of basic web pages and expose a single REST endpoint. The structure of my project is:

config.js
home.html
start.js
routes.js
server.js
resources
  css
    style.css
  images
    up.png
    down.png
  javascript
    home.html.js

start.js has my main server code. That file gets executed via command line using 'node start.js'. Once started, my server begins listening on port 3000. The code in start.js looks like this:

var express = require('express');
var app = express();

var UserProfileHandler = require('./app/handlers/UserProfileHandler');

app.configure(function () {
  app.engine('html', require('ejs').renderFile);

  app.set('views', __dirname + '/');

  app.use(express.logger({ stream: expressLogFile }));
  app.use(express.bodyParser());
  app.use(express.methodOverride());
  app.use(app.router);
  app.use(express.static(__dirname + '/public'));
});

var routes = {
    userProfiles: new UserProfileHandler()
};

function start() {
    routeConfig.setup(app, routes);
    var port = process.env.PORT || 3000;
    app.listen(port);
    console.log("SUCCESS: Server listening on port %d in %s mode", port, app.settings.env);
}

exports.start = start;
exports.app = app;

My routes.js file has the following:

function setup(app, routes) {
  viewSetup(app);
  apiSetup(app, routes);
}

function viewSetup(app) {
  app.get('/', function (req, res) {
    res.render("/home.html");
  });

  app.get('/home.html', function (req, res) {
    res.render("/home.html");
  });
}

function apiSetup(app, routes) {
  app.get('/api/userProfiles/:username', routes.userProfiles.getUserProfiles);
}

I am trying to load home.html in a browser window. I attempt this by visiting http://localhost:3000 and http://localhost:3000/ and http://localhost:3000/home.html. Unfortunately, none of these work. In fact, I receive an error that says:

Express 500 Error: Failed to lookup view "/home.html"

I know that I'm close. If I visit http://localhost:3000/api/userProfiles/me I receive a JSON response back like I'm expecting. For some reason, i can't seem to return HTML though. My home.html file looks like the following.

<html>
  <head>
    <script type='text/javascript' src='/resources/javascript/home.html.js'></script>
  </head>
  <body>
    We're up and running! <img src='/resources/images/up.png' />
  </body>
</html>

Its a pretty basic HTML file. Even if the HTML comes back though, I'm concerned the JavaScript file and Image it references won't be accessible. I'm concerned of this because I'm not really sure how paths and such work in Node.

How do I get home.html to work in my Node setup?

Thank you!

Problem courtesy of: Node Newbie

Solution

as your view file is in same folder as your main file, below changes should make it work

1.change the view folder configuration line

from

app.set('views', __dirname + '/');//wont work

to

app.set('views', __dirname);//will work

2.change view render lines

from

res.render("/home.html");//wont work

to

res.render("home.html");//will work

with both the changes, the view should be working fine

update to below comments.

the issue you mentioned regarding the images,css and js is due to the static folder configuration which should be changed from

app.use(express.static(__dirname + '/public'));

to

app.use(express.static(__dirname + '/resources'));

as your static folder is named resources.

but make sure in your view you are refering the css/js/image files like

eg:

/css/style.css 
/images/up.png
/images/down.png
/javascript/home.html.js

from your view file

Also if the above dint work, check if you have given the path correctly and also you can try by taking the

app.use(express.static(__dirname + '/resources'));  

before the

app.use(express.methodOverride());
app.use(app.router); 

lines like

app.configure(function () {
  app.engine('html', require('ejs').renderFile);
  app.set('views', __dirname + '/');
  app.use(express.static(__dirname + '/public'));
  //try changing the position of above line in app.configure and resatrt node app
  app.use(express.logger({ stream: expressLogFile }));
  app.use(express.bodyParser());
  app.use(express.methodOverride());
  app.use(app.router);          
});
Solution courtesy of: mithunsatheesh

Discussion

There is currently no discussion for this recipe.

This recipe can be found in it's original form on Stack Over Flow.