React Router Complete Guide (Route, Link, NavLink, Redirect, Prompt )

Full guild to routing in react js using React-router-dom library. Redirect to different route, Use links to route to specific page and use prompt to stop from exiting a route.
Article and code samples from this tutorial
* github.com/tec...
Please be my patreons on patreaon
* / techsith
Follow me for technology updates
* / techsith
* / techsith1
Help me translate this video.
* www.youtube.com...
Note: use translate.goog... to translate this video to your language. Let me know once you do that so i can give you credit. Thank you in advance.

[@jasper_pa]

I bought a React course on Udemy. Im halfway trough this course and have no idea what Im doing. With this Video I learnt much more in much less time about how React works! Thank you!

[@Techsithtube]

I am glad it helped. Thanks for watching!

[@chenwen-hao5023]

Is it one of the complete guide courses on Udemy? I am also doing it.

[@misbahmushtaq5881]

​@@Techsithtube Hey Sir, can you please mention the extensions you are using within the tool, as it made it much easier to code. I tried React food truck and I am unable to use predefined functions or libraries in my vsCode.

[@randomindianfandom1667]

@@Techsithtube Same here it was very helpful for covering the topics in detail

[@surajbhatt8386]

I have been learning react for like 2 months down and wasn't able to figure out how to redirect and use prompt. I have checked all the official documentation and finally this video made my day. Thanks man.

[@Techsithtube]

Suraj, I am glad that you got it. :)

[@handsome_man69]

you deserve a nobel prize in tutorialism

[@MrMrimmer]

Great tutorial! You covered the basics very well! Many thanks!

[@MuhammadAbdullahMirza]

Very right

[@BharCode09]

"Tutorialism"? Well you deserve nothing lesser for inventing a word like that :) Good one!

[@Podcast_Browntown]

I spent 3 days on this one issue. When I route different pages they just all Show up together. Using the “exact” method fixed these problems. Not a single other tutorial expresses this issue. Thank you so much !

[@rounakjain5774]

You made a very important point in the beginning. People tend to teach these concepts within a large project which makes it really hard to understand. Thanks for the video.

[@hussam68]

Man, I need to thank you for your great explanation of the react-router-dom. I've watched several videos, but yours made me stop half way through to like this video, and leave this comment. Thank you sir. Please keep doing tutorial videos about react, you're very good at that.

[@Techsithtube]

Thanks for a nice comment!

[@malvikatiwari3857]

You make the learning so simple .....I have seen that video on other sites but it's so confusing. Thanks for doing this

[@Techsithtube]

Glad you think so! :)

[@roshnikutty4252]

Thank you so much for this tutorial, I was looking forward to this!! Great examples, covering so many scenarios!! I have saved this to my favorite React tutorial list on youtube. I truly appreciate you providing these tutorials

[@vimsen2221]

I have been following all 11 tutorials so far in this course. They are excellent and extremely well presented. Thanks

[@Techsithtube]

Thanks for watching Vim.

[@mikec3412]

I love your videos man, I'm building fullstack applications now and your tutorials are the best.

[@chinnamanigandan3378]

I have used older React router in React 15.3 version couple of years ago in my project. Also I had seen some of the tutorials with react-router-dom but did not understand the core concepts of it. When I gone through this video I could get what you were trying to explain. Techsith, you are doing an awesome job. Especially your ES6 tutors were phenom..Thanks a lot..

[@laquocanh]

this guy's so good, he speaks clear English!

[@RonWarnerBubbleKing]

Well, not really. He keeps saying stuff like "we going to" instead of "we're going to," "vweedeo" instead of "video" and other things that are grating on the ears of native speakers.

[@gordonmceachin2093]

Thank you for a clear explanation the react router, I am a student and this will definitely help me incorporate the router into my final class project.

[@shawnlee5956]

Simple, clear and direct to the point. I think every video should be like this, less advertise, and more on content. Thanks you for the effort.

[@bharathkumarkande5530]

Very good attempt to get users started off with react-router-dom. Personally, it helped me very much for an interview. Thank you.

[@Techsithtube]

I am glad that helped you. Good luck with the interviews ! :)

[@maxiequa567]

Thank you so much for doing this as a project focused on the topic in question and not part of a giant project with useless info, great teacher!

[@Techsithtube]

I am gald that it helped. I struggled when i was learning react routers so I created using my knowledge to so others dont have to struggle.

[@haikazahid4665]

Totally appreciate the way you explain each topic with new app Thank you for sharing knowledge in such an amazing way !!

[@Techsithtube]

Thanks a ton

[@olgasinenkova3300]

"A lot of people build lrge projects and explain it that way" - 100%, thank you for having your approach, it's the best!

[@V36198]

While Reading about React in Medium blog was difficult to understand initially.After going through your videos,now I am reading those articles ,every blog about react seems interesting.Thank you.

[@simonkalu]

This is very useful and can be applied to a real world case. Thanks

[@Techsithtube]

Thanks Simon for watching!

[@billybobgeo]

Hi Techsith -- This is my favorite in the series -- nice blend of your signature instruction and lots of step-by-step code to introduce the facets of React Router: Link, NavLink, Redirect and All.. rock on!

[@nguyenhaidung8833]

After a long search about react router, i am so glad that i found you

[@Techsithtube]

:) THanks for watching!

[@anyika1000]

Pure and Precise. Keep it up sir. Super easy to understand. Been doing react for two days now, this video made me understand routing in react way better than never before

[@nageswarkv]

I did liked the video. I have paid subscription to Pluralsight but could not understand there and i have to fallback to ur video for understanding router. Great Job

[@billwindsor4224]

@techsith - this is an excellent tutorial on React Router, including application code and usage examples for Link, Navlink, Redirect, and Prompt - as you mention. *Thank you!*

[@Techsithtube]

I am glad that you learnt something for this video. Thanks for watching! :)

[@davidtoska7791]

Easy to understand. Straight to the point. Like it!

[@mostafashawki]

Perfect, the good thing on your series that you build a different project every tutorial.

[@AterKenshi]

Thanks to you I found my mistake, I've did the router worked when I was starting to learn react but I didn't understand well the routes in the app (Also I have them in another component). After 5 minutes I knew what was wrong. Thank you so much, Now it's clear to me

[@Techsithtube]

I am glad that it worked out. :)

[@rohitkudalkar92]

I can find the best solution for javascript from your tutorials. You are the best. thanks and regards.

[@Techsithtube]

Thanks for the comment Rohit. Keep on learning!

[@jeromeeusebius]

Thanks for taking the time to make this tutorial. It was helpful especially, introducing the different ideas and concepts sequentially and also explaining why you are introducing them.

[@Techsithtube]

Thanks for watching!

[@ai-bruise]

If you want some more advanced examples with react-router just see README github.com/Sin9k/react-router-dom-tricks

[@TechRedux]

Sir You Are Amazing..I Was Trying To Find A Solution Related To Conditional Routing For 3 Hours And You Solved My Problem

[@Techsithtube]

I am glad that you were able to solve this. Thanks for watching.

[@prabhukadode723]

Thank you for this beautiful tutorial. All doubts i have about routing in reactjs have been cleared .. Thanks again sir.

[@Techsithtube]

Glad you got it prabhu. Keep on learning

[@itrauco]

This was great, thank you for leaving all of the typical project/app “fluff” out and getting straight to the point!

[@ramyfarid2296]

Please don't stop tutoring! you are great

[@SauravR402]

Simple and straight presentation of ideas. Really liked. Thanks.

[@subhanvempalli6088]

Thanks for this tutorial, very easy to understand for beginners

[@Techsithtube]

Thanks for watching!

[@priyamit_singh]

best tutorial i found on KZbin for this topic great work thank you so much

[@Techsithtube]

Glad it was helpful!

[@brilliantphal6646]

I have been looking for tutorials like yours for a long time. I can say you are very straight to the point. :) I really appreciate this.

[@gabrielfono844]

sir you are such an amazing teacher and I really like the way that you explain concept. even by seeing the way that you explain concept, I guess you are a disciplined and honest person thanks so much

[@riddhin5189]

nice explanation, step by step guide..simple and classy !! helpful ! Thank you

[@tommyleong8328]

Once again great content, helping me to understand how react-router works. Though am I puzzled with all the functionalities I could use (match, location, history, etc..) but I get the basic idea on the navigation and param passing! Thanks man!

[@wizardreza]

thank you, i think this is very simple explaination, honestly, i m very dificult to understand how JS routing page, because im from PHP programmer, but now, i know how it work, thank you very much

[@lokeshkatikireddi1924]

Very Impressive. Hats off. Best way of teaching things.

[@mhmdnayef710]

You are the only one , who did this topic , in this awesome explanation on youtube........you are awesome

[@vickyvirat5166]

you explained it pretty well and very easy to understandable manner

[@arpithap7900]

Explanation and examples are very clear to understand, Thanks

[@harveyboity4146]

Nice video. Router concept explanation is damn good. Thanks a lot!

[@Deepakpundir-spark]

I wish I could pay you but I'm broke and trying to find a job. Really thank you brother.

[@ramsreddy9563]

Single word just awesome explanation

[@rajaramsavant4384]

Really helpful, major parts of the react are explained in a proper way so that it can be understood easily 👌👌

[@Techsithtube]

Thanks for watching Raju.

[@generalzeedot]

phenomenal teacher! Keep up the good work Sith

[@deveshkachhaway5715]

Very good details on Router. Thanks🙂

[@raekwonthachef]

I'm brand new to routing, thanks for the great video!

[@TanujPanchal16]

Very simple and helpful tutorial. You have explained everything so easily. Looking forward for more interesting tutorials. Keep it up.

[@btr333]

Very good. Simple and intuitive.

[@vikaschouhan8372]

Simple and fast way to learn and understand React routing

[@dp7939]

You can select word and hit ctrl + D, that will select all other possible word match and can change in one go and then hit esc to release multiple selection.

[@TheAditya64]

While teaching, Please go slow as we miss out things. And please don't zoom into it. But your tutorials are great, learnt a lot. Thanks!

[@markchristopherdauz7750]

Thank you so much!, simple explanation but straight to the point!, ☺

[@pooranik5342]

it was an awesome and clear explanation..kindly do more react with spring boot videos

[@dinseid202]

This is really amazing. Thank you for your nice explanation!!

[@MuhammadAbdullahMirza]

I loved your video its very simple,easy to understand for beginners & it helped me a lot.

[@kps2642]

been a fan of you since I first saw your video on prototypes a month back, I love react and react -native , thank you for this awesome video sir, however may I suggest you a video ? I would like to see react native navigation covered by you , it's kinda tricky, thanks again sir :)

[@Techsithtube]

Sure, I am planning a React Native Series so I will be able to do it soon.

[@autumnleaves9917]

Thank you sooo much! This is the best I've found!

[@nipambarman9785]

NICE!! Very much helpful..short n to the point video...please make this kinda videos...Will go through your all React videos....Thank you so much

[@naeemjamali1475]

Awesome tutorial and to point things. A big Thankx for that, I appreciate your teaching skills and honesty of telling about everything deeply. Thank you.

[@Techsithtube]

Thank you for watching! :)

[@er16deepak]

Thank you for such a wonderful video...You made React router very easy to understand.

[@Techsithtube]

Thanks for watching Deepak!

[@prabu106]

Great.. It is very useful to learn react router concepts. ThankYou.

[@Techsithtube]

Thank for watching Prabhu !

[@Geek-jx3gw]

MAAAAAAAAAAAAAAAAN I LOVE YOUU!!!!!!!!!!!!!!!!!!!!!!! YOU SAVED MEEEEE I HAVE A PROJECT AND I DO NOT KNOW 1% IN REACT YOU MADE IT EASYYYYY NOOOOW THANKS A LOOOOOOOOOOOOOTTTTTTTTTTTTTTTTTTTTTT

[@Techsithtube]

I am glad that it helped. Keep on learning! Thanks for watching!

[@jeffersonbiongcog1648]

nice comment! (kidding) very informative. did a good job on the delivery. Im new in react-router and i like the contents on this video.

[@olegfrolovdesign]

Thanks a lot for this tutorial! Well explained. Easy to understand.

[@charles87b]

This is the video that I’ve been looking for... thank you!

[@naveenkumar-vb8tp]

your tutorials are always awesome. great tutorial on react router

[@Techsithtube]

Thanks for watching Naveen!

[@shawnmurray2235]

Thanks for the video! The Link part has confused me for weeks.

[@BigMoneySniper]

Bro remember me with the awesome comment 7 months ago. Here I am always watching your videos man. Your so damn amusing g. Keep them nice and slim all day. Good GREAT Stuff man. Great stuff.

[@Techsithtube]

Thanks for watching Seena, I see you have been learning for past 7 months. Keep learning!

[@Fcmam5]

Thank you very much sir for this "react-router for humans" video. Straight to the point !

[@leokileo]

i have been loking somthig like Redirect fuctions thanks

[@Techsithtube]

I am glad it worked for you.

[@ManishSingh-lk4qs]

Amazing explanation. Thanks a lot Sir.

[@varunsharma5045]

Another superb video...nicely explained...

[@artem.matseruk]

Thanks for tutorial. It was useful for me :)

[@badytouray294]

Really enjoyed watching this tutorial, I have subscribed and hit the notification bell :-) Looking forward to seeing more videos.

[@Techsithtube]

Thanks for subbing! Keep on learning!

[@Jessica-wo3lr]

All of your videos are life savers!! Thanks! :)

[@Techsithtube]

I am glad the videos are helping you ! Thanks for watching Jessica! :)

[@michaeleidland9961]

For me "import { Route } from 'react-router-dom/Route'" did not work. Got error. But "import { Route } from 'react-router-dom'" worked fine! Anyway, thanks for AWESOME tutorials!

[@poladalqayev631]

Thank u for great explaining !

[@jasonhoffman4990]

Thank you for a great and comprehensive video!

[@sivamurugans3228]

It's very clear to understanding and helpful..!!

[@Techsithtube]

Glad you think so!

[@RockstahRolln]

Such a Brliiant video on Routing, you made is extremely easy to understand! Thank You!!

[@ai-bruise]

if you want some advanced examples just see README: github.com/Sin9k/react-router-dom-tricks

[@rohanshastri944]

Explained the basics very wel. Also if you could do a tutorial on creating simple form with React will be helpful.

[@hargunsingh1893]

you really taught in a simple way

[@jeyaletchmiarumugam2918]

very simple and easy to understand

[@ApodyktycznyCzlek]

I'm not sure if you have to bind context of this in 17:27, you're using arrow function, which inherits the context of the place it has been invoked. Nevertheless, your tuts are great and valuable and I really appreciate your approach!

[@satejall]

simple understating of react router very helpful for all

[@rakeshmanathana]

Helpful. Thanks!

[@olorinorphique]

Loving React more and more.

[@Techsithtube]

React is a fun framework. :)

[@Miggleness]

Good coverage for the time allotted

[@themynamesb]

Great work !! Very nicely explained !!

[@algomonster5897]

Thank you So much for this video. It is in depth and very good explanation. Thanks again.

[@garrettbaker2320]

Great stuff!

[@Ones_Complement]

14:53 Really flubbed the explanation here. 17:31 Bind unnecessary as your loginHandle was defined as an arrow function (lexical this). Overall though, pretty informative and easy to follow tutorial. A thumbs up from me.

[@madeupstory]

yeah bind was unnecessary

[@tenet-rotas]

This is an excellent video! Thanks for explaining this.