React Login Authentication with JWT Access, Refresh Tokens, Cookies and Axios

  Рет қаралды 731,252

Dave Gray

Dave Gray

Күн бұрын

Web Dev Roadmap for Beginners (Free!): bit.ly/DaveGrayWebDevRoadmap
React Login Authentication with JWT uses access and refresh tokens to authenticate users. You will use Axios and learn how to handle and store JWT access and refresh tokens. Also, why secure cookies are better than localStorage.
💖 Support me on Patreon ➜ / davegray
⭐ Become a full-stack web dev with Zero To Mastery Courses:
- Advanced React: bit.ly/AdvReactDev
- Jr to Senior Web Dev Roadmap: bit.ly/WebDevRoadmap-JrtoSr
- Master FAANG Coding Interviews: bit.ly/FAANGInterview
🚩 Subscribe ➜ bit.ly/3nGHmNn
🚀 React JS for Beginners full course - 9 hours: • React JS Full Course f...
👀 React Login tutorial series playlist: • React Login, Registrat...
🔗 Starter Source Code: github.com/gitdagray/react_pr...
🔗 Completed Source Code: github.com/gitdagray/react_jw...
📬 Course Updates ➜ courses.davegray.codes/
React Login Authentication with JWT Access, Refresh Tokens, Cookies and Axios
(00:00) Intro
(00:41) Welcome Discussion
(01:43) JWT Authentication
(04:37) Update NPM Packages
(05:40) Users Component
(08:38) Users Request
(13:27) Requests Needs the Access Token
(14:25) useRefreshToken hook
(17:55) Testing useRefreshToken
(20:05) Private Axios Instance
(22:31) useAxiosPrivate with interceptors
(32:28) Updating the Users component
(35:11) Handling an expired refresh token
(39:56) JWT Strategy Revisited
☕ Buy Me A Coffee: www.buymeacoffee.com/davegray
The React Login Authentication Series:
1) React Register Form with Validation, Axios and a11y: • React JS Form Validati...
2) React User Login and Authentication with Axios: • React User Login and A...
3) React Protected Routes | Role-Based Authorization: • React Protected Routes...
4) This video!
🔗 Node JS Full Course (with source code) for building the backend REST API that will receive your form submissions: • Node.js Full Course fo...
🔗 React Router Version 6 in 20 minutes: • React Router v6 in 20 ...
🔗 FontAwesome for React:
fontawesome.com/v5.15/how-to-...
🔗 RegExr for Regular Expressions: regexr.com/
📚 JWT References:
Intro to JSON Web Tokens: jwt.io/introduction
All You Need to Know About Storing JWT in the Frontend: dev.to/cotter/localstorage-vs...
Cross-Site Scripting (XSS): owasp.org/www-community/attac...
Cross-Site Request Forgery (CSRF): owasp.org/www-community/attac...
📚 Accessible Form References:
WebAIM.org - Advanced Forms: webaim.org/techniques/forms/a...
WebAIM.org - Form Validation: webaim.org/techniques/formval...
MDN - Aria Attributes:
aria-invalid: developer.mozilla.org/en-US/d...
aria-describedby: developer.mozilla.org/en-US/d...
aria-live: developer.mozilla.org/en-US/d...
aria-label: developer.mozilla.org/en-US/d...
🔗 ES7 React JS Snippets Extension for VS Code:
marketplace.visualstudio.com/...
🔗 React Dev Tools Extension for Chrome:
chrome.google.com/webstore/de...
📚 References:
ReactJS Official site: reactjs.org/
React Wikipedia: en.wikipedia.org/wiki/React_(...)
React Jobs: www.ziprecruiter.com/candidat...
✅ Follow Me:
Github: github.com/gitdagray
Twitter: / yesdavidgray
LinkedIn: / davidagray
Blog: yesdavidgray.com
Reddit: / daveoneleven
Was this tutorial about React Login Authentication with JWT Access and Refresh Tokens helpful? If so, please share. Let me know your thoughts in the comments.
#react #login #authentication

Пікірлер: 938
@DaveGrayTeachesCode
@DaveGrayTeachesCode 2 жыл бұрын
In this tutorial, you will learn how to apply a JWT user authentication strategy with access and refresh tokens to your React app. You will also learn how to create a private Axios instance and apply Axios interceptors to requests and responses. This tutorial is part 4 of a React User Login and Registration series. Links to all tutorials in this series are in the description. 🚀 If you're just getting started with React, I recommend my React JS for Beginners full course here: kzfaq.info/get/bejne/iLx2dNx3vLWYl6M.html
@vickylance
@vickylance 2 жыл бұрын
I have a doubt is it fine having so many 403 requests made and logged in the console? Or is calling refresh token api in a settimeout better?
@samiullahsheikh5015
@samiullahsheikh5015 2 жыл бұрын
Dave, I have the similar question. When should make the refresh token api call ? What is the best approach to hit refresh token endpoint to get new access token?
@DaveGrayTeachesCode
@DaveGrayTeachesCode 2 жыл бұрын
@@samiullahsheikh5015 using the Axios interceptors detailed in this tutorial, the refresh token endpoint is automatically requested when needed.
@DaveGrayTeachesCode
@DaveGrayTeachesCode 2 жыл бұрын
@@vickylance nothing wrong with a 403 if it is handled. The interceptors handle it. 💯
@broncoUkraine
@broncoUkraine 2 жыл бұрын
Hi, thanks a lot, but with React 18 the last part with interceptors doesn't work. I receive CanceledError if using react 18 method render in the index.js, like const root = ReactDOM.createRoot(document.getElementById('root')); . And everything is fine when you use simple ReactDOM.render('code here").
@markoleptic4501
@markoleptic4501 Жыл бұрын
This video in combination with the "JWT Authentication | Node JS and Express tutorials for Beginners" is the only tutorial/tutorial series that actually describes the full backend to frontend implementation of jwt authentication. AND provides the source code. It was frustrating finding so many videos that only did part of the implementation and expected the viewers to know how to handle the rest. Thank you.
@DaveGrayTeachesCode
@DaveGrayTeachesCode Жыл бұрын
You're very welcome!
@luiscortes6563
@luiscortes6563 10 ай бұрын
Yes thanks a lot! I attempted this about 2 yrs ago and couldn’t find a video on it being done the right way; they didn’t store access token in memory!
@zb2747
@zb2747 2 жыл бұрын
Thank you Dave - just watched your node jwt auth video with refresh tokens and now watching the implementation w/react on the client. Like someone said here there’s not to many dev/teachers who explain and implement jwt auth w/refresh end to end and with a database. Keep the videos coming my friend! Would love to see more intermediate - advanced topics especially in node. Peace and much love 🙏🏾
@DaveGrayTeachesCode
@DaveGrayTeachesCode 2 жыл бұрын
Thank you, ZB! 💯
@sammyattah4653
@sammyattah4653 2 жыл бұрын
Thank you Dave. I can't stop recommending you to my friends/colleagues. If one wants to learn modern react, your channel is highly recommended. You have helped me change some of my old codes.
@DaveGrayTeachesCode
@DaveGrayTeachesCode 2 жыл бұрын
Awesome, thank you! 💯🚀
@thomasmunguya2207
@thomasmunguya2207 9 ай бұрын
I love how you explain concepts in detail. You go as far as explaining the motivation behind every decision made. Great tutorial and thanks!.
@spirits__
@spirits__ 2 жыл бұрын
You are on 🔥 with these advanced topics. Please keep them coming as there aren’t as many great videos on these topics. I just happen to be working on a new authentication system at work and trying to understand the differences between access, refresh token and the best practices for storing them and your video helped a lot ✊ and right on time
@DaveGrayTeachesCode
@DaveGrayTeachesCode 2 жыл бұрын
That's great to hear! Glad I could help and thanks for the support! 💯🚀
@memoryleakerz
@memoryleakerz Жыл бұрын
I've seen many instructors Dave but you set a higher, newer, and better standard. You explain everything to the level of formatting your code and you master these skills with great knowledge. Awesome tutorial!!! you're awesome, subscribed for sure.
@DaveGrayTeachesCode
@DaveGrayTeachesCode Жыл бұрын
Thank you for the kind words, and welcome aboard! 💯
@D4arkl0rd
@D4arkl0rd Жыл бұрын
This is gold! It just doesn't talk about the concepts instead develops per expectations of a real time user application. Absolutely loved it!
@DaveGrayTeachesCode
@DaveGrayTeachesCode Жыл бұрын
Thanks!
@thomasandre-lubin3899
@thomasandre-lubin3899 Жыл бұрын
Amazing tutorials, I've rarely seen something that well explained, and detailed. The rythm is great too !
@DaveGrayTeachesCode
@DaveGrayTeachesCode Жыл бұрын
Happy to hear that!
@riteshjoshi0413
@riteshjoshi0413 2 жыл бұрын
I love how you simplify the topic while explaining sir. Thank You so much
@DaveGrayTeachesCode
@DaveGrayTeachesCode 2 жыл бұрын
Thank you, Ritesh! 💯🙏
@kartikarora3521
@kartikarora3521 2 жыл бұрын
Thank You! I was waiting for this video. There is no video on KZfaq which shows how to implement Refresh Token. Even I took a udemy course and it just showed me how to implement just Access Token and skipped the Refresh Token part. Thank You soo much!
@DaveGrayTeachesCode
@DaveGrayTeachesCode 2 жыл бұрын
Right on! 💯 I have also noticed this information is hard to find. I have included some resource links in the description too.
@kartikarora3521
@kartikarora3521 2 жыл бұрын
@@DaveGrayTeachesCode Thanks, I will read those articles too.
@hristopisarev1827
@hristopisarev1827 11 ай бұрын
I have watched many tutorials and paid courses but this is next level - awesome explanation of everything ! Thank you!
@demetrx7972
@demetrx7972 Жыл бұрын
This one explained all I needed and relieved me of that pain related to access/refresh tokens that I've been having for the last couple of days. Thank you, Dave!
@DaveGrayTeachesCode
@DaveGrayTeachesCode Жыл бұрын
Glad I could help!
@webblocksapp
@webblocksapp Жыл бұрын
Hi Dave thanks a lot for this tutorial, it helped me a lot for implementing a refresh token flow at my React app. I would like to add a small fix to your guide, instead of using 403 response status at the interceptor, use 401. 401 refers to unauthorized, it means the client provides no credentials or invalid credentials, and 403 the client has valid credentials but not enough privileges to perform an action on a resource. If we validate vs 403, we can have the scenario of refreshing the token unnecessarily if the user doesn't have a role for a specific request.
@DaveGrayTeachesCode
@DaveGrayTeachesCode Жыл бұрын
Thanks for the note! Not sure where I first learned 403 was the response to use for the expired access token but I stand corrected. 💯
@daniezra
@daniezra Жыл бұрын
@@DaveGrayTeachesCode I had the same issue, the ChatGpt response about that is: "When an access token expires in API, you should return the HTTP status code 401 Unauthorized, along with a WWW-Authenticate header indicating the authentication method required to access the requested resource. The HTTP status code 401 Unauthorized indicates that the request lacks valid authentication credentials for the target resource, and the WWW-Authenticate header informs the client which authentication method to use to authenticate the request. This is the correct status code to use when an access token has expired or is invalid. The HTTP status code 403 Forbidden, on the other hand, indicates that the server understood the request, but refuses to authorize it. This means that the client has authenticated correctly, but does not have sufficient permission to access the requested resource. Therefore, it is not appropriate to use the HTTP status code 403 Forbidden when the access token has expired in API. I had the same issue, the ChatGpt response about that is:In summary, when an access token expires in Web API, you should return the HTTP status code 401 Unauthorized."
@kawsar.130
@kawsar.130 Жыл бұрын
Your videos are making great changes to my skillset and improving standard programming concept everyday. You are awesome Dave Gray. I really appreciate your hard work.
@DaveGrayTeachesCode
@DaveGrayTeachesCode Жыл бұрын
Great to hear! Thank you!
@miloheh
@miloheh 2 жыл бұрын
Super helpful! I struggled making this year ago. I’m glad to see this explained because it seems much more manageable/clear coming from you!
@DaveGrayTeachesCode
@DaveGrayTeachesCode 2 жыл бұрын
Glad I could help! 💯
@ImperiousRex13
@ImperiousRex13 Жыл бұрын
Hey Dave, I appreciate all your hard work in putting these videos together for those of us trying to learn something new. I enjoyed your video but I am having issues when logging in to see the Users list. I've seen that you answered similar questions about getting a CanceledError and I've also taken a look at your other videos describing these breaking changes. I've tried to implement your solutions while still working with strict mode but, I still receive errors. So far the only solution that has worked for me is to remove the AbortController in the Users component's useEffect but, is that appropriate? I would like to do things the right way and seeing as how you have the Abort Controller I just don't know what I should do.
@DaveGrayTeachesCode
@DaveGrayTeachesCode Жыл бұрын
Hi Rick. The AbortController issues an CanceledError by default when called. It is not a bad thing because it is expected to happen. With React 18 strict mode, React mounts, unmounts, and remounts each component. This creates one of those CanceledErrors. I did make a video about how to workaround this here: kzfaq.info/get/bejne/bpeWlL2r1ZecfoE.html
@ImperiousRex13
@ImperiousRex13 Жыл бұрын
@@DaveGrayTeachesCode Thanks for the response! I am currently watching the workaround video because at this point I considered removing the AbortController altogether. Do the errors also explain why, when I try to log in to see the users list, I was not redirected to see the list? When I try to log in, I can see the user object retrieved but all that happens is the Login form/component reloads.
@brajagopalmukherjee1588
@brajagopalmukherjee1588 2 жыл бұрын
Man waiting for full stack beginner friendly project
@DaveGrayTeachesCode
@DaveGrayTeachesCode 2 жыл бұрын
Coming soon! 💯
@user-ry4hu4br2z
@user-ry4hu4br2z 4 ай бұрын
Incredible! I had been looking for this content for some time, I was very dissatisfied with my authentication strategy, as I started in the area recently, I ended up following some practices, which based on initial knowledge, it is not possible to say whether it is a safe practice or not. your approach gave me good insights into how I can keep improving, thanks Dave, impeccable work. hugs from Brazil!
@ronir.kpradhan1785
@ronir.kpradhan1785 2 жыл бұрын
Hey Dave, just wanna say thank you for this amazing tutorial you really made it crystal clear on how to handle the tokens. Much love and wish you good health 🙏
@DaveGrayTeachesCode
@DaveGrayTeachesCode 2 жыл бұрын
You're welcome, Roni! 🙏💯
@VinceKully
@VinceKully Жыл бұрын
Hey Dave just wanted to point out that axios >= 1.0.0 (1.0 was released ~10 days ago) will cause your response interceptor to reject an error when retrying. There are a few lines in the axios source code that, when trying to normalize values, ends up returning any unknown value via toString, which ends up spitting out an entire function being toStringed as the error passed into the response interceptor. Downgrading axios to 0.27.2 allowed your solution to work perfectly.
@DaveGrayTeachesCode
@DaveGrayTeachesCode Жыл бұрын
Thanks Vince - yes, technology keeps moving forward. Also note this tutorial uses React 17 and React 18 strict mode will trigger multiple requests.
@dukekim4816
@dukekim4816 Жыл бұрын
Hi Dave! Loving the tutorials. Any plans on updating this to keep up with updates?
@DaveGrayTeachesCode
@DaveGrayTeachesCode Жыл бұрын
@@dukekim4816 YT will not let me update videos.
@Iskarize
@Iskarize Жыл бұрын
Do you think this will get fixed in the future?
@calinciobanu259
@calinciobanu259 Жыл бұрын
@@DaveGrayTeachesCode Hey! Are you not going to say anything about a quick fix? I have been struggling with this problem for a couple of hours and just now saw this comment
@hikemalliday6007
@hikemalliday6007 Ай бұрын
These are baller vids man. Ive been at an internship for 3 months now, and the first couple months was a brain bleeding experience -- all of my self taught apps up to the point of hire were very one dimensional and basic, in terms of fetches, config, etc (they still are, but slightly better). After working in a pro setting and having to learn and use better practices such as custom hooks, acios config objects, etc, I can now follow and appreciate these videos even more. This is the perfect level of difficulty for me to improve my hobby applications. Great content, thank you so much!
@sadaliryu
@sadaliryu Жыл бұрын
Thanks Dave Gray, i searched for this course and didn't find any clear and functional tutorial like your, Well Done
@DaveGrayTeachesCode
@DaveGrayTeachesCode Жыл бұрын
Glad it was helpful!
@googlemani
@googlemani 3 ай бұрын
Enjoyed the content on JWT Authentication on React. I have bookmarked your other videos on the playlist. I highly recommend your Nodejs and ReactJS course.
@mohajeramir
@mohajeramir Жыл бұрын
Congratulations on 💯. What a great way to wrap up the year. Might be a good occasion to post a non-technical video. I am sure a lot of people would love to know you more.
@DaveGrayTeachesCode
@DaveGrayTeachesCode Жыл бұрын
Thank you and thank you for the request! 💯
@nikolozmacharashvili1212
@nikolozmacharashvili1212 5 ай бұрын
went from studying your videos to getting a job. Although we kind of not use react, but because of my skills I got the job. So A big thank you
@Teddyrobinson
@Teddyrobinson 5 ай бұрын
Thank you for the tutorials!! Made it through all 4 and I'm happy that I did
@morphology5114
@morphology5114 2 жыл бұрын
In my app, I won't need registering, and I was searching for a tutorial on handling JWT authentication with react. You literally saved me posting this tutorial right now. I will try to implement only login using this video, I'm using Django for my backend. Thank you very much, very good and understandable tutorials + the small tips and tricks with the VS Code are also on point!
@DaveGrayTeachesCode
@DaveGrayTeachesCode 2 жыл бұрын
Glad I could help! 💯
@TheJamesgggill
@TheJamesgggill 2 жыл бұрын
This is probably the best JWT auth tutorial i've seen. Thank you!
@DaveGrayTeachesCode
@DaveGrayTeachesCode 2 жыл бұрын
Thank you, James! 🙏
@TannerBarcelos
@TannerBarcelos 2 ай бұрын
This is something I still struggle with after 3 years experience. This cleared up all my confusions. Thanks as usual, Dave!
@TheNiquitin
@TheNiquitin Жыл бұрын
Great tutorial! Very helpful, and as somebody else mentioned, I love that you mention every shortcut you use in VS Code because that lets em improve my own workflow. I'm always postponing diving deeper into VS Code's tools and this kills two birds with one stone (my apologies to PETA members).
@DaveGrayTeachesCode
@DaveGrayTeachesCode Жыл бұрын
You're welcome!
@DH-jw4th
@DH-jw4th 2 жыл бұрын
Wow, thanks for responding tho my request. This was worth the wait! Genius presented in a way that can be understood by the average react developper…
@DaveGrayTeachesCode
@DaveGrayTeachesCode 2 жыл бұрын
Right on! 💯 Glad I could help!
@waili4028
@waili4028 2 жыл бұрын
thank you so much for the video, you answered all my confusions already in the first few mins! enjoying the whole video now
@DaveGrayTeachesCode
@DaveGrayTeachesCode 2 жыл бұрын
Glad it was helpful! 💯
@dominiktworek6455
@dominiktworek6455 6 ай бұрын
Hey, I am someone who knows react and js very little. I decided to build a full-stack application using React on TypeScript, SpringBoot on Java and MySql database. While I feel confident with Java and Spring, I struggle a lot with React. This series helps me a lot to implement a logging system and routing system. Some topics like cors weren't clear to me and with this series and with some ChatGPT explanation I got to the point where every basic info about HTTP-only cookies, tokens, react-router, etc became greatly allocated in my brain :). I would pay for a course like this, so I really think this is super valuable material. Peace and happy coding!
@marcel5235
@marcel5235 Жыл бұрын
Finally intermediate tuts for my job - appreciate your content, helps me get little bit higher and self sufficient as React dev at job field
@DaveGrayTeachesCode
@DaveGrayTeachesCode Жыл бұрын
Glad I could help!
@TheLukjtas
@TheLukjtas Жыл бұрын
Tus tutoriales son fantásticos! Estoy estudiando inglés por lo que se me complica un poco el idioma, pero tu contenido es de extrema utilidad. New sub! thx
@DaveGrayTeachesCode
@DaveGrayTeachesCode Жыл бұрын
Gracias Lucas! Yo comprende un poquito español mi amigo 😃
@gokulrajan6987
@gokulrajan6987 2 жыл бұрын
Very informative! The best I have seen so far!
@DaveGrayTeachesCode
@DaveGrayTeachesCode 2 жыл бұрын
Glad to hear that! 💯
@hamidabdolrahimi4606
@hamidabdolrahimi4606 Жыл бұрын
Thank you man. Awesome, best tutorial ever. Keep it up
@yuhiahtyun5665
@yuhiahtyun5665 2 жыл бұрын
You're awesome Mr.Gray. Keep up your great work, your channel gonna be big in the future !
@DaveGrayTeachesCode
@DaveGrayTeachesCode 2 жыл бұрын
Thank you for the kind words! 🚀
@sultannasyrov4662
@sultannasyrov4662 2 жыл бұрын
Great course on react authentication. Thanks a lot. Exactly what needed.
@DaveGrayTeachesCode
@DaveGrayTeachesCode 2 жыл бұрын
Glad it was helpful! 💯
@laurraileanu8374
@laurraileanu8374 Жыл бұрын
great tutorial Dave, really in-depth and easy to understand
@DaveGrayTeachesCode
@DaveGrayTeachesCode Жыл бұрын
Thank you!
@miglrodri
@miglrodri Жыл бұрын
This is great content, i watched all videos, probably forgot to like them all, but already subscribed to the channel. Thanks very much for the explanation 👏
@DaveGrayTeachesCode
@DaveGrayTeachesCode Жыл бұрын
Welcome aboard! And thank you for the kind words! 🙏💯
@saadarman4718
@saadarman4718 6 ай бұрын
Another well made and greatly explained tutorial.
@pravinkumarg8007
@pravinkumarg8007 2 жыл бұрын
This is next level tutorial. Thanks @DaveGray for an awesome tutorial :)
@DaveGrayTeachesCode
@DaveGrayTeachesCode 2 жыл бұрын
Thank you for the kind words, Pravin! 💯
@HayatoYano-qt8tu
@HayatoYano-qt8tu Жыл бұрын
Very well explained. Helping me a lot, Mr. Dave. Cheers from japan
@DaveGrayTeachesCode
@DaveGrayTeachesCode Жыл бұрын
Thank you! And hello 👋 to Japan!
@ibraheemsulay
@ibraheemsulay 2 жыл бұрын
This guy could explain a very technical concept to a toddler and the toddler would understand it with ease. Thank you for this wonderful tutorial
@DaveGrayTeachesCode
@DaveGrayTeachesCode 2 жыл бұрын
Thank you for the kind words, Ibrahim! 🙏🙏
@kodewala
@kodewala 9 ай бұрын
A perfect solution to my every problem. Trust me this video is going to help me a lot.
@hasanfawaz9282
@hasanfawaz9282 Жыл бұрын
Thank you Dave for everything, I have learned so much from you. 💙💙
@DaveGrayTeachesCode
@DaveGrayTeachesCode Жыл бұрын
Glad to help!
@malharthite9838
@malharthite9838 2 жыл бұрын
Thank you the explanation, this is what I was looking for!
@DaveGrayTeachesCode
@DaveGrayTeachesCode 2 жыл бұрын
Glad I could help! 🚀🚀
@MASTERRAGE
@MASTERRAGE 2 жыл бұрын
Exactly what I wanted ! Thanks
@profeskills768
@profeskills768 2 жыл бұрын
This is the best JWT-cookie auth tutorial i've seen. Thank you so mush!, all works for me . thank you again for this awesome Tutorial.
@DaveGrayTeachesCode
@DaveGrayTeachesCode 2 жыл бұрын
You're welcome!! 🙏
@Anonymose43
@Anonymose43 2 жыл бұрын
That’s letterly awesome ! Good explanation man
@DaveGrayTeachesCode
@DaveGrayTeachesCode 2 жыл бұрын
Thank you! 🙏💯
@lidorbenshimol1838
@lidorbenshimol1838 2 жыл бұрын
Hey Dave, Amazing tutorial as usual. Im very happy to find pro tutorials like that in youtube and want to say thank you!
@DaveGrayTeachesCode
@DaveGrayTeachesCode 2 жыл бұрын
You're welcome! 💯
@masonasa7009
@masonasa7009 5 ай бұрын
thank you sir for this this truly raised my level up a notch and am happy this series teaches almost everything and i must say it did get a bit advanced for me lol
@GautamKumar-jx5su
@GautamKumar-jx5su 11 ай бұрын
All this interconnected tutorials feels like movies franchise :) love this tutorial btw.
@jeffreysegovia7656
@jeffreysegovia7656 2 жыл бұрын
Thank you Dave! :) This is nice and helpful indeed :)
@DaveGrayTeachesCode
@DaveGrayTeachesCode 2 жыл бұрын
You're welcome, Jeffrey! 🚀
@Olekiapi
@Olekiapi Жыл бұрын
Thanks dave this was educative, I was having problems in implementing Auth on React.
@DaveGrayTeachesCode
@DaveGrayTeachesCode Жыл бұрын
Glad I could help!
@egorushakov2267
@egorushakov2267 Жыл бұрын
Finally, a video that shows you how to securely authenticate users. Thanks Dave
@DaveGrayTeachesCode
@DaveGrayTeachesCode Жыл бұрын
Welcome!
@yuureact3259
@yuureact3259 Жыл бұрын
Really really love your video; thank you so much for a such great tutorial!
@DaveGrayTeachesCode
@DaveGrayTeachesCode Жыл бұрын
Glad it was helpful!
@ksue1448
@ksue1448 2 жыл бұрын
The best Auth tutorial ever!! appreciate all the references links too
@DaveGrayTeachesCode
@DaveGrayTeachesCode 2 жыл бұрын
You're welcome! 💯
@karamisa2272
@karamisa2272 Жыл бұрын
Wow what a great explanation
@rauldeandrade
@rauldeandrade 2 жыл бұрын
Great quality content. I'm surprised I haven't seen your channel earlier
@DaveGrayTeachesCode
@DaveGrayTeachesCode 2 жыл бұрын
Welcome aboard, Raul! 💯
@Sv-ry9lj
@Sv-ry9lj Жыл бұрын
One of the best tutorials! Thank you
@DaveGrayTeachesCode
@DaveGrayTeachesCode Жыл бұрын
You're very welcome!
@tech5956
@tech5956 Жыл бұрын
Great tutorial😍, Keep sharing videos like this, Wish you more subscribers for your great efforts and time
@DaveGrayTeachesCode
@DaveGrayTeachesCode Жыл бұрын
Thank you!
@htoomaungthait1880
@htoomaungthait1880 10 ай бұрын
Thank for showing way to implement role based authentication and access control in react.
@JS_shorts_dev
@JS_shorts_dev 4 ай бұрын
Thank you Dave!
@chans9055
@chans9055 2 жыл бұрын
Now I think I know how to apply access/refresh token strategy to web services. Thank you for the great tutorial!
@DaveGrayTeachesCode
@DaveGrayTeachesCode 2 жыл бұрын
Glad it was helpful! 💯
@DjangoElRey
@DjangoElRey Жыл бұрын
Love it again, finest explanations! 🙏
@DaveGrayTeachesCode
@DaveGrayTeachesCode Жыл бұрын
Thank you!
@supplyuniquenotessun4562
@supplyuniquenotessun4562 5 ай бұрын
reallllllllllllly awesome, tons of thanks
@jonathantang4429
@jonathantang4429 2 жыл бұрын
Your videos are one of the best out there. Each time there are anything that I don't understand from your video, I will go and research more on that portion and I will learn a lot. I got lost on the useAxiosPrivate hook portion but I just followed along the tutorial and it works!! Now I need to go learn about interceptors. Do you have any videos on it?
@DaveGrayTeachesCode
@DaveGrayTeachesCode 2 жыл бұрын
Glad I could help, Jonathan! 💯 This is the video I cover where I cover Axios interceptors overall. They intercept requests and responses and allow you to modify those requests and responses as they are intercepted. The Axios docs cover them here, too: axios-http.com/docs/interceptors
@shashwa7
@shashwa7 Ай бұрын
36:27 one small addition in that catch block, is to check if the catched error code is due to 'cancelled req' due to aborting req when component unmounts. otherwise it will keep navigating back to login page even after success login! the code will look like: const getUsers = () => { try{ //try block code } catch (err) { console.log("error fetching users", err); if (err.code !== "ERR_CANCELED") navigate("/login", { state: { from: location }, replace: true }); } }
@andrewclarke6916
@andrewclarke6916 2 жыл бұрын
Phew! This was a tricky one and it took a while to get it working correctly but I got there in the end. I had the same cookie problem as Marcos but working fine now after adding 'secure: true' to the cookie settings.
@DaveGrayTeachesCode
@DaveGrayTeachesCode 2 жыл бұрын
Good job, Andrew! 💯🚀
@thakursaad9364
@thakursaad9364 Жыл бұрын
This whole playlist was of insane help. Don't know how to say thank you. But thank you anyway
@DaveGrayTeachesCode
@DaveGrayTeachesCode Жыл бұрын
You're welcome! 🙏
@jamesbest2221
@jamesbest2221 2 жыл бұрын
Fan-freaking-tastic! Thank you for this!
@DaveGrayTeachesCode
@DaveGrayTeachesCode 2 жыл бұрын
You're welcome, James! 💯
@sanjeevchaurasia4819
@sanjeevchaurasia4819 2 жыл бұрын
Thank you so much dave. Lots of love
@DaveGrayTeachesCode
@DaveGrayTeachesCode 2 жыл бұрын
You're welcome, Sanjeev! 🙏🙏
@amithbhagat
@amithbhagat 2 жыл бұрын
Thank you 🙏 Dave, it helped me a lot.
@DaveGrayTeachesCode
@DaveGrayTeachesCode 2 жыл бұрын
You're welcome!
@kashmirtechtv2948
@kashmirtechtv2948 11 ай бұрын
very practical video.good
@hoyinleunghk
@hoyinleunghk 2 жыл бұрын
very clear, great work,thank you
@DaveGrayTeachesCode
@DaveGrayTeachesCode 2 жыл бұрын
You're welcome! 🙏
@kunalcharde367
@kunalcharde367 6 ай бұрын
Thank you for this it helps a lot🙏
@1Malak16
@1Malak16 2 жыл бұрын
Thank You! There is not so much high quality information regarding advanced topics such as authentification. Please keep on with such videos.
@DaveGrayTeachesCode
@DaveGrayTeachesCode 2 жыл бұрын
You're welcome! 💯🚀
@rishidubey8745
@rishidubey8745 11 ай бұрын
your explanati level on is something else !!!
@sdfsfsfd437
@sdfsfsfd437 Жыл бұрын
Awesome video! Many thanks! 💯💛👍
@DaveGrayTeachesCode
@DaveGrayTeachesCode Жыл бұрын
You're welcome!
@muhammedcansoy6131
@muhammedcansoy6131 7 ай бұрын
excellent thank you !
@OmG21097
@OmG21097 4 ай бұрын
Thank you for your tutorial
@codernasir1549
@codernasir1549 2 жыл бұрын
A simple like or share is not enough for this rich tutorial. you deserve more. take love.
@DaveGrayTeachesCode
@DaveGrayTeachesCode 2 жыл бұрын
Thank you for the kind words! 🙏🙏
@user-sn9ye9rh8f
@user-sn9ye9rh8f 5 ай бұрын
The best IT teacher over the world!
@user-di7mz3gz3i
@user-di7mz3gz3i 5 ай бұрын
hey dave, i love ur teaching style but , i want just one thing that , if u can do , can plz first explain , in which file what are u going to do , what is your thinking behind that file creation , i understand u breaking file in individual part for code modulizing but when we see the video , first we have to understand why this file is created and why u do that , what is ur thinking behind that file creation then we understand rest of , no doubt your teaching skill are far greater then any other teachers on youtube , if u can do this that help us a lot , love from India
@coolme7437
@coolme7437 5 ай бұрын
This tutorial is a gem❤
@al-doori2392
@al-doori2392 Жыл бұрын
Thank you a lot lot I was struggling how to combine .NET Core API implementing JWT with React, may gold bless you and give you what you wish, you helped me a lot !!
@DaveGrayTeachesCode
@DaveGrayTeachesCode Жыл бұрын
Glad to hear I helped!
@ahmad-murery
@ahmad-murery 2 жыл бұрын
I think I need to watch this video one more time, I feel like my brain got shrank a little, it's maybe the cold weather, Thanks Dave,
@DaveGrayTeachesCode
@DaveGrayTeachesCode 2 жыл бұрын
It's definitely the cold weather my friend! 🥶
@zahansafallwa3263
@zahansafallwa3263 Жыл бұрын
Man this is wholesome.. loved it
@DaveGrayTeachesCode
@DaveGrayTeachesCode Жыл бұрын
Glad you liked it!
@dharmeshgohil9375
@dharmeshgohil9375 2 жыл бұрын
Awesome bro loved it
@DaveGrayTeachesCode
@DaveGrayTeachesCode 2 жыл бұрын
Glad to hear it, Dharmesh! 🚀🚀
@zenec_
@zenec_ 2 жыл бұрын
Great guide! almost feel like I need to rewrite all my code cause the tutorials I followed didn't cover half of what you did... but that will be for some other time cause I have other projects to finish x) But thx for sharing your knowledge ow wise man!
@DaveGrayTeachesCode
@DaveGrayTeachesCode 2 жыл бұрын
You're welcome! 🙏🙏
@pradeepmax1
@pradeepmax1 Жыл бұрын
Best JWT Tutorial on YT 👍
@DaveGrayTeachesCode
@DaveGrayTeachesCode Жыл бұрын
Appreciate that!
@dandelion0331
@dandelion0331 Жыл бұрын
youtube now doesn't display dislike anymore. Dave if you see dislikes at the backend of youtube, don't frustrate, those dislikes are from bootcamp training people. we suport you. learned a lot from MERN stack series and this series. The redux series is little tough but I will spend more time on those. Thanks!
@DaveGrayTeachesCode
@DaveGrayTeachesCode Жыл бұрын
Thank you for the kind words!
@mauronunes7196
@mauronunes7196 11 ай бұрын
Insanity how good this is.
@mahendranath2504
@mahendranath2504 2 жыл бұрын
this is quality content, Sooooo much thankful to you 🙌👌👍😍😍🤩🤩
@DaveGrayTeachesCode
@DaveGrayTeachesCode 2 жыл бұрын
You're welcome! 💯
@Codehood
@Codehood 10 ай бұрын
Thank you so much
@remu851
@remu851 2 жыл бұрын
THIS IS TOP TIER TUTORIAL 🔥
@DaveGrayTeachesCode
@DaveGrayTeachesCode 2 жыл бұрын
Thank you! 💯
@juliansyah4byte57
@juliansyah4byte57 Жыл бұрын
This is the video that i want
React Persistent User Login Authentication with JWT Tokens
37:27
KINDNESS ALWAYS COME BACK
00:59
dednahype
Рет қаралды 143 МЛН
Red❤️+Green💚=
00:38
ISSEI / いっせい
Рет қаралды 20 МЛН
You don't need a frontend framework
15:45
Andrew Schmelyun
Рет қаралды 110 М.
What Is JWT and Why Should You Use JWT
14:53
Web Dev Simplified
Рет қаралды 1,1 МЛН
JWT Authentication Tutorial - Node.js
27:36
Web Dev Simplified
Рет қаралды 1 МЛН
Session vs Token Authentication in 100 Seconds
2:18
Fireship
Рет қаралды 1 МЛН
Refreshing Tokens With Axios Interceptors
39:55
Dennis Ivy
Рет қаралды 87 М.
JWT Authentication | Node JS and Express tutorials for Beginners
1:00:03