I am currently working on a Menu website using nodeJS, and I prefer not to have all my html.handlebars in one file. I am facing an issue where my rendering is giving me a page not found error. What could be causing this?
Let me share my project structure with you:
| public/
|-- image/
|-- javascripts
|-- stylesheets
|--Nav.css
|-- reg.css
|-- ReviewPr.css
| route
|-- index.js
|views
|-- mainlayout
|--main.hbs
|--reg.hbs
|--ReviewPr.hbs
|-app.js
Below are the key sections of my code starting from the route index:
- route/index.js : Why isn't my dynamic property 'style' working as expected?
var express = require('express');
var router = express.Router();
/* GET home page. */
router.get('/', function(req, res, next) {
res.render('reg', {
title: 'Registration',
style:'reg.css',
style:'Nav.css'
});
});
// The remaining routes...
module.exports = router;
- views/main.hbs
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>{{title}}</title>
<link rel="stylesheet" href="/stylesheets/{{style}}">
</head>
<body>
{{{ body }}}
</body>
</html>
- reg.hbs (first page: providing link to hbs file)
The content of reg.hbs...
4). views/ReviewPr.hbs : Second page of the website
The content of ReviewPr.hbs...
- Finally: app.js
The configuration in app.js...
- Here's a screenshot of the application where none of my CSS seems to be working: