Learn JWT with the PERN stack by building a Registration/Login system Part 1

In part one we build the restful API for our Registration / Login system
Video Time Stamps
0:00 - 3:43 Demo
3:43 - 16:21 What is JWT?
16:21 - 22:44 Code Preview
22:44 - 36:53 Create Server, Database, and Table
36:53 - 53:39 Build Register Route
53:39 - 59:24 Create JWT generator
59:24 - 1:06:53 Build Login Route
1:06:53 - 1:18:39 Create JWT middleware
1:18:39 - 1:30:47 Build Private Routes
1:30:47 - 1:33:49 Server Side Review
completed project : github.com/ousecTic/pern-jwt-...
postgresql installation: • PostgreSQL (Postgres) ...

[@TheStoicProgrammers]

Hey All, to prevent any future confusion, the git repository and the code in the tutorial are a tiny bit different but still work the same way. I provided comments for these two files to show you the difference. TL;DR => The payload for the JWT generator was different. jwtGenerator.js => github.com/l0609890/pern-jwt-tutorial/blob/master/server/utils/jwtGenerator.js dashboard.js => github.com/l0609890/pern-jwt-tutorial/blob/master/server/routes/dashboard.js I also notice that I used a post request when accessing our dashboard. This is not right! It should be a get request , because I am simply requesting information. Your application will still work;however I want to make sure you guys get the best practice so don't do what I did.

[@harishnarasimhan6552]

Hey, I think you missed out on typing the "next();" code after the line "req.user = payload.user;" in the authorization.js file at 1:12:24, if I'm not mistaken. Also, please come up with more tutorials for this stack as this is INSANELY helpful and understandable!! Great tutorial!!

[@kackupa752]

@@harishnarasimhan6552 I have been trying to figure out what my problem was for quite a long time. Thank you for pointing this out!

[@nikidhan]

i dont know which part i have to change to get request. router.post change to router.get?

[@ravenhooper9263]

I got eveerything to work, it was the greatest feeling ever. Thanks!

[@elifdilaraaygun9502]

This is really a great approach to have a code review at the beginning, it makes it to be more understandable for sure. Thank you

[@barrytophat]

Love the excitement of finding a course that deals with exactly what I need. I've created authentication with this stack before but this is going to be a good refresher

[@FedericoFavaro]

Man, your tutorials are awesome. I knew a bit of express and a bit of react and stuff but didn't feel like I could actually build something with these technologies. Then I went through your to-do list and suddenly I realized that I have all the tools I need to be able to make a simple CRUD website, I just never knew how to put it all together. Your tutorials have literally unlocked me, I can now finally build websites for real!

[@nikolailchovski9909]

Perfect example of what I am trying to build with the same exact stack. Thank you very much for creating this video

[@aithrajuniabouty599]

i really really really love your tutorial videos because you always explain what the code does but doesn't make me overwhelmed. Thank you so much!!

[@musthasinalam8769]

Great tutorial! Really made jwt with PERN stack totally transparent to me. Thanks!

[@tinpham6413]

Thank you so much, you save me when I dive into the Backend with PERN stack, your tutorial is so practical and very easy to understand

[@saziedhassan3976]

Love how you explain each and every step so well man! If you do get the chance and build more complex applications with production level authentication and authorization, that would be amazing! Looking forward to more great content from you, subbed! :D

[@trunojoyo84]

such an amazing teacher you are ! Please make another project on PERN stack. Will really help us beginner developers!

[@vkray]

Great tutorial. I need more PERN tutorial like many to many relationship.

[@sunderlicious2746]

Thank you so much for simplifying and explain this! I have gone through many tutorials but after watching this, it all makes sense.

[@tesfalemhaile8427]

Henry, Such an amazing tutorial. The way you explain things is excellent. this is so great! thank you so much. not many programers have the ability to explain the way you did. I was looking such kind of programers, where have you been man! keep it up !!!!! 👌❤️.

[@alexkey9372]

great tutorial! i tried prisma and it really simplifies all the sql queries if you are more familiar with json and mongodb.

[@Inthedark72]

Thank you for this tutorial, it was really helpful!

[@brohogany9920]

Thank you very much for posting these videos man.

[@aditiranjan303]

henry your tutorials are awesome.....and very very helpful...pls make more of them

[@eduardocarvalho4232]

Very intuitive tutorial, greetings from Portugal :D

[@loganbramwell5209]

You are insanely talented at teaching

[@rankokoturic6633]

Great content, im new to backend development and this video really explains alot

[@kenobi6020]

Really appreciate your work. All the content everywhere related to authentication is using the MERN stack, I just found this video in the comment section of another video explaining how to do authentication with postgres and express but no react :/ but luckily I ended up here. Thanks a lot! Gonna enjoy this as well as the rest of your videos so I can really master the PERN stack!

[@blankname44]

Thanks for the great tutorial bro. I subscribed for the high quality content :D

[@wanyi8761]

for real this is a gem🥳 what a video thank you brother

[@JimmyCheng]

great content, best found so far, please keep it up!

[@panos7853]

Thanks a lot.Nice explanation too!Keep it up!! You earned a sub

[@gavincoulson3900]

Great stuff man, keep up the good work.

[@parfaitmombo7471]

Thanks, bro! Nice tutorial.

[@SuperVladikk]

I want to say thank you and you the master!

[@lolashepota4050]

Perfect tutirial! Well done!

[@luisantonioloustaunaubauti7312]

Amazing tutorial. I got stuck at 1:12:46 when you created the authorization middleware. I believe there should be a next() at the bottom so the function continues to run. Once that was fixed it worked fine.

[@lotusea7964]

yup that's true

[@modavikllc9705]

Just out of curiosity, just so i can understand this better.. why did it work for Henry during the tutorial w/out next() but not for me/us?

[@deadlex3711]

@@modavikllc9705 At 1:21:33, or so, you can see it gets added before he runs the get request

[@modavikllc9705]

@@deadlex3711 ooh yeah i see.. that is one of the formatters he is using?

[@maj22448]

Please where put next () I'm new

[@zoltancaputo9562]

Amazing explantion! Tks

[@shaheerzaman620]

Enjoyed it.Please do bigger series and go deeper. Like implementing many to many relationship etc.

[@ignob9591]

I think a blogging website on PERN stack might help us to learn alot.

[@sadidarhamar4393]

thank you bro , i expect more content from you :)

[@Yaanzz1551]

Really helpfull tutorial, it has way to little thumbs up. Everything works perfect.

[@ankush1880]

Great content, thank you so much 🙂

[@55BLOCKS]

Good job and I like your explanation simple and clear

[@rizkymahendra5732]

You save my homework, thanks!

[@santinomantineo5275]

You sir just saved my life!

[@maximbazadji4895]

Thanks a lot, Henry! Can u please make a video about https/cors, Redis, or microservices?

[@ericcartman4799]

great tutorial, thanks for that

[@eddiechen6389]

very well explained!

[@rishrauz3469]

great video dude, thankyou

[@jacosh3924]

Really nice guide man

[@abirkolin4702]

thanks a lot. learned so muchhh!!!

[@MichaelOReillySD]

Wrist bellies... lol belly bands? Love the video and the laughs along the way

[@lenglain]

Wow this is awesome! Thanks for the good explanation of each step. I do have a minor complaint: Many tutorials assume that the viewer is too "dumb" to follow more intermediate use-cases and I think this is really unhelpful. If you do know how to incorporate this into a context/state management library and have the time to show that, that would be infinitely more instructive. These are videos after all and we can take as long as we want to understand each step. It would have also been great to see how this works with the exisint todo app you made (like how do you store todos by user? How do you load the correct user's todos once authenticated?) There are many scattered tutorials that show bits and pieces of how these things work but too few show how they all fit together. Almost none actually when it comes to this stack.

[@TheStoicProgrammers]

This is amazing! I typically don't get to see much feedback and idea when teaching so I appreciate you taking the time for giving me a new perspective. Thanks again for the good feedback and idea, I will keep them in mind.

[@stealtime]

yes. I totally agree on the point of combining this with the todo app. This is exactly what I would like to do -- be able to login and store each user's todos! does anyone have any tips on how to do this or know of any tutorials that show how to implement this?

[@joebidenmytime]

Thanks for making this! Very helpful and interesting. Why in the authorize middleware do you set the payload.user to the req.user? Shouldn't they be the same if they are authorized? Also, VSC yelled a lot about both req and payload not containing a user property but I'm like converting this to typescript so that error is a little bit out of the scope of this video

[@leanprogrammer]

Great stuff.. Looking forward to learn postgresql.. Ps: Never store jwt in localstorage... Save it in a cookie instead..

[@alokp3357]

Very Helpful tutorial, could you please make a tutorial covering S3 redux and postgresql?

[@codr6934]

Cool video! Can you say what the main processes are to secure the login and registration like from sql injections?

[@m2tdev]

exactly what i wanted

[@fathantn]

Thank u sir for ur help

[@badcode8029]

Thanks this is nice tutorial in the internet, the way you explain complicated things more easier to me. I think your pc lagging because your antivirus. haha

[@MusicMan121]

Hello. I read everywhere that the JWT should never be stored in local storage, but in cookies instead. May I ask you why you decided to store it in local storage?

[@user-ob2ev4yl8k]

Quality content

[@kiattisakphanphu3823]

thank you sir

[@rajdeeppurkayastha3287]

Please make more content on this stack

[@didymusorotayo7883]

Thanks for this tutorial man. And you are a really good teacher but quick quest can I understand what this does "(![name, email, password].every(Boolean))" I understand every runs through the array and returns true if all conditions are met, what is the Boolean in the every method, is it some sort of callback that is behind the scene?

[@creatorsremose]

Me: "Why is this guy's machine so damn slow?!" Video: 43:07 Me: "Oh, nevermind"

[@brotskyCode]

you are good speker, i am from Ukraine and understand all what you say

[@lotusea7964]

thank you thank you thank you

[@lif5558]

everything is the same with yours until 1.18.39. when I add authorization, it always throw an error such as "email or psw is incorrect". what's wrong with my code?but I do the same things with you? I didn't get what's wrong. but thanks, you explain very well and clearful. I'm thankful to you.

[@hassanxelamin]

if your middleware requests are stuck in a loop on postman, just remember to execute the next(); function so it knows to move on

[@juiceontheloose123]

thanks!!!!

[@JoshCodesIRL]

Hey! Going through the tutorial and trying to use postman on the register route at 44:31 and I'm getting the following error: Error: connect ECONNREFUSED 127.0.0.1:5000 Request Headers Content-Type: application/json User-Agent: PostmanRuntime/7.26.10 Accept: */* Host: localhost:5000 Accept-Encoding: gzip, deflate, br Connection: keep-alive it's also got a note that says it might be missing required headers? Any tips?

[@shambhaviaggarwal9977]

I did not get the twotwo reference at 44:17. What was that?

[@inesborges4857]

My route is not working at 44:31 when I try to make a post request. When I open localhost:5000 on browser it says cannot get /. How can I solve this problem?

[@Jonas-qm7ls]

When I attempt to post correct token string as the token header nothing happens. However, when I input wrong or empty string as a token, it works. What am I doing wrong?

[@atishpanday1800]

Hey, I loved your tutorial, and if you see this, I have a suggestion for you. Please please please, reduce the size of your integrated terminal so that we can see more of the code at once. Half your screen is occupied by the terminal for no reason. It's much easier to follow along when we can see more lines of code at once. Other than that, great explanation. Thanks!

[@brade.silver9852]

52:18 still getting a Server Error in POSTMAN and in my terminal am getting an ERROR saying null value in column "user_name" of relation "users" violates not-null constraint How is it working for him when he has created tables with a Not Null Constraints?

[@gearoidfly]

Hi Henry, thank you for the great tutorial, I had a problem ( my doing, your video is flawless) I deleted my table, now my page doesn't work, I'm getting jwt expired and invalid syntax for type uuid: "register", any ideas? thanks in advance, keep up the great work.

[@sarangcheruvattil5762]

How do you writing query in different lines instead of writing in one line..?

[@kurniamassidik5798]

its been 2 years, but i really thanks bout your content

[@mer2550]

validinfo status missing should be 400 bad gateway for clean. thank you for making tutorials

[@roselpadilla]

Thoughts on REPN vs PERN? "REP N" like nginx

[@jusuftopic4204]

Hallo. Thank you so much for tutorial. I have one problem. 48:05 When i want to check if user exist, I got this error : Cannot read property 'length' of undefined

[@tima8625]

Hi, I'm not sure why, but I am getting an error "data and salt arguments required" for following the steps up until 52:20 . When I console.log(password) it comes back undefined so the issue is with passing the password from the client side but I don't know how to fix this error. I'd appreciate any advice and help! Thanks.

[@jamied6835]

Have you resolved this? I’m stuck here too.

[@codr6934]

why do we need a jwt token at the registration if it works only 1 hr?

[@sagarjain4128]

What's inside user_id ? At timing 19.19, line number 31?

[@saadahmad1848]

My dashboard says status 200, but doesn't print anything ( res.json), what should I do?

[@aniketroy2656]

I get this error in console : Failed to load resource: the server responded with a status of 401 (Unauthorized) when loading any page. in post man when I tried doing 44:51, I got 404 not found. P.S. i zip downloaded the entire project and installed dependencies (by following beginning part of video) along with creating table and db in my PostgreSQL. Can anyone help ?

[@jairuscalvin9769]

Wow so helpful. can i have a questions? I got stuck in dashboard.js. Why on my dashboard cannot response user_id but the status is still 200 omg help me.

[@patrickkaipainen3301]

Does he cover refresh tokens?

[@shivanshusharma6918]

Why you didn't use sequelize?

[@amarnathlaishram2835]

Why my length says cannot read length of undefined

[@muhammadhatifmujahid7832]

hey everyone, my req.user is returning as undefined in dashboard.js does anyone have a fix for that?

[@Youngtimmyy]

does anybody know how setup postman because I keep trying to test mine on postman but it is not working

[@joshxone]

Not generating the JWT token for some reason. Can anyone help?

[@kennethz1539]

Hi Henry, for the authorization.js, when I console.log verify, it is an object {iat:343423423, exp:23423432} . How can you set req.user = verify.user since verify does not has a "user" key. Later on for dashboard.js I couldn't access the user_Id, since the authorize doesn't get back the user_id~ please help thank you

[@kennethz1539]

oh gosh, just didn't pass the correct user_id to the jwtGenerator..thanks for you tutorial...

[@ignob9591]

Hey Bro! Iam getting an error while installing bcrypt error:" bcrypt@4.0.1 install: `node-pre-gyp install --fallback-to-build`" please let me know where I made the mistake or solution for this error.

[@ignob9591]

Hey Iam using "npm install bcryptjs" instead of " npm install bcrypt" because somewhere I read like both of them do samething.

[@opensourcerror]

const {Pool} = require('pg') is shorter :)

[@ignob9591]

cool!! you are right. Just now tried it in db.js

[@farsikogama6114]

It is a shorthand which for beginner they might find it hard to understand

[@alexwhitmore4902]

Hmm, when generating a JWT token I am getting a Server Error after doing, res.json({ token }) however, the new user is still added. Does anyone know why I'd get a error returned as opposed to the token returned? I've been following along exactly, I think.

[@sethbridges3348]

Make sure your .env file is inside the server folder and not any other folder.

[@deepmind8260]

1:05:19 why for me return false? help me...!!. Excellent video

[@user-wp1gh5sy3g]

Hello I have a question regarding this code, are you still active and do you mind clarifying some questions that I have ?

[@thaituanly8955]

we have the same last name!

[@jacobspade739]

For some reason the jwtToken variable is 'undefined' after this part 'const jwtToken = req.header("token")'. Is anyone else having this problem? The request header is undefined

[@maj22448]

Me. Do you solve problem?

[@kaseabernathy3642]

How many other people came here after a full stack todo tutorial?

[@jenniferwang4945]

Hi! What's the difference between res.status(...).json(...) and res.status(...).send(...)?

[@upbee8719]

.send() allows you to send all kinds of data. plain text, html, json, etc. By specifying .json() it limits you to only send json data. It is basically a shorthand for res.type('json')

[@jenniferwang4945]

@@upbee8719 Cool, thank you!

[@SuperMBARutgers2013]

"In the client section, it's not too complicated you'll figure it out" then proceeds to chuckle. 🤔🤭

[@vithikabhatt6193]

Hey I'm getting an error while running psql -U postgres

[@vithikabhatt6193]

Can anyone help me with this error 'psql' is not recognized as an internal or external command, operable program or batch file.