React Router V6 Tutorial - Routes, Redirecting, UseNavigate, UseParams...

Hey everyone, in this video I teach you all the new version of React Router Dom. I have an old video teaching this topic, but with the update a lot has changed.
🌟 Get 20% Off Brilliant: brilliant.sjv....
Code: github.com/mac...
🚀 Learn ReactJS By Building 6 Projects: codedamn.com/l...
► Buy Crypto on Coinbase: coinbase-consumer.sjv.io/PedroTech
💻 Join our Discord: / discord
Social
▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
Website: machadopedro.com
Linkedin: / machadop1407
Instagram: / _pedro.machado_
Github: github.com/mac...
Email: [e-mail]
Tags:
- ReactJS Tutorial
- ReactJS and MySQL
- NodeJS Tutorial
- API Tutorial
#reactjs #reactrouter

[@realdoomerhours]

This is a way better tutorial than the actual React documentation, great job.

[@ultimatesheep]

documentation is just like manual Nobody reads it

[@caracalmanhique9260]

@@ultimatesheep kkkk

[@wyvrendragon4175]

Aggree😂

[@Joao-oo8yj]

@@caracalmanhique9260 br?

[@alowe5013]

You have no idea how much of a difference this video made to my life today. Thank you so much - such a clear, easy to follow video. So grateful!

[@brilliantatosam]

This is a timely intervention. God bless you, Pedro!

[@PedroTechnologies]

Hahaha i was waiting for so long for the React Router update to make this video

[@raphaeljaggerd3585]

Thanks bruv it took me forever to realise my errors were caused by v6

[@PedroTechnologies]

Hahaha im glad I helped!

[@petritmekuli]

Short and really helpful. Anyway when you said you can use any of and that's true, but I think it's important to mention that and are different. Because the component makes possible SPA(single page application) and is the old way of doing request. And that's kinda big deal.

[@izatydita]

This tutorial is exactly what I'm looking for. And your explanation is very clear. It's a helpful tutorial. Thanks, Pedro!

[@jvandco30]

Very very thank you brother. I spent 4 hours for routing using switch and later I came to know that switch does not work in higher versions. Your video is very very useful. Please continue your contribution to the world in a positive way.

[@PedroTechnologies]

Glad it helped

[@benihahitti3513]

Great Job, extremely clear and concise. It's always good to stay on top of the latest updates and changes.

[@PedroTechnologies]

Glad it was helpful!

[@ManpahulSingh]

I was following a react tutorial series where the instructor used router v4, and I installed router v6 thinking it should be better and since the history, location and match props do not exist on router v6, I spent hours figuring out why I don't have these props anymore and why is my console all red. Finally I landed to this video. Thanks a lot man, you earned a sub :)

[@realdoomerhours]

I'm currently going through the exact same thing. Glad I found this video because I was about ready to throw my laptop out the window.

[@artemmarketer5745]

@@realdoomerhours Nice for you cuz I'm already using a new laptop for the same reason.

[@realdoomerhours]

@@artemmarketer5745 You have my sympathies.

[@cristinalopez8667]

Thank God I found your video. I'm a recent bootcamp graduate and was going nuts trying to figure out why my React apps had had stopped working!

[@asfnobambu]

My son is also Pedro. I just started to learn React. Thank you !!

[@PedroTechnologies]

That's awesome! Are you brazilian?

[@asfnobambu]

@@PedroTechnologies Yep.

[@Tux256ND]

Dude! This is just the explanation I needed. Most videos we see are for people coming from v5 to v6, but you got me covered, even me not knowing much, even from v5! Thanks a lot, mano!

[@AlvinSohebBaig]

Thanks buddy , I was stuck at some point and needed just one sentence which you narrated in this video : 👏👏

[@seagypsy2591]

Thank you!! I had been searching for days on how to use the useNavigate bit. I am new to react and most other tutorials just rush through telling you what to type but don't explain why you type it. I learned more from the first half of your tutorial than i have from all other tutorials combined.

[@SkyrimBeast]

Like this video? No. LOVE this video? YES!! Many thanks Pedro 🙂

[@joydeepr007]

I just saw this video in 2x speed and still understood everything. You're awesome 🎉

[@RV-kl2wl]

Perdro I cannot thank you enough. Whatever I need, i find on your channel in a very concise and easy to understand video. Keep up the good work. 100k soon 🙏

[@anuragkasudhan3734]

te way you explain things, it is so simple and yet so effective. IT IS INDEED ONE OF THE BEST REACTJS TUTORIALS ON KZbin. Kudos and more power to you. may god bless you. thanks, love from India.

[@PedroTechnologies]

Appreciate that!!

[@farihanashih2131]

Thank you very much sir. I am a beginner in React and very confuse when i learn the old method. i don't know there is change on react-router-dom syntax in v6. GREAT EXPLANATION

[@sslab33]

By far the best tutorial for react router v6 Every thing needed to start react router in just 20min

[@hirealgore]

AMEN! Spent all day on this because I was working with DOM5 commands. THAKN YOU !

[@gonzalooviedo5435]

Very clear explanations, thank you, Ive already seen 2 complete videos from you, this one and the another one explained react hooks!. Thanks from Chile!!!

[@erhanaslan3572]

your youtube channel teaches more than any university or any course

[@micahwendorf8808]

You make it so easy to follow along and grasp the concepts. Thanks so much for taking the time to do this!

[@huskypsycho7833]

AMAZING video dude... ive seen some of your past ones and they were really helpful but i still had so many issues and i had to find replacement methods to do all the things you said in @6.. this video was straight to the point, great explanation. Thanks again and JUST when i needed it too....

[@PedroTechnologies]

Hahaha thank you! Glad you liked it!

[@thatonichan]

bro you're a lifesaver fr fr

[@SUPREM00]

Finally someone who knows how to teach

[@user-wl1jp1wd2p]

Thank you so much... This is the simplest explanation i have seen for react router dom

[@AlexisScuderi]

Thanks bro, useParam will be very usefull in my actual project. I started watching this video just to see if i learn something new about react route because im very new at it, and i did

[@VskiDevs]

@PedroTech you just asked the very question that made me come to this video at 18:45 and answered it. thanks man. big help, you got no idea🔥💯

[@asyourlipslounge]

Running through a MERN.tutorial that was a few years old. Thanks for running through the syntax update for React.js^6

[@sunbrogilgamesh]

saved my head from going mad, dude! many thanks to you, i just couldn't figure out how to use routes with my component, finally it works!

[@angelzacarias8886]

I'd like to believe you're from LATAM as your name is Pedro... It kind makes me feel proud of how good videos you have, recently I found your channel and you have a permanent subscriber 👍 great job!

[@PedroTechnologies]

Hahaha I am from Brazil :) Happy to hear you like the videos!

[@westernpigeon]

thank you so much for this video dude, i tried looking for videos explaining this and every video is so outdated and yours is great AND up to date! lifesaver!

[@zenova9926]

i'm crying just because how well is your explanation, earned a sub!!! ✨

[@nickurchin9579]

Appreciate this very much; it was precisely what I was looking for. I initially watched Web Dev Simplified's 46 minute video on React Router and ended up feeling slightly overwhelmed as all I wanted to know is how to load a new page >.< lol. This video was a relief and helped narrow the scope a bit, so my feeble mind could better absorb the info. For the record I'm not knocking Web Dev Simplified's video at all; it's superb and covers considerably more than what we learn here, but was more than I was looking to chew on at the moment. This is a great intro/beginner friendly video and then for anyone looking to go a little more in-depth/intermediate, go check out Web Dev Simplified's video. I've really enjoyed the few videos of yours I've watched so far, so consider me subscribed. Keep up the great work, man.

[@amirmahdimohamadian6732]

I never comment on videos, but DUDE... you are a life saver! Thanks for everything!

[@caffeinated-pixels]

Cool, this helped me migrate an app from v5 to v6. Thanks!

[@PedroTechnologies]

Glad it helped!

[@alawy5551]

8:40 Yesss thanks!! I watch tutorial about building React website and I struggle with this step he used this : path='/' exact component={Home} Technology changes fast :)

This is absolutely gold my friend. Keep going like this. I love you.

[@parvatprajapati8932]

You just showed every important topic related to react-router-dom very well. with changes of older and newer version. Thanks

[@faisalazhar9622]

I was facing problem on useParams. Problem solved thanks to you.

[@juanchibrossa8569]

Thank you so much, Pedro! Cheers from Argentina 🇦🇷

[@viallymboma9874]

Thank you very much. been struggling since afternoon on a specific aspect and from 13:25 to 13:30 demystified my confusion and i was able to solve my error...

[@LazAustin]

You are awesome man. I'm learning React as we speak and the tutorials I was using were basically obsolete and you bridged the gap.

[@kajolghoshkkg5512]

please make a tutorial on nested routing with react-router-dom@6 which will be very helpful as always

[@PedroTechnologies]

Yes! I will make a video about it soon!

[@codexjay674]

Exactly what I'm looking for. Thank you Pedro

[@FliSh123]

You can also wrap the button in a link tag and navigate using that too!

[@user-lm9ve2js2t]

Thanks a lot for your videos ~ I'm still learning web developing, and found your videos so helpful !

[@KingBurger52]

You made this very easy to understand! You have no idea how helpful this is!

[@razor0wn3d]

Very good bro. Thanks a lot! I'm from Brazil. I was searching on youtube a tutorial about routes on ReactJS and i see this amazing video.

[@LIMLIMLIM111]

You saved me so much time learning router! Thank you so much :))

[@plaguegames3556]

Plain and simple, thank you mate

[@zaidaljamaly3905]

You are the best youtuber that teach react thank you for your amazing videos 🌹

[@samnayakawadi]

You did the right move. Seriously there are very less videos on v6. Thanks. Already Subscribed.

[@abhinavagarwal7373]

Best video on the internet on this topic

[@mohammedfareedh]

You are the best Instructor Bro.... Keep Rocking

[@mkwaliyo]

All I can say is thanks man. Really appreciate

[@TheRealAfroRick]

Very clear, but you should also consider that someone may be coming to this content who has never see react-router-dom - EVER. I've been using react long enough to follow what you're doing, but as opposed to covering the changes, if you're doing a tutorial you have to cover it from the noob perspective.

[@Nikoulkina]

Thank you for this concise and extremely useful video!

[@divyanshsao3846]

Man You are a life saver. This video was so full of information Thankyou so Much for this

[@captainbeardedman7645]

Very useful tutorial. Google was of no help for me 2022. But this video just made sense.

[@derickasane8499]

very clear and intuitive. thanks pedro

[@Mark-nm9sm]

Really good video , explained it easily and most other yt videos about this are outdated so good job

[@mustafatechsolutions]

I love you my guy you helped in fixing my issues, you get a subscriber!

[@changgiljeong9820]

Thank you so much Pedro, Your videos are always amazing!

[@faris.abuali]

Thanks Pedro! 🧡

[@mselbekk]

This was great! Watched about 6 other videos which didn't work. Thanks a lot!

[@millsbelamideb.4293]

best 20mins of my life

[@brayandelgado2458]

Thank you brother, i was searching a tutorial like this long time ago and today i got find it... a million of points for you!

[@olenayevtushok2014]

Thank you, Pedro! It's a great explanation!

[@jaylee5252]

This was really helpful and simple to understand. Thank you.

[@mayuribharadva7554]

Thanks a lot for the explanation of new updated concept of Route dom .. It solved my problem.

[@shawnlee5956]

nice video ~ how to router dom work wih 'protected route'? or other words how to block unsigned in user to access the route?

[@002ashishkumar5]

Omg!! greatest explanation ever, cleareed all my doubts , thnx i always watch ur videos cuz its a lot clear and to the point

[@PedroTechnologies]

Thank you!

[@flowerofash4439]

very clear explanation, easy to understand and good articulation with great teaching pace. you deserve more subs

[@tcleedev]

Now whenever I want to figuer out something, I check if Pedro made a video or not first lol

[@gouravchouhan1790]

Your channel === GEM💎

[@oneinchmoon]

Thank you Mr. Pedro nice mechanical keyboard btw

[@PedroTechnologies]

Glad it helped! I am actually going to replace it with a muted keyboard for videos cause I don't want the sound appearing in the video hahaha

[@SquareRoot_]

Thank you for the quick refresher.

[@aniketkarode5527]

Thanks for the amzing video it clear all my doubts in React Router Dom v6

[@thydevdom]

Coffee on me. Your videos are always great!

[@PedroTechnologies]

I appreciate that! Thank you!!

[@arsnakehert]

Thank you for this A short, to the point, up-to-date video; I haven't watched much of your channel, but if the rest of it is like this, I may just have found a treasure trove of learning resources! Again, thank you, parceiro :D

[@MBkingsoft]

First time watching your videos and I'm sooooo impressed sir. You just got one more subscriber! Well done.

[@jaisharma8056]

thank you soo much brother !! this is the best video on all youtube.

[@ibnuhafizh5656]

Thankyou so much, i've deadline tomorrow and i saw this video!

[@PedroTechnologies]

Awesome!

[@sebastianonofrei8180]

Thank you very much Pedro ! This helped me a lot .

[@mohammedalabdulhamid5289]

thank you, simple but very valuable explanations

[@colab_ora]

thanks very good and easy way to explain, useful a lot for me, am learning React rigth now, thanks dude, regards from Chile

[@lakki756]

Thanks Pedro your vedio are help full for using react-router-dom components of v6

[@jennywilliams8063]

Fantastic tutorial! Two questions: 1. What's the VSCode command for getting rid of the parens () in Profile.js at 7:45? 2. In App.js, how does the import for each page automatically get added after you insert each Route path? For example, line 3 gets added at 8:25 for the Home path.Is it an extension?

[@eneadriancatalin]

1. ES7+ React/Redux/React-Native snippets 2. it's an extension called auto import with over 2M installations

[@saranghae3720]

Thanks a lot bro... for this tutorial.. i was struggling with old udemy course in which router v4 was used......

[@jonathabot]

Thank you. You literally saved my live.

[@wisdom6739]

Hello PedroooooO very good work ! You have all my respect, your tutorial is a real tutorial, so I subscribe right away !

[@noelpadavan5674]

This man stays reading my mind, just when I need this. Thank you!

[@josuegarcia4280]

very useful information the only thing I would change is to implement to render a nav component instead of the code, the way its implemented works just fine but will grow if you need to add more code to the nav and it wont look good or feel good for best practices, other than that, perfect Job Pedro!!!!!

[@davidelbaz9188]

You explain extremely good !

[@farhadfallahi8200]

This video helped me! Thanks, Pedro Tech ❤

[@mmd1dev]

You are the best Pedro thanks for every tutorial u made❤💥

[@akashgillella]

Thanks a lot! I am new to react, and all the tutorials use switch and whatnot! I got so mad that my code wasn't working...