I'm experiencing a strange issue. When I navigate from page to page in my Express.js app (currently I have three pages: Home, About, Contact), the page appears blank. Only when I do a hard refresh on my Mac (Shift Command R) do all of the assets load in. When I look at the Networks tab in Chrome Dev Tools, it appears as if the assets are loading in -- I don't see an 404's.
Here is a screenshot of my app directory for you to see what I'm working with: http://d.pr/i/lQlV
Also, here is my app.js file:
var express = require('express')
, partials = require('express-partials')
, app = express();
app.configure(function() {
app.set('title', ' | ToDo App');
app.set('view engine', 'ejs');
app.use(express.static(__dirname + '/public'));
app.set('views', __dirname + '/views');
app.use(partials());
});
app.get('/', function(request, response, next) {
response.render('index', { title: "Home" + app.get('title') });
});
app.get('/home', function(request, response, next) {
response.redirect('/');
});
app.get('/about', function(request, response) {
response.render('about', { title: "About" + app.get('title') });
});
app.get('/contact', function(request, response) {
response.render('contact', { title: "Contact" + app.get('title') });
});
app.use(function(request, response){
response.render('404', { title: "404" + app.get('title') });
});
app.listen(3000);
You are not using app.router, which handles all your routes:
app.use(app.router);
app.get('/', function(req,res,next){
res.render('index');
});