How to Build a Web Server with Node JS | Node.js Tutorials for Beginners
ฝัง
- เผยแพร่เมื่อ 15 ก.ค. 2024
- Web Dev Roadmap for Beginners (Free!): bit.ly/DaveGrayWebDevRoadmap
Learn how to build a web server with Node JS. This Node.js tutorial for Beginners will walk you through building a web server with only Node JS - no framework required. This will help you build foundational knowledge of Node.js which will help when the Express JS framework is introduced later in this Node JS tutorial series.
🚩 Subscribe ➜ bit.ly/3nGHmNn
🚀 This lesson is part of a Node.js for Beginners tutorial series playlist:
• Node.js Tutorials for ...
🔗 Source Code: github.com/gitdagray/nodejs_w...
How to Build a Web Server with Node JS | Node.js Tutorials for Beginners
(00:00) Intro
(00:05) Welcome
(00:14) Overview
(00:28) Project Setup
(03:01) Import modules / dependencies
(04:33) A minimal server
(08:02) Two inefficient approaches
(11:06) Setting the Content-Type
(13:11) Setting the file path
(15:59) Make the html extension optional
(17:22) Does the requested file exist?
(18:18) Routing redirects
(22:48) Basic serveFile function
(25:17) Calling the serveFile function
(28:20) Serving JSON with the serveFile function
(30:25) Serving images with the serveFile function
(31:59) Sending a 404 status code
(32:56) Logging requests and errors
(35:51) Up and running with the web server
📚 References:
Node.js Official site: nodejs.org
NPM Official site: www.npmjs.com/
✅ Follow Me:
Twitter: / yesdavidgray
LinkedIn: / davidagray
Blog: yesdavidgray.com
Reddit: / daveoneleven
Was this tutorial about how to build a web server with Node.js helpful? If so, please share. Let me know your thoughts in the comments.
#node #nodejs #server - วิทยาศาสตร์และเทคโนโลยี
In this tutorial, we will learn how to build a web server with Node.js without using a framework like Express JS. Using only Node.js will help introduce some foundational knowledge about Node that will continue to help us as we work with Node.js and Express JS in the future. If you are just starting out with Node.js, I suggest starting at the beginning of the Node.js for Beginners playlist here: th-cam.com/play/PL0Zuz27SZ-6PFkIxaJ6Xx_X46avTM1aYw.html
I don't know why I got to know about this channel a few days ago. You are a gem & all playlists are well structured. Thanks a lot sir 🙏
Welcome aboard!
Dave this is an excellent series!! Watched each video as it comes out! Please keep producing these excellent videos they are so beneficial!!!
Thanks James! After this tutorial, the series adds in Express and eventually MongoDB to round out the MERN stack backend REST API construction. I appreciate your note! 💯
Excelent tutorial Dave!!! Thanks a lot for sharing!!!
I really enjoy the energy and enthusiasm in your videos. I just wanted to say thank you for creating this and other videos. I appreciate your hard work and dedication.
Glad you like them!
Love all of these videos. Thank you so much!
You're welcome, Moira! 🙏
Thanks Mr. Dave,
I have learnt a lot from you and recommended your videos to my colleagues.
Thank you, Fares! 🙏💯
I watched this video several times and I just want to keep press like 1000 time and it's not enough for your efforts
Thank you, Dave
This is pure gold😊
Just Amazing!!
learned so many things from this video 👍👍 thank you for this amazing series.
Happy to hear that!
Dave. You're amazing!! love your videos!!
Thank you for the kind words! 🙏💯
You're Awesome, Thank you so much
Wow!! speachless, This is really good. THANK YOU !
You're welcome! 💯
I've made a wise decision to spend time on this TH-cam channel. Thank you Dave.
You're welcome!
This is it. I want this level of clarity even if it is among the most basic ones. HatsOff bro. keep going
Glad to hear that!
@@DaveGrayTeachesCode Can u tell me like how can we optimize a server like we can using bundling in a client that can remove all reusable files.
This is best example of node server I did watched!
Thank you!
Second!
Great one bro!
Such a great tutorial!
Thanks so much!
Thanks! It helps a lot!!
Glad to hear that!
Superb content as always!
Much appreciated! 🚀🙏
Dave is an excellent teacher☺️☺️👍
Thank you!
I like to know how stuffs work and maybe this is why I like building things from scratch,
I might use Map instead of the extension switch but I know this is just an intro to node server so refactoring is not beneficial,
Great work as always my friend 🚀👍
A great observation Ahmad! I also like building from scratch - such a great way to learn. Thanks for the note. We will be moving on to Express JS next!
Awesome
Hi Mr.Dave,
I have a question concerning the parse and the stringify part of this lecture. Would it have been better if we serve the json data without parse in it and stringify it again as long the readFile() for .json extension do that already and the receiver could parse and consume the data correctly?
by the way i can't thank you enough for all what you've done seen much content but you've a unique philosophy ( Tought you the right way of doing it ). Am sure your hard work will be remembered forever ☺.
Amazing tutorial
Thank you! Cheers! 💯
Hey man, love your videos as a suggestion can you make a video or explain what is Cumulative Layout Shift (CLS) ?
Thank you and thanks for the suggestion! 🙏💯
Great video 😍
Thank you!
13:27 chain ternary hell
I know I differ from some, but I like chained ternaries much better than large if statements. Feel free to use your preference. 😃
thank you
Welcome!
why do you love indentation so much, I have even picked up the habit from you
Hi Dave can u mention which vs code theme and icons u use?
very nice this video
Thank you!
Not sure if anybody else had the same trouble as me; currently looking for an answer. Images won't render to the page. I've checked the switch statement for extension types using (for example with png images):
switch(extension){
case '.png':
contentType = 'image/png'
break;
}
but I logged extention (from inside the switch statement); which confirmed that the extension is png, and contentType from the serveFile function; but instead of contentType being given as 'image/png', it is being given as 'text/html' as if the variable isn't working properly. It works for .txt, .html, and .json extensions, but it looks like CSS and image extensions return contentType as 'text/html'. I even tried using 'PNG File' as the file type (as that's how they are named in Windows); but contentType won't change from 'text/html'.
EDIT: came back to say problem solved. For some reason the file types were being missed so I created an if condition of 'if(extention && contentType !== 'text/html'){ filePath = path.join(__dirname, req.url). That worked for the CSS, but the images were not showing and, as per the condition for when files don't exist, the text/html was being used as contentType. I also noticed for my image named 'rubber duck.png', the req.url was being logged as 'rubber%20duck.png' and I wondered if that was the reason it was not recognized and maybe the path (or http) module putting '%20' in place of a space between image name words was causing the issue. I replaced the space with a hyphen and 'voila', the images showed.
This is a perfect Tutorial , Thanks man. And I have a question I hope I don't make you feel bad just asking How old are you ?
🚀
Great work keep going forward… can I use this in the restful api
Yes, keep going in the series and we add Express to build a RESTful API.
1:39 why we extends EventEmitter and not use it independently
❤
absolutely informative lesson but there is some lines of code did not understand ... keep going
If there are lines that are confusing, I suggest console logging values to see what each one is doing. Doesn't hurt to play around with it for understanding. 💯
@@DaveGrayTeachesCode
I already trying to do console log .. thanks 🙏
It's so good tutorial for me, but I have a question, for example in browser when i write localhost:3500/subdir -> it doesn't work but localhost:3500/subdir/works I found some solutions, but they don't work, how I can solve it? Is anyone knows?
Can you deploy this on shared hosting (Not VPS, not cloud) via terminal?
It just needs a host that supports Node.js. For example, Heroku has their own CLI which would let you deploy from the terminal. You could also set up continuous deployment from GitHub to Heroku or another host if the host supports it.
@@DaveGrayTeachesCode No need of node support bro. If you can share me your email, I can send u the code and take a look and probably make a video of it.
I must be confused. I thought you were asking about this Node.js tutorial project as shown in the video. The host service definitely needs to have support for Node.js to host this project.
which extension do you have for icons?
vscode-icons ...it has been my favorite. 💯
@@DaveGrayTeachesCode thanks
Where can i practise this kind properties Dave?
I always recommend freeCodeCamp.org to my students. It offers many exercises to help you practice. There are both Javascript and Node JS sections there.
@@DaveGrayTeachesCode Thank youu so much Mr Dave !;
How to show the length of the block of code inside curly braces? like on 10:33
VS Code settings: Bracket Pair Colorization: Enabled
why on 27:36, it is just text, not JSON? what's difference between 27:36 and 30:26?
At 27:36, we have not configured the server to handle sending a JSON response yet so it is defaulting to the text response that is configured. It looks like JSON, but it is a text response. By the time we reach 30:26, we have configured our server to send a response type of application/json.
if you try in Firefox it would be more obvious, the Browser knows when the data is plain text or json, you should try in Firefox, it makes things more clear
first.
Thank you for this wonderful video
Glad you enjoyed it!
I am noob this is hard for me
Don't give up, but as a noob, have you learned Javascript first? You should learn Javascript before starting Node.js.
Thank you very much.
37:20 -
Why in my code, despite writing exactly the same as you did
(`${err.name}: ${err.massage})
And despite of deleting the exact same letter as you did for the purpose of occuring this error,
Yet, the error in the my errLog.txt file appears as: " TypeError: undefined. "
Instead of displaying the error's name and message..?
There must be a difference even though you suggest it is exactly like mine. For example, in your comment you said: err.massage ...but it should be err.message
@@DaveGrayTeachesCode You are sharp :)) Thank you!
An automatic typing error could be a major assistance.
Sometimes I'm surprised of how advanced those softwares are,
While being kind of primitive regarding typing errors handling.
00:17:40 no need for the last line (if (!extension && req.url.slice(-1) !== '/') filePath += '.html';)
you just needed to add one more level of craziness to the ternary
contentType === 'text/html'
? extension === html ? path.join(__dirname, 'views', req.url) : path.join(__dirname, 'views', req.url)+".html"
: path.join(__dirname, req.url);
😂