If I path to a view in ./views express will render it but it doesn't that for example ./views/api/login.jade and it send 500: Internal Server Error.
my codes:
/* GET api/... */
router.get('/login', function(req, res, next) {
res.render('api/login.jade', { title: 'Login' });
});
Thanks
You have to set the views path as well.
app.set('views', __dirname + '/views');
app.set('view engine', 'jade');
router.get('/login', function(req, res, next) {
res.render('api/login', { title: 'Login' });
});
step 1: you have to make sure you are using jade as the view engine.
app.set('view engine', 'jade');
step 2: set view path
app.set('views', __dirname);
or you can write it in every render call, res.render(__dirname+'api/login')
Step 3: do not write extension names
router.get('/login', function(req, res, next) {
res.render('api/login', { title: 'Login' });
});
P.S.
i recommend that you start using pug instead of jade since pug is jade 2.0
Related
app.js
app.engine('.hbs', expressHbs({
defaultLayout: 'layout',
extname: '.hbs',
layoutsDir:'views/layouts',
partialsDir:'views/partials'
}));
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', '.hbs');
app.use(express.static(path.join(__dirname, 'public')));
it work correctly in this route [admin.js]
router.get('/', function(req, res, next){
res.render('admin/admin', {title: 'Admin'});
});
});
//will render http://localhost:3000/admin
however, when i add new route in [admin.js]
router.get('/insert-scene', function(req, res, next){
res.render('admin/insert-scene', {title: 'Insert Scene'});
});
//will render http://localhost:3000/admin/insert-scene
example:
<link href="./stylesheets/site.css" rel="stylesheet">
http://localhost:3000/public/stylesheets/site.css[work][/admin]
http://localhost:3000/admin/stylesheets/site.css[wrong path][/admin/insert-scene]
public folder not work in this route so hbs view just render /admin/.... in my ref source. How to solve this problem?
Do not serve static files with node, while node can handle it, it's not the intended use case of the technology.
Use a specific web server for that like nginx or a CDN.
I set the page title like so for handlebars to render:
// Registor
router.get('/register', function(req, res) {
req.session.title = "Register";
res.render('register', {
active: {
active_register: true
},
title: req.session.title
});
});
I then post:
router.post('/register', function(req, res) {
The page title disappears along with all data sent when rendering the page.
I want the title to stay. How?
I have already tried resetting the title many ways with res.
According to your question there is error in handlebars. For this you have add this lines in your app.js file or main file
app.set('views', __dirname + '/views/');
app.set('view engine', 'handlebars');
app.engine('handlebars', engines.handlebars);
Within my "views" folder, i have another folder inside called "partials" that has other html files i'd like to render.
I thought it'd be self explanatory but searching through google I can't find the answer to this, but I'd like to render a file within the subdirectory as well.
I'm sure the answer is rather simple but I can't seem to find it..
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'html');
app.engine('html', require('ejs').renderFile);
var router = express.Router();
//This Works
router.get('/', function(req, res, next) {
res.render('index');
});
//This Works
router.get('/about', function(req, res, next) {
res.render('about');
});
//This Does NOT Work, How do I get this to work?
router.get('/partials/navbar', function(req, res, next) {
res.render('/partials/navbar');
});
Maybe just remove the first / from res.render('/partials/navbar')
I study the MEAN conceptions by this video course by Joe Eames.
This course interesting because teach how to use JADE templates as partials instead of HTML.
\bin
\node_modules
\public
\app
\main
someCntr.js
otherCntr.js
main.js
\server
\views
\partials
main.jade
featured-courses.jade
new-courses.jade
And all was going well until he moved this jade templates from \views\includes to \public\app\main and \public\app\courses in his Express 3.4. This trick does not work in my Express 4
his server.js file before
app.set('views', path.join(__dirname, '/server/views'));
app.set('view engine', 'jade');
app.get('/partials/:partialPath', function(req, res) {
res.render('partials/' + req.params.partialPath);
});
and after moving
app.set('views', path.join(__dirname, '/server/views'));
app.set('view engine', 'jade');
app.get('/partials/*', function(req, res) {
res.render('public/app/' + req.params);
});
You have to update jade to it's latest version:
http://expressjs.com/guide/migrating-4.html
I'm studying this course too, and I come to same problem...
The solution is to use req.params[0]. In server.js file the route to partials views like this:
insted of
app.get('/partials/*', function(req, res) {
res.render('public/app/' + req.params);
});
write:
app.get('/partials/*', function(req, res) {
res.render('../../public/app/' + req.params[0]);
});
I am using the book "Smashing Node.js" by Guillermo Rauch. Chap. 12 sets up some views/routes before an authentication example. I have followed the tutorial to the best of my ability and searched (and searched) for my error.
//package.json
{
"name": "login"
,"version":"0.0.1"
,"main":"./index"
,"dependencies": {
"express": "3.0.0"
,"uglify-js" : "2.4.0"
,"mongodb":"1.3.19"
,"mongoose":"3.6.20"
,"bcrypt":"0.7.7"
,"jade":"0.35.0"
}
}
here is my index.js
/**module dependenies**/
var express = require('express')
, mongodb = require('mongodb');
//set up app
app = express();
//middleware
app.use(express.bodyParser());
app.use(express.cookieParser());
app.use(express.session({secret: 'my secret'}));
//view options
app.set('view engine', 'jade');
//app.set('views', __dirname + '/views');
//app.set('view options', {layout: false});
//routes
//default route
app.get('/', function (req, res){
console.log('default');
res.render('index', {authenticated: false});
});
//login route
app.get('/login', function (req, res){
console.log('login');
res.render('login');
});
//signup route
app.get('/signup', function(req, res){
console.log('signup');
res.render('signup');
});
//listen
app.listen(3000);
in the same directory I have a folder of views/layout.jade, index.jade, signup.jade, login.jade I will show two.
'layout.jade'
doctype 5
html
head
title BN Login
body
.wrapper
block body
and index.jade
extends layout
block body
if (authenticated)
p Welcome back, #{me.first}
a(href="/logout") Logout
else
p Welcome visitor!
ul
li: a(href='/login') Login
li: a(href="/signup") Signup
the lines I have commented out did not help or are old.
The layout.jade renders. The console shows that the code is being read. No other view is rendered.
Thanks.
I think you have not used indentation correctly. In your index this :
extends layout
block body
if (authenticated)
...
else
should be :
extends layout
block body
if (authenticated)
...
else