Build Node.js User Authentication - Password Login
HTML-код
- Опубликовано: 10 окт 2024
- In this video we are going to build a secure Node.js user authentication system. I will be covering all of the security concerns that you will run into while building an authentication system. We will also cover how to securely store a password in case of a database breach. Lastly, we will cover how to login a user securely based on their name and password.
📚 Materials/References:
GitHub Code: github.com/Web...
Login With Passport Tutorial: • Node.js Passport Login...
🧠 Concepts Covered:
What a password salt is
How to properly hash a password
How to store passwords
Basic express server setup
User login
🌎 Find Me Here:
Patreon: / webdevsimplified
Twitter: / devsimplified
Discord: / discord
GitHub: github.com/Web...
CodePen: codepen.io/Web...
#WebDevelopment #WDS #JavaScript
Full Node.js application authentication tutorial: ruclips.net/video/-RCnNyD0L-s/видео.html
A little tip for those using Postman!
If you're trying to send a request in postman and you're getting undefined or type errors, you're most likely trying to send params when you should be sending JSON in the body.
instead of using 'Params', select 'Body', select the radio button 'raw', then at the right side of the radio buttons (next to 'GraphQL'), select JSON in the drop down. You're welcome.
This guy's teaching style is perfect.
Agreed
Agreed
Agreed jim 😅
Agreed Jim
I feel like i discovered a gem on RUclips! Keep up the amazing work!
Thanks! I am really glad you like my video that much. Hopefully I do not disappoint in the future.
Watching these videos in 2024 where AI is taking over Web Dev, still keeps me motivated and interested on becoming a Full stack real quick. Thanks for your efforts 🙌@@WebDevSimplified
Great video. Pretty simple and well explained.
One thing: When authenticating with username/pw do not let the user know if a username does not exist. This way it is possible to create tons of requests to get all the stored usernames. Just respond with something like 'authentication failed' for either scenario (username not found / wrong pw).
Keep up the good work!
That is a good point. It also prevents people from discovering other people's usernames
Can you explain how someone can create tons of requests to get all the stored usernames ?
@@nasrisami17He doesn’t actually mean “all”. He means you could find a lot of usernames by essentially compiling a massive list of usernames beforehand, sending the login request, and then checking to see if the error is “user does not exist” vs “failed login”. The latter tells you that there is an account with that username on the server. This doesn’t imply you would actually be able to access the account, but information leaks are generally not good to have.
@9:01 He says "Hassed Pashword"
Putting in a little comedy with these high quality explanations. You are going to be 1M+ soon. Very good explanation Sir, loved it.
Hey there, thanks for simplifying the web.
I have a small notice that I want to share
When you searched for the user inside the users/login route you have this (user=> user.name = req.body.name) instead of (user=> user.name = =req.body.name)
I am sure that you've done that accidentally but just notifying you for other watchers.
Thanks again
Hi Kyle, great tutorial so congratulations for that. However I encountered a problem in your code that would manifest when adding more users to the users array. After adding a second user and checking if that user existed and therefor logged in, this very process would overwrite its previous hashed password. Where the problem lies: in the route /users/login you check if user existed in the const user = users.find(user => user.name = req.body.name). You are using an assignment here instead of a comparison operator ==, it should be users.find(user => user.name == req.body.name). Hope this was helpful for others who may have tried adding more users to the array. Keep it up Kyle!! Best regards
This is what I am looking for
Would love to see this process integrated with a database instead of an array, and with JWT. Basically a wholesome login. But for what it is, brilliant video Kyle
@Kayle Excellent job! @Joey you are absolutely right, that's where it will be found a bug -:)
great that you find the tutorial great, maybe someone of you can explain why we hashed a password, but did nothing with that password in the login function?
As of right now, I found the tutorial more confusing than anything.
@@AndrewTSq The hashed password was compared with the login request password
im watching yt/udemy tutorials for past week. and i have to tell that you are the best that is out there. perfect pace, perfect voice, perfect explanation.
big thank you!
Thank you so much! That really means a lot to me and I am so glad that my teaching style resonates with you so well.
I can trust this channel blindly 😊 Authentication sounded really intimidating to me until now, but you simplified the basics soo well in such a short time! Really enjoyed the video. Thanks a lot, Kyle!
Same here
We are working on a group project in the bootcamp I’m in and I’m handling the login page. This video is a godsend. Thank you
that was PERFECT! i thought login was some complicated long process, this was a relief!
although i know there is more to it than just this like jwt tokens and secure headers, oauth, 2 step auth etc. this was such a nice video to begin with
Complete and to the point. Awesome tutorial.
Just a minor correction. In 'users/login' the users.find should use '==' and not '='. i.e. "users.find(user => user.name == req.body.name);" Else it would assign instead of comparing.
I know it probably doesn't matter, no, definitely doesn't, but he made a note of it in the video at timestamp: 11:18.
Thanks man, I guess I missed seeing that note
it does matter, it only works for the first user/time@@user5214
whenever i get stuck on something, i always check your channel, knowing that i will find my answer..
as always, i get what i need.. thank you kyle..
Simple, fast, clear... you neeed to make more tutorials for us man, for eeverything, tutorials for life!
Yes, we want full application!
Thank you
I can't wait to make it
The REST extension is a blessing :O I love it so much :O thank you
could you tell me where the send request button is
I am revisiting some old concepts for a code test, and this tutorial was great. Just want to say, you have a super clean delivery, and your example flow is extremely good. I appreciate the new plugin for VSCode btw, the REST Client? Super dope. Anyway I'm only half way through and felt like I should sub, and let you know it was good quality content. Back to it!
I am always excited when a new video goes up! You have helped me switch from being a UX Designer to JS Developer :) Greatly appreciate your work.
That's awesome! I'm really glad I could help you along the way.
@@WebDevSimplified can we do that with websites
In html
I was confused when salt was displayed with hashed password. After googling it I was surprised even more, actually its intended that way. Salt is used to protect from rainbow tables, not from brute force or dictionary attacks. For those you use peppers! As always great video Kyle, thx for upload!
Thanks for such an easy and step by step guide, really easy to follow and understand, i watched many other tutorials which were 1 hour long and you just nailed it in 13 mins, Dude u are a gem
I like the way you explain without a lot of blah blah. thank you!
this is so clear, we beginners need this kind of video to teach very small thing one by one, thank you so much
Excellent introduction for how to start with a node.js back end, makes it very easy to understand basic operations. Kudos!
I would love to see a simple application with login
I will make sure to make that one of my next projects.
Up
yeh, me too, desire for a simple real world application !!!
@@WebDevSimplified Please do a Auth boiler plate with MongoDB(Atlas): including passport, bcrypt and JWT. Having them in separate module is nice but having a complete boiler plate would be better. Love the 123 approach - keep the good work.
This is a login and register system from WDS :)
ruclips.net/video/-RCnNyD0L-s/видео.html
if someone faces errors with bcrypt.. try using bcryptjs having same functionalities
npm install bcryptjs
thx
Or you could follow the instructions for your OS... Most likely missing either node-gyp or build tools, see: github.com/kelektiv/node.bcrypt.js#dependencies
Thanks man! I miss doing backend with node.js and middleware stuffs. Will watch your channel often so I can still keep up in node. Great work!
Short, Sweet and to the point tutorials. All videos are best Kyle.
This was so helpful. Please make a longer, more in depth version with an app.
I been searching this for a month
Now your explanation is so simple 13:31
These tutorials are awesome! Thank you so much for providing such a simple and well-explained tutorial. Keep up the good work! Can't wait for your other videos
In order to create unique users, add the following to the app.post route ('/users')
const user = users.find(user => user.name == req.body.name)
if ( user ) {
return res.status(400).send('Already exists')
}
This will check if the name is already there and stop from being created, just something to keep in mind when implementing in production which usually uses usernames and emails versus name which can have duplicates.
followed you from a CSS battle you had with Powell... i think pursuing you was not bad. Thank you for your tutorials
The way he says "WHOOPS" gets me. Idk why, it just does.
Super nice and quick! Shows the minimum amount so I can get a grasp on it and doesn't waste my time! Thank you very much. Great first step into this.
That's pretty crisp & clear. Thanks a lot!
Thank you for the tutorial! I laughed a lot every time you said "Hassed Pashword" :D
Speaking and typing is way too much for my brain :P
Awesome tutorials! Just checked out the entire web app authentication playlist. Found everything I was looking for in one place. Thank you Kyle.
Subscribed! :)
Your videos are pure gold due to very clean and precised form of providing information.
Its great to have videos with pure information content with decent amount of energy.
Thanks!
berkcan güven.. kendini geliştirmiş yazılım işine atılmış helal olsun..
Very simply explained! Thanks
I'm going to recommend this channel to all my mates.. We're blessed to have you Sir..
Thank you!
Simple easy and straight forward .. this is how teaching should be
I have been working on this for a couple of hours and you made it so so simple. Lol. Thank you.
Wow! Greetings from Brazil! Thank you for sharing this! I'm creating an Budget generator system with Node and React and this video help me out to implement secure passwords and login system on my application (I'm studying by myself, so I use hard Yotube and EAD platforms). Keep this awesome work and quality videos!
Damn I love your vids, straight to the point, well done and thank you.
You are very welcome!
thanks for this, man. My Node skill just got better!
So crisp and to the point tutorial... I really like the way you explained.... Thank you 🙏
Your concepts are really clear. Thanks and best of luck to you 🧡
smoothly explained , loved it
when am stuck you always come through, thanks
I learnt everything about *SIMPLE AUTH*. Thanks a lot!!!
Web Dev Simplified! Stays very true to the name!!!
This was so useful, you helped me go throughout my interview code challenge. You saved my life. Thanks
I was able to learn user authentication through your video. Thank you.
Thank you! This was very informative! Apart of the content you used, I also discovered that REST plugin for vscode is quite handy!
Amazing video ❤
I m just starting with backend and this is like the perfect guide for starting in it.
Thanks alot man.
Works! Thank you!
Subscribed, thank you for quality videos straight forward, Thanks 🙏🏼
This is so amazing, so incredibly new experience, I learnt a lot of things along with authentication like that rest client, it is so easy and quick.
Thankyou ♥️
greate I like the way you build every thing from the scratch thanks!
thank you such a awesome teacher. I read in the comments below that you are looking to make a full stack video for auth, wherein we sign in etc from a client app. Plz make it possible sn . thank you
Hey great video! Very easy to understand and follow. I wonder did you ever make a full app that implements all of this?
I will check out your other auth tutorials. Would love to see this with an actual database connection...mysql for example. Thank you as this was a great tutorial.
Return value Array.find() is
value of the first element in the array that satisfies the provided testing function. Otherwise, undefined is returned.
Undefined not null
the goat.
Simply life-saving !
Great video Kyle!
Good teaching bro👋👋
Thank for for this amazing tutorial. Finally undterstood the bcrypt npm! was so hard for me.
great tip about rest client!
You are very good at explaining.
You're a fantastic tutor dude, thanks for all your work.
Awesome tutorial thank you
Thank you Kyle. You are the best. Keep up the good work.
why do you shine? amazing courses man
Absolutely concise and to the point, amazing. Thank you, that was tremendously useful.
I know what you mean. Some teachers talk a lot about nothing and the learning takes forever. He was just right, explaining what needed to be explained.
very helpfull tutorial thank you
Great pace. Thanks for the content!
Fala meu camarada, sou brasileiro, nao falo ingles, mas o seu video foi o que realmente me ajudou !!!
Wow you explained simply
Your videos are eye opener.. thank you bro
Awesome Content Liked the way you Explained
Wow!! incredible ... Would love to see admin tutorial on existing non admin based app
Hey I am getting an error in the login Post request, I've done everything same and tried everything but i constantly get 400 bad request error just on the /users/login Post route
Neat and clear, Thank you WDS
Just a heads up, you only used one equal sign in you find statement. meaning you will be redefining peoples user names.
You want double equal sign when comparing, like this:
const user = users.find(user => user.name == req.body.name)
Shouldn't the line 25 on server.js read - const user = users.find(user => user.name === req.body.name) - rather than - const user = user.find(user => user.name = req.body.name) -. BTW, thanks a lot for these set of videos. They are amazing, keep up the good work.
well done 👏 for a great video , looking forward to watch your upcoming one !
Thank you very much. It was a great video. I would love to see a video of a full app with authentication as you mentioned at the end of this video. Thank you again! .
I'm really glad you enjoyed it. I am looking forward to building a full app version of this.
@@WebDevSimplified would be very nice, today im myself am going to try to put autentication in the full stack app, so users can see books and authors, but can only edit when logged in. I guess i should block parts of the routes depending on the login being true isn't it?
That is correct. Using a library like passport to help you with this may be useful. You also can create a middle ware that will check if a user is logged in and make it return an error if they are not.
@@WebDevSimplified Haha, fantastic, i got that working, it took a while, but that's the learning curve. its still needs some cleaning up, but that's for later, i just stored it at github.com/JEVBR/WDS
Thank you very much from France!
Thanks Robert Matthew Van Winkle, this was a great tutorial!
Simply You're more then everything for me, Best Wishes.
Great tutorial, as always!
I'm only 3 minutes into the video and you already got my like. I love the style of your explanations. Fast and concise so we get the maximum infos for minimum time. Really appreciated.
Very clear explanation, thanks a lot !
Your content is awesome bro👍👍👍
Good short video. To the point. Is the method you described known as Basic Authentication ?
Very clear and to the point. Thank you
You're welcome!
thank you for such a great content!! amazing work! subscribed!!!