React Router Tutorial - 15 - Authentication and Protected Routes

📘 Courses - learn.codevolution.dev/
💖 Support UPI - support.codevolution.dev/
💖 Support PayPal - www.paypal.me/Codevolution
💾 Github - github.com/gopinav
⚡️ Checkout Taskade! www.taskade.com/
To upgrade any workspace, login and visit www.taskade.com/billing
Use coupon code: CodevolutionTH-cam for any workspace upgrade. Select "Add promo code" on checkout, enter the code, then hit "Apply". This will apply a 100% one year subscription discount. Enjoy and feel free to invite others to your workspace!
📱 Follow Codevolution
+ Twitter - / codevolutionweb
+ Facebook - / codevolutionweb
📫 Business - [e-mail]
Authentication and Protected Routes in React Router
React Router Tutorial
React Router Tutorial for Beginners

[@masvimydeen249]

You are an awesome instructor. Breaking things simpler to understand is your real magic. Lovely tone, frequency and consistent voice delivery is also a reason, things the you explained in your video are getting easily registered. Keep rocking in this space.

[@kumarsaroj18]

I am happy to share that I finished this series in one whole day (of course, I did write code side by side).
Although, I am still clueless on few router related things used in my project, but this is undoubtedly a good tutorial)

[@bassam.2023]

There are so many tutorials that I've started and never finished. However, I always complete Vishwas' tutorials. He stays on point!
Tutorial Grand Master right here!
Thank you!!!!😁

[@dhruv.pandey93]

The most informative series on React Router Dom and that too latest version v6. Covers minor but important details like useLocation, and useSearchParams. Great playlist as expected!!

[@rishabhsharma6084]

what a coincidence.. I was implementing protected routing in my new project🤘🤘😁

[@nargeshaeri7028]

Thank you so much for explaining everything so clearly and in details. I really do not know how to express my gratitude. I have watched a lot of your tutorials and I found them really helpful. I wish you the best.

[@bijaysahoo9619]

Couldn't ask for a better tutorial. You are a GEM. Each aspect is crisp and clear. Even a paid course is no match for this. Thank you very much. Looking forward to each of the tutorial series.

[@googlemani]

Thanks Viswas. Another great series in React Ecosystem. Exercises are small enough to focus more on the Router aspects. Well explained. Great Work 👏

[@BruceWayne-kw6xm]

This Channel is a Gold Mine.. i have learnt node , next js , react from it and every course was awesome

[@wisdomelue]

this video is so awesome, loved the fact that you used the context API, thank you.

[@thucle4122]

Thank you Sir Vishwas, i coded along with you and found it really easy to grasp the basic concepts of React Router V6 whose documentation is not quite understandable. Wish you health and prosperity.

[@lakshaysingh1866]

Watched the complete course in one day...thanx buddy!☺

[@deiwman4604]

You made this whole section so simple to understand and to follow. I bought a course on udemy and the teaching way of the teacher it's not even close to yours. Thank you a lot!

[@alokranjan476]

Thanks a lot for whole series.
You explained it really well in easy to understand language with appropriate example.
Request to post such series in future.

[@squeezy99]

What a super series of videos - helped me enormously with a routing problem I had. Thanks for posting.

[@learnkidsonline9732]

Best teacher! Simple examples! Best Tutorials!

[@vickymanora985]

i highly recommend to watch this

[@mehdihosseinpour3351]

Great. It is the best video I've ever seen for protected route. I think you can improve it with adding multi role authorization as well as JWT authentication to it.

[@isaacjon]

didnt understand a lot, but anyways so far i learned so much with your help, just commented this because i wanted you not to stop anytime from this kind of tutorials, but i would like to see tutorial about tutorial hell from you

[@eniolabakare5100]

Amazing tutorial series, as always. Thank you, Vishwas

[@kaempy]

Wow thanks so much Vishwas your content are always easy to understand and rich 🙏

[@revo572]

Thank you for giving such a quality content for free

[@wilwazka2957]

Powerful and yet so easy to understand. Thank you a lot.

[@akashvenu359]

Thank you for explaining so elaborately.. this will definitely help me with my interviews

[@incognito_2512]

thank you so much. your turorials are most easy to understand

[@alexuqt]

Wow I just finished watching the 15 videos and is this really is so good

[@es7729]

It was an awesome playlist! Thank you!

[@mrnabby4178]

Finally a proper and right video. Thank you sir.

[@frontend_ko]

The best teacher, thank you!

[@benarcher372]

Thank you so much for these valuable videos!

[@musiclovers8488]

hey Vishawas.. Thanks for these videos. Really appreciable work... you are best.

[@dyg6945]

Thanks for these videos! That were simple and perfect!

[@ashutoshranjan4644]

It was 🤯. I explored different dimensions of react router dom.
React is really powerful!!!

[@ravikantchauhan2106]

Really helpful tutorial. bole to ek dam Jhakkas 😎

[@lvhz]

Excellent series. Thank you!

[@Raul-si7bn]

this series is just a (huge) hidden gem. No others series I've seen are this through, and with very good examples. That about React Router V6, but also, the style in general , the easy approach...i've seen many tutorials, since I am always looking for good and updated examples, and I can safely say, this is one of the best I've come across ..
Keep up the good work!
Implement Context , explain Redux (with toolkit maybe), firebase, firestore ...then MERN ..waiting for all of those! :D

[@rachidb9624]

Thank you very much for this tutorial, was very helpful !

[@javeedakhter324]

Hi Vishwas,you videos are awesome you are doing a great job we also want your tutorials on webpack,gulp and other similar tools which help to avoid repetitive task in development and production. Thank you .

[@hemonterroddur6948]

Thank you so much for this wonderful tutorial. It helps me a lot.

[@kwwong1834]

Thanks Viswas, really great content!

[@rajasankar1390]

Amazing Tutorials. All the videos are Gem. Thank You

[@eleah2665]

You have not disappointed me!

[@macdonaldmanana1358]

Amazing work, thanks!

[@alik64]

Thank for this playlist! 🙌 very helpfull !

[@dandantin]

Thank you for this video! Congratulations my friend!

[@reginaldamedee7433]

Thank you for this lesson! liked & subscribed!

[@danielnicholas1747]

thank you very much for this series

[@shaantalk]

Great work Vishwas

[@vino7tech]

Thank you very much sir for wonder React Router Tutorial. The best Complete React js Tutorial TH-cam channel

[@ProgramingWithSaman]

thank you dear vishwas ...you are an awesome dude

[@muhammadzeeshan07]

A very important and well explained video Thanks bro

[@dhokiarinidh9809]

Thank you so much, very informative videos

[@vigneshwarvenugopal922]

Thank you so much for your effort sir....i really gained more knowledge on and about ReactJs and now i can fearless develop the
project on it....Once again ....Thank you So Much....

[@jaybeatz8084]

bro, thanks! you explained it clear

[@user-tf1sy2lc9t]

proper and right way to understood

[@youssef-attai]

Thank you so much, that was really helpful.

[@rayusaki88]

Thank you very much! Very helpful!

[@FrankieMendoza]

Thank you for this tutorial.

[@fpsstupor]

thanks for this series

[@_roob]

thanks for the tutorial, you are amazing!

[@jacobwwarner]

I was able to get something that worked using this technique with a Redux store. Thanks

[@amiiko232]

i love you bro you saved my life

[@bindassingh9281]

Bahut shandar, gajab.

[@Noone-lh5rv]

finally, someone teach me about React properly

[@saurabrakshit405]

Yes you have not disappointed any one ! Very well structured tutorial for React Router Library.
But I want to mention I would be pleased if you have taught the Authenticated Routing with Username & Password Authentication.

[@paritosh3702]

It's very similar to this, a bit complex though but the flow is same

[@VivekThakur-sf9pr]

For demo purpose we can set the user and password and during login we can check with if condition that whether its correct or not, if its correct match than proceed to navigate where u can.

[@gopalakrishnanshanmugam7236]

Great Sir Thank you. Very helpfull tutorial

[@datkumar1024]

Thanks a ton brother!!💯💯💯

[@arunkb6452]

Ohh Buddy... Timing completed previous videos just now... ❤❤❤❤❤

[@nageshgandikota2948]

Explanation was clear and helpfull

[@jasono873]

Big big Thank you 🙏

[@S4sent]

Guru ji 🙏🙏🙏 awesome content 😍😍

[@MrNoeLeiva]

amazing tutorial man

[@christianlombardo14]

Thank you for there great videos.

[@kashifumar4552]

Till now the best one. Plz maintain this

[@benyamin4634]

thanks for the course dear

[@camilleivantoloum-doumde1867]

just amazing thanks a lot

[@Raul-si7bn]

Thanks!

[@rajadastidar3765]

bro you are a very good developer

[@krishnareddyyerram4615]

Thanks Viswas!

[@iamkashyapkumar]

Thanks man!

[@mehdi_salimi]

that was amazing .thanks

[@aabramek]

well done, thanks

[@user-sc6dy3kj9w]

excellent tutorial.

[@labaikyahussain5786]

thanks buddy. nice way

[@winterwowl]

thank you

[@Mohamed_Yousef2024]

Thanks alot

[@nishantnimish7825]

Thank you

[@pankajsuryavanshi8332]

Let say we have params route like /product/:id how to protect this if product id is not present it will return empty structure.we have to throw error in this case

[@Canballeros]

Many thanks for the great tutorial!
Strangely, there is always a logout when I navigate between the pages. Does anyone know what this is?

[@arjun.k.s1829]

Thanks ❤

[@rakesh6311]

Thank you!!

[@chaddwick25]

What is someone navigates to the login page via url in the address-bar ? Does replace in the navigation fix that usecase ?

[@deniserodriguez3233]

So from my understanding, navigate() should only be called inside a trigger action or inside a useEffect. Otherwise you get an error on the console telling you that you need to call navigate() inside React.useEffect().
However, I didn’t get this error when I used .
So I guess that is the only difference between using navigate(‘/login’); over .

[@TheDEMMX]

Thank you
Is there a repo with this code at the end of the course?
The one on gihub only the first lesson

[@jimmy4262]

When I try to browse the Login page I get this error: "Error: useNavigate() may be used only in the context of a component."

[@shivangidimri4639]

Why are you using navigate() in one place and component in the other ? What is the difference?

[@matteonanni9347]

awesome video !! quick qestion if i want to check the login and password to a backend api and get a response would i do it in auth.js ?

[@HassanCodeLife]

nice video appreciate buddy

[@sdm634]

Is there a way to prevent the login page from rendering after the user login? If type the path to login in browser the page appears

[@ashwini4683]

thankyou bhai