Protected Routes in React | Router Redirect | React Router Dom | React Tutorial for Beginners

In this video we are going learn about protected routes in React Js. We will see how we can use React Router Dom package and create protected routes to restrict the user to see certain components in our website if they are not authenticated.

We will create fake authentication using custom React Hook and pass it to Protected route based on authentication we will restrict user to access component and redirect to Home component.

***Github link for Reference***

⭐️ Support my channel⭐️

***React Roadmap for Developers in 2021***

***Checkout these video to understand better***

***More videos***

***Checkout my crash courses for get started with web development***

🔗 Social Medias 🔗

⭐️ Tags ⭐️
- React Protected Routes
- React Router DOM

⭐️ Hashtags ⭐️
#React #ReactRouter #ProtectedRoutes #Beginners#Tutorials

Disclaimer:
It doesn't feel good to have a disclaimer in every video but this is how the world is right now.
All videos are for educational purpose and use them wisely. Any video may have a slight mistake, please take decisions based on your research. This video is not forcing anything on you.

[awuk]

This is one of the most clear and concise tutorials on how to do protected routes within React, thank you Dipesh!

[Taha]

So many videos are there, but this one gave the clear idea about how to make this work. Great job man, Thank you for this and keep making such videos.

[blacksheep]

Thanks for the content Dipesh Greetings from Brazil!

[chitrangadapradhan]

I watched a lot of videos on this concept and this one is the best. Good job there!

[mathis-meth]

this guy talks really on point concepts i like your approach. keep up the good work

[hiteshsuthar]

Hope this React playlist would be best series covering from beginner to advanced topics as Akshay Saini's namaste javascript series.

[IshanKesharwani]

I just need a rewatch but I actually understood most of it. Thanks for this.

[kevinrayparas]

is this still worth to use for routing on react latest version?

[ShanakaMadhushan-cwrh]

Thank you brother ... your explanation is very clear... ❤️🍻

[MrBeastFan_Gyak]

hey, if I already logged in why I need to see unprotected pages, I mean for example I logged in and I do not want to see login page again when I go /login

[Serjc]

Thumbs up! keep up with the great job)

[adeshgangwar]

Every video is same related to protected route.
Bro can you please show us the real time Authentication and how to handle routes with token.
It would be very helpful
Thanks :)

[vhsphshbs]

Great content. Do make one video daily

[facemeifucanyt]

Great content bro..please do video on nested routes also... It will be help full when app has more nested routes and facing many problem on persisting active link for nested routes.

[thehkmalhotra]

What a tutorial Divesh. Thanks a lot for this❤️ . I am having one issue I think new version React Route doesn’t have Redirect in their modules/package… What to do?

[thevloglife]

Hi Nice project, But how can hide - components with header and footer in 404 page only? please suggest and help

[SLTYT]

Bro please make videos on REDUX-PERSIST. how to persist redux store. how to setup persist .also make videos on usefull react libraries

[JaLegendsDance]

hey can you make a react js tutorial of an video player that changes the video source of an video.
A button activates this function.

whitch interchange the video every time I click the button, when i click the button, can the video load at
the same time the previous video was playing?

There are 2 videos of the same length.

[coolgirlsharu]

Hi Dipesh, i have 26 pages / 26 routes, what is the solution how can i protect routes without user authenticate?

[sandipbamaniya]

I'm using react-router-dom 6 switch is not working router.ts:5 Uncaught Error: A <Route> is only ever to be used as the child of <Routes> element, never rendered directly. Please wrap your <Route> in a <Routes>
please replay