Im from India and I am not able to take some paid tutorial, I don't know how to thanks you.... I'm just want to say , you're the best.. thanks for helping us who cannot afford paid courses .... Many many thanks Sir.. you are great.. I will try my best to promote your Channel Sir...
Traversy is a god amongst coders. I started my first dev job last week. My first ticket was to work on making a part of a paragraph tag in a Jade/PUG folder dynamic. I'd never used PUG before, and in less than 20 minutes I'm able to confidently complete the task. Thanks Brad!
Thanks for your vids. Really appreciate the way you explain through each step. One note on this vid: I had to add the line app.engine('pug', require('pug').__express); in the // Load View Engine part of the page about the first app.set, because I was getting an error that it couldn't find the module Pug. Didn't seem to be a requirement for you when you recorded this vid, but that line fixed my issue. Thanks again for the vids!
i got this error message: Only named blocks and mixins can appear at the top level of an extendi ng template at makeError (C:\Users\addev\Desktop\webdesign_youtube est_api o de_modules\pug-error\index.js:32:13)....what is wrong?
hi u really have great tutorials,,,but i have problem here in case pug isnt rendering local css files even if i tried to do that without bower and also js files i cant understand why and there is no errors in both of consoles
not sure if this works for everyone. Save the pug file as an HTML file first, then resave it as a pug file and boom you can write pug with the normal HTML format and the pug format
at 15:15 I am trying to do this without the PUGtemplate and cant figure out the conversion from PUG to html for the index.pug would be? could anyone help me out please!!?
I'm using the same setup as you here, but I've gone with Nunjucks instead of Pug (I dont like it's syntax). Nodemon works when I edit the app.js file as you would expect - but any edits to my files in the /views/ folder and nodemon doesn't pick this up. I have to keep restarting the server in terminal to see my changes :( Any ideas? :/
You want to use a nodemon.json file in your project root directory to tell Nodemon to watch certain file extensions. There's an example in one project I've been working on, and it works pretty well. github.com/bmcminn/bloggity/blob/master/nodemon.json
yes it it necessary but if you use ejs template engine your can use the regular html in ejs and parse it instead of using pug which uses simplified html
$ nodemon [nodemon] 1.11.0 [nodemon] to restart at any time, enter `rs` [nodemon] watching: *.* [nodemon] starting `node index.js` module.js:472 throw err; ^ Error: Cannot find module 'C:\Projects odekb\index.js' at Function.Module._resolveFilename (module.js:470:15) at Function.Module._load (module.js:418:25) at Module.runMain (module.js:605:10) at run (bootstrap_node.js:420:7) at startup (bootstrap_node.js:139:9) at bootstrap_node.js:535:3 [nodemon] app crashed - waiting for file changes before starting... When I run the nodemon it show this error
Do you have an index.js file? Because I called mine app.js. If you have app.js as well, go into your "package.json" file and change "start": "node index.js" to "start": "node app.js"
i follow your tutorial, i'm using app.js also. SyntaxError: Unexpected end of input at createScript (vm.js:56:10) at Object.runInThisContext (vm.js:97:10) at Module._compile (module.js:542:28) at Object.Module._extensions..js (module.js:579:10) at Module.load (module.js:487:32) at tryModuleLoad (module.js:446:12) at Function.Module._load (module.js:438:3) at Module.runMain (module.js:604:10) at run (bootstrap_node.js:389:7) at startup (bootstrap_node.js:149:9) [nodemon] app crashed - waiting for file changes before starting...
I get an error after I installed pug. I followed each install step exactly. Starting server creates a npm-debug-log file in the project with this apparently the main issue: 17 error Windows_NT 10.0.14393 18 error argv "C:\\Program Files\ odejs\ ode.exe" "C:\\Program Files\ odejs\ ode_modules\ pm\\bin\ pm-cli.js" "start" 19 error node v6.11.0 20 error npm v3.10.10 21 error code ELIFECYCLE 22 error nodekb@1.0.0 start: `node app` 22 error Exit status 1 Failed at the nodekb@1.0.0 start script 'node app'. 23 error Make sure you have the latest version of node.js and npm installed. 23 error If you do, this is most likely a problem with the nodekb package, 23 error not with npm itself. I have all the latest version of node v6.11.0 / npm / express / pug v2.0.0-rc.2 I'm on Win10. Any thoughts on why?
In windows 10 after I restart the server, it gives the error Error: listen EADDRINUSE :::3000. Meaning the port is in use, I can't restart it however using killall -9 node...
i got this problem too, server is still running so i added this in the package.json file "scripts": { "start": "node app", "stop": "taskkill /f /im node.exe" }, if you want to stop the server just type npm stop in git, or you can kill the process manually by searching for what runs on port 3000
Packages that depend on modules that contain C/C++ code will fail to install. Read here for instructions on installing Python and Visual Studio. But I have already had a Python dev environment in my PC
Oh yeah. There are many template engines you could use that use regular HTML such as Handlebars and EJS. I just wanted to do something different. Check out my Express crash course, I think I use handlebars there
Something really odd is happening. My article array contain 3 objects. But I get 8 bullets in my ul list. I render with res.render('index', { title:'Articles', articles: 'articles' }); But I cannot still articles using li= article.title I i type articles in the console i dont get an array back. Any ideas whats wrong?
I have never heard anyone call it that, ever. Maybe everyone I have ever heard say it is wrong but I think I will keep calling it NODE MON. Guess it's like "Babel" and "Baybel"
Hey, to freak you guys even further I prefer to pronounce it No-Dee-Mon, like Pokemon. "Gotta code 'em aaaall - No-dee-mon". Now this will stuck in my brain for a while...
you never mentioned, why do you use pug for god 's sake ?? anyway love the series, I learned a lot, but the pug thing took me a lot of time and effort to handle the mistakes ..
I believe it's a way to manually set up the path to the directory. According to the Express documentation on using Pug, there's indeed an easier way to set the directory to 'views', which is (views, 'views'), but it only works on when you've used Express application generator (where directory 'views' is created and path to it defined by Express). If you create the 'views' directory yourself, you'd need path.join to set up the path. Reference doc: expressjs.com/en/guide/using-template-engines.html
@@nasrallahal-shaer8397 Another reason is that the join method joins paths in any OS. In Windows we use "\" in paths, while in Unix based OS we use "/". So path.join manages that for us, making It possible to run the same code in any OS.
I don´t like PUG why didn´t you just use simple html wich everyone uses all the time. Now I am not sure if I should watch the rest of the series if you will keep using PUG stuff.
Pug is a good skill to have. Fight through it now, and then EJS and Handlebars templating will be a breeze. Its all worth it my friend! I HATE PUG TOO!! such a great series though. finish it
Well, I'm so noob but manage to stop it (thank to stackoverflow). For that ones to have the same problem as me, run a command prompt as 'administrator' and say 'taskkill /F /IM node.exe' (without quotes)
Love your videos but when you start using framework's can you really call it from scratch? This video was very misleading and waisted my time for what I was really looking for.
I had problem about having trouble after uploading "pug". When I upload pug, express was losing and when I upload express again this time pug was losing. I solved that problem with using that link "stackoverflow.com/questions/45342307/error-cannot-find-module-pug" and my solution was: npm install --save express jade pug
Im from India and I am not able to take some paid tutorial, I don't know how to thanks you.... I'm just want to say , you're the best.. thanks for helping us who cannot afford paid courses .... Many many thanks Sir.. you are great.. I will try my best to promote your Channel Sir...
that's so sweet, Brad helps a lot of people with his courses, me included
Traversy is a god amongst coders. I started my first dev job last week. My first ticket was to work on making a part of a paragraph tag in a Jade/PUG folder dynamic. I'd never used PUG before, and in less than 20 minutes I'm able to confidently complete the task. Thanks Brad!
Thanks for this great tutorial, you nailed the 3 most important things: template inheritance, variables and loops. And in shortest possible time.
short, straightforward. thats what i like to see. big up man
Thanks for your vids. Really appreciate the way you explain through each step. One note on this vid: I had to add the line
app.engine('pug', require('pug').__express);
in the // Load View Engine part of the page about the first app.set, because I was getting an error that it couldn't find the module Pug. Didn't seem to be a requirement for you when you recorded this vid, but that line fixed my issue.
Thanks again for the vids!
love your tutorials, 14 hours before exam and i have to prepare node.js project)) u helped me a lot
I love your teaching. Thanks for sharing!
What an amazing tutorial, this tutorial helped me to solve my problem.
I found a perfect waaaaay To avoid any errors guys : just copy the package file and npm ibstall this worked for me ! :)))
Had to pause the video to let you know how awesome your tutorials are. Great work man!
great series, very helpful, thank you!
What's exactly the difference between "#{var}" and "tag= var" in pug?
It's been years since I've seen Atom in action.
Fantastic work and great series but I don't like pug
me too thats the worst part of this tutorial
I prefer ejs :v
me too, handlebars is better!
so we can move ahead without adding pug is it?
@@pranjalshukla8096 you can use an another engine if you want
I like how you teach,
I always use you tutorials
love the series
Nice job man, appreciate it!
So whenever I run the app, it gives me an error which is 'Failed to lookup view "index" in views directory'. Can someone help me with this?
change main in package.json to app.js
Awesome video, thanks!
Hello Brad, is there layout in ejs and handlebars as in Pug template engine?
Pug is amazing. And there are html to pug converters
It says it's probably not an npm problem.. It's likely additional logging output above
28 March 2023 Update:- app.set('views', __dirname+'/views') is not required and is automatically set behind the scenes (3:24)
Thank You for Your Great Videos ,kindly want to know how to use nodejs in an Asp MVC Project.
Hey Brad 👋
I can't find video one and two. Please help me out 🙈
i got this error message:
Only named blocks and mixins can appear at the top level of an extendi
ng template
at makeError (C:\Users\addev\Desktop\webdesign_youtube
est_api
o
de_modules\pug-error\index.js:32:13)....what is wrong?
Is it possible to make a loop from a csv or json file with pug?
Also is there a way to do it without template inheritance, because apparently es6 does not have it?
What is the difference of "li=" and "li ="? They both work differently
Hi, it's great tutorial series. I want to know how to send user data to pug views after validation fail? Otherwise it runs perfectly. Plz help me.
hi u really have great tutorials,,,but i have problem here in case pug isnt rendering local css files even if i tried to do that without bower and also js files i cant understand why and there is no errors in both of consoles
what do you think of handlebars?
not sure if this works for everyone. Save the pug file as an HTML file first, then resave it as a pug file and boom you can write pug with the normal HTML format and the pug format
Always Awesome bro,,,
In the next tutorial,, can you create project using JADE from basic ?
Pug is jade, the name has changed
Very good, very good
I had to manually restart nodemon for the extend to work in my add article page.. strange.
at 15:15
I am trying to do this without the PUGtemplate and cant figure out the conversion from PUG to html for the index.pug would be? could anyone help me out please!!?
Hello sir, I am constantly getting error on gitbash : nodemon app crashed. Please help to get me out of this problem ! 😣
, love your tutorials , thank you
is pug better than ejs ?
No, pug actually sucks
how do you give ids and classes in pug? like we do in html and then style it and use js?
Awesome
I'm using the same setup as you here, but I've gone with Nunjucks instead of Pug (I dont like it's syntax).
Nodemon works when I edit the app.js file as you would expect - but any edits to my files in the /views/ folder and nodemon doesn't pick this up. I have to keep restarting the server in terminal to see my changes :(
Any ideas? :/
You want to use a nodemon.json file in your project root directory to tell Nodemon to watch certain file extensions. There's an example in one project I've been working on, and it works pretty well. github.com/bmcminn/bloggity/blob/master/nodemon.json
Oh I see cheers dude :)
Is it necessary to install a template engine if you just want to use regular html?
yes it it necessary but if you use ejs template engine your can use the regular html in ejs and parse it instead of using pug which uses simplified html
$ nodemon
[nodemon] 1.11.0
[nodemon] to restart at any time, enter `rs`
[nodemon] watching: *.*
[nodemon] starting `node index.js`
module.js:472
throw err;
^
Error: Cannot find module 'C:\Projects
odekb\index.js'
at Function.Module._resolveFilename (module.js:470:15)
at Function.Module._load (module.js:418:25)
at Module.runMain (module.js:605:10)
at run (bootstrap_node.js:420:7)
at startup (bootstrap_node.js:139:9)
at bootstrap_node.js:535:3
[nodemon] app crashed - waiting for file changes before starting...
When I run the nodemon it show this error
Do you have an index.js file? Because I called mine app.js. If you have app.js as well, go into your "package.json" file and change
"start": "node index.js"
to
"start": "node app.js"
thank you so much Traversy
No problem
i have it correctly show the same error
i follow your tutorial, i'm using app.js also.
SyntaxError: Unexpected end of input
at createScript (vm.js:56:10)
at Object.runInThisContext (vm.js:97:10)
at Module._compile (module.js:542:28)
at Object.Module._extensions..js (module.js:579:10)
at Module.load (module.js:487:32)
at tryModuleLoad (module.js:446:12)
at Function.Module._load (module.js:438:3)
at Module.runMain (module.js:604:10)
at run (bootstrap_node.js:389:7)
at startup (bootstrap_node.js:149:9)
[nodemon] app crashed - waiting for file changes before starting...
best tutorial ever thank you so much
plz tell me know the way to render index.html . in views folder, i created index.html instead of index.pug
Could not get it to add article, it seems to me to be loaded with problems that are impossible to solve, giving up.
dont' give up) just try again it ll work if u follow Brad's code
why not use express-handler?
I get an error after I installed pug. I followed each install step exactly. Starting server creates a npm-debug-log file in the project with this apparently the main issue:
17 error Windows_NT 10.0.14393
18 error argv "C:\\Program Files\
odejs\
ode.exe" "C:\\Program Files\
odejs\
ode_modules\
pm\\bin\
pm-cli.js" "start"
19 error node v6.11.0
20 error npm v3.10.10
21 error code ELIFECYCLE
22 error nodekb@1.0.0 start: `node app`
22 error Exit status 1
Failed at the nodekb@1.0.0 start script 'node app'.
23 error Make sure you have the latest version of node.js and npm installed.
23 error If you do, this is most likely a problem with the nodekb package,
23 error not with npm itself.
I have all the latest version of node v6.11.0 / npm / express / pug v2.0.0-rc.2
I'm on Win10. Any thoughts on why?
--save wont automatically save into my package.json >.< but it still works ...
In windows 10 after I restart the server, it gives the error Error: listen EADDRINUSE :::3000. Meaning the port is in use, I can't restart it however using killall -9 node...
did you ever figure this out?
i got this problem too, server is still running so i added this in the package.json file
"scripts": {
"start": "node app",
"stop": "taskkill /f /im node.exe"
},
if you want to stop the server just type npm stop in git, or you can kill the process manually by searching for what runs on port 3000
Adam Klein Thank you. Worked.
Fantastic videos thank you so much, don't like jade though but again thank you
hi, can I ask a question that why I run into an error when install the 'language-pug' package?
Packages that depend on modules that contain C/C++ code will fail to install.
Read here for instructions on installing Python and Visual Studio.
But I have already had a Python dev environment in my PC
getting an error at articles:articles.. why??
Very good
sir on starting npm it respond - unhandled error event 167
How the comments are comming automatically in Italic?
It's possible to use regular HTML instead of using pug?
Oh yeah. There are many template engines you could use that use regular HTML such as Handlebars and EJS. I just wanted to do something different. Check out my Express crash course, I think I use handlebars there
Okay. Thanks a lot, Brad.
Why don't you use ejs?
I'm currently having an issue around the 3:15 min mark with the h1 pug header... Everytime I restart it gives me an error.. Can someone help me??
Try to put '/views' instead of 'views'
too much Template Engine :(
muchas gracias
Thanks bro
I keep getting the error Error: listen EADDRINUSE: address already in use :::3000
change the port
@@mehdizaim1732 you can use ctrl c to stop the port from running and then run your app again
how can i access your source codes?
Something really odd is happening. My article array contain 3 objects. But I get 8 bullets in my ul list.
I render with res.render('index', {
title:'Articles',
articles: 'articles'
});
But I cannot still articles using
li= article.title
I i type articles in the console i dont get an array back.
Any ideas whats wrong?
you are not sending a variable named "article" , that's why pug can't find it.
you are sending only value that has no name
It is Pronounced as NODE DEMON not NODE MON
I have never heard anyone call it that, ever. Maybe everyone I have ever heard say it is wrong but I think I will keep calling it NODE MON. Guess it's like "Babel" and "Baybel"
Hey, to freak you guys even further I prefer to pronounce it No-Dee-Mon, like Pokemon. "Gotta code 'em aaaall - No-dee-mon". Now this will stuck in my brain for a while...
Traversy Media I saw it's icon with two horns over the head on their official website
Haha
I like NODE MON, makes me think of a helpful Digimon.
you never mentioned, why do you use pug for god 's sake ?? anyway love the series, I learned a lot, but the pug thing took me a lot of time and effort to handle the mistakes ..
node & express js don't understand html tags so as pug templating engine is used to parse the html to pug
Why not change the name of author 3
app.set('views', __dirname + '/views") ,,, Why we need path.join() ?!
I think its just an easier to read syntax. Path.join makes It very clear that we are passing a path. Not sure tho
I believe it's a way to manually set up the path to the directory.
According to the Express documentation on using Pug, there's indeed an easier way to set the directory to 'views', which is (views, 'views'), but it only works on when you've used Express application generator (where directory 'views' is created and path to it defined by Express).
If you create the 'views' directory yourself, you'd need path.join to set up the path.
Reference doc: expressjs.com/en/guide/using-template-engines.html
Oh, I Got It, thanks mo much!!
@@nasrallahal-shaer8397 Another reason is that the join method joins paths in any OS. In Windows we use "\" in paths, while in Unix based OS we use "/". So path.join manages that for us, making It possible to run the same code in any OS.
Uhm, I completely forget this point, thanks again Lucas!! SO now it's very clearly that uses path better than concatenation.
how to css a Html Template ?
how to upload this file in live?
Hello, you can use heroku or netlify they offer free packages
gave some reason to live
I don´t like PUG why didn´t you just use simple html wich everyone uses all the time. Now I am not sure if I should watch the rest of the series if you will keep using PUG stuff.
Pug is a good skill to have. Fight through it now, and then EJS and Handlebars templating will be a breeze. Its all worth it my friend! I HATE PUG TOO!!
such a great series though. finish it
In 3:22 I got this, puu.sh/wtoga/662f50b67f.png . I can't go further from there...
Now I understand that the server is currently running on 3000, Ctrl+C doesn't kill the execution, how could I kill it ? Thank you
Well, I'm so noob but manage to stop it (thank to stackoverflow). For that ones to have the same problem as me, run a command prompt as 'administrator' and say 'taskkill /F /IM node.exe' (without quotes)
i just went to the taskmanager and killed it there, but still a big thanks for the tip, this could have taken me hours!
Thanks man!!
so every time we ctrl+c, kill task again in task manager then npm start again?
Love your videos but when you start using framework's can you really call it from scratch? This video was very misleading and waisted my time for what I was really looking for.
In the title it says he uses express. So how can he waste your time?
stfu
love the series, but world will be nicer place without frigging jade or whatever it's new name
pug!..... Mustache and ejs are both nice alternatives.
Yeah, i personally prefer ejs.
me, too. It's a little bit like php :)
yeah thats true, i like it because it is embedded directly into regular html, so I don't have to learn a new syntax/new way of writing markup.
Personally I love twig.js , which has been ported from php to JS, this allows you to use normal html with interpolation of variables etc..
I had problem about having trouble after uploading "pug". When I upload pug, express was losing and when I upload express again this time pug was losing.
I solved that problem with using that link "stackoverflow.com/questions/45342307/error-cannot-find-module-pug"
and my solution was:
npm install --save express jade pug
To me it just reads:
=article.title
=article.title
=article.title
Found my problem: "li=" is not the same as "li =". Take note!
thanks it helped a lot
pug sucks :(
muchas gracias