Learn React Router v6 In 45 Minutes

FREE React Hooks Course: courses.webdevsimplified.com/...
Nearly every app in React needs to handle routing and by far the most popular library for handling routing is React Router. In this video I will break down everything you need to know about React Router v6 so you can master routing in your next project.
📚 Materials/References:
FREE React Hooks Course: courses.webdevsimplified.com/...
React Router Blog Article: blog.webdevsimplified.com/202...
🌎 Find Me Here:
My Blog: blog.webdevsimplified.com
My Courses: courses.webdevsimplified.com
Patreon: / webdevsimplified
Twitter: / devsimplified
Discord: / discord
GitHub: github.com/WebDevSimplified
CodePen: codepen.io/WebDevSimplified
⏱️ Timestamps:
00:00 - Introduction
00:45 - Basics
06:18 - Router Types
10:22 - Dynamic Routes
13:40 - Route Specificity
16:46 - Nested Routes
28:54 - useRoutes Hooks
30:32 - Link Component
32:50 - NavLink Component
35:57 - Navigate Component
36:39 - useNavigate Hook
39:07 - Search Parameters
43:16 - Navigation State
#ReactRouter #WDS #ReactJS

Пікірлер: 551

  • @Sweetcommando
    @Sweetcommando Жыл бұрын

    This man is a genius. I cannot thank him enough. Every other tutorial, even the official documentation, shoves way too much extra stuff in your face before they go over the basics. I appreciate the structure and clarity going on here.

  • @happybits

    @happybits

    Жыл бұрын

    I agree, he's the best

  • @agentp9900

    @agentp9900

    10 ай бұрын

    Also he has that disney-prince perfect hair 😭

  • @8hoanggiang213

    @8hoanggiang213

    9 ай бұрын

    This is a useful tutorial.

  • @Exypnos
    @Exypnos Жыл бұрын

    This feels like paid content that I didn't pay for. Learned so much more in a half hour video than I have in a 3 month course. Truly amazing!

  • @beefcakees
    @beefcakees Жыл бұрын

    Dope, I will probably have to watch it one more time. Really cool to see how much you have grown compared to your old videos. You are so much more expressive and enjoyable to listen to. Keep up the good work.

  • @natanelelkutski9966
    @natanelelkutski9966 Жыл бұрын

    He is a true professional and a teacher. Honestly I've learned from this tutorial more than in a full length course. Thank you and please keep sharing simplified and perfectly explained content as the above.

  • @haruka3203
    @haruka3203 Жыл бұрын

    I'm evolving from a normal html/css/js web developer into a react developer, and my god I'm just so impressed with npm and react right now. So much stuff to make coding easier! I also love your tutorial on how to get started with routers. I was still using anchors and href this I discovered routers not too long ago :)

  • @DiestroCorleone
    @DiestroCorleone Жыл бұрын

    I think I know my Router v6, but I'll definitely check this video out cuz, knowing Kyle, he probably has some cool tricks up his sleeve.

  • @iJavaScript
    @iJavaScript Жыл бұрын

    I usually don't learn a lot from tutorials, but this one was by far my all time favorite tutorial because I actually learned a tone! Thanks man!

  • @sugaith
    @sugaith Жыл бұрын

    The clear, firm and fast way you teach is impressive. Thanks

  • @igorowczarz534
    @igorowczarz534 Жыл бұрын

    Man you're saving my life right now. I started to learn React Router but when I saw those massive information block I was spooked by it. Thanks for this video!

  • @adityaanuragi6916
    @adityaanuragi6916 Жыл бұрын

    You're definitely the best teacher when it comes to web development imo. Even your react hooks course that I took felt perfect man you're the best

  • @terrythompson2574
    @terrythompson2574 Жыл бұрын

    Thanks Kyle, highly informative and helpful as ever, really helped me with an issue I was having with the nested router functionality.

  • @avneet12284
    @avneet12284 Жыл бұрын

    Great video. 1million subs ! Bro, that's huge ! Years of hard work and dedication paid off. Congrats a ton ! Well deserved !

  • @aryankhullar7101
    @aryankhullar7101 Жыл бұрын

    Man, I love you! So concise and efficient, you're one of the best educators out here.

  • @aim-scom-lt9038
    @aim-scom-lt9038 Жыл бұрын

    Pack 45 minutes, a well done tutorial I think the community should start thinking to give you a title like The WDS Professor.

  • @MaksymNazarets
    @MaksymNazarets Жыл бұрын

    This is brilliant!!! You're an amazing teacher! You're explaining so fast, but so good, I can't believe anyone can be so good at it

  • @PrabhjotSingh-xn1rs
    @PrabhjotSingh-xn1rs Жыл бұрын

    Seriously this video is different from other videos where they just tell how to setup a thing and dont go in details. Thanks bro

  • @miguelangelsepulvedaatenas8446
    @miguelangelsepulvedaatenas8446 Жыл бұрын

    Why the heck are you so good at explaining? i love the way you explain man!! you're the best teacher i've ever had hands down

  • @zakichoudhury
    @zakichoudhury Жыл бұрын

    Thank you so much for explaining this topic so efficiently. For someone who is new to react and had no experience about routing in react world, this was very much helpful. It gave me a pretty solid understanding to begin I think.

  • @emanuelsiu1232
    @emanuelsiu1232 Жыл бұрын

    Love your videos. Quick, concise, clear, and well explained. Thank you!

  • @zikobht4623
    @zikobht4623 Жыл бұрын

    Holly heavens, i have been struggling with react router v6 and i was planning to give it a shot and read the documentation and here you are saving for the day, thank you

  • @ENI232
    @ENI232 Жыл бұрын

    was working on a project, had some obscure questions that google didn’t help with, but this video somehow magically answered literally everything right when i needed it.

  • @martinforget343
    @martinforget343 Жыл бұрын

    Your a pure genius, it seems so much easier when listening to you! Thanks!

  • @cyriljephery2662
    @cyriljephery2662 Жыл бұрын

    Thank you fr, solved my problem in literally 5 minutes. Spent the entire day on different tutorials and even the documentation and you solved my problem in 5 minutes.... Thank you again

  • @neojunwei_8544
    @neojunwei_85446 ай бұрын

    didnt know that Homelander now teaches react

  • @bexstt

    @bexstt

    Ай бұрын

    😂

  • @sakshamsharma4484

    @sakshamsharma4484

    Ай бұрын

    😂😂

  • @thoropyt9955

    @thoropyt9955

    Ай бұрын

    😂😂😂

  • @infernape716

    @infernape716

    9 күн бұрын

    😂😂😂😂

  • @Chupondemagueras

    @Chupondemagueras

    5 күн бұрын

    😂😂😂😂😂

  • @xiaokaotu
    @xiaokaotu Жыл бұрын

    hey web dev simplified, you totally saved my life for creating this masterpiece, very clearly explained for every details, truly appreciate your hard work, please keep it up!

  • @aklilesup5463
    @aklilesup5463 Жыл бұрын

    Yoo, this is so in-depth! Thanks😀

  • @kekoHere0610
    @kekoHere06102 ай бұрын

    Wow, this was very helpful. I appreciate how you did not cover just the basics but all the small and big parts. You are such a great instructor. Thanks for taking out your time and making it for us. I can not thank you enough.

  • @tisferry8205
    @tisferry8205 Жыл бұрын

    Congratulations on your 1 million subscribers! You’ll have another 1 million in no time, I’m absolutely sure. Keep them coming!

  • @yusufdalal279
    @yusufdalal279 Жыл бұрын

    Amazing content and with best possible explanation , Didn't know earlier how many options we can have in just one topics... hats off

  • @GamerX-qn7ou
    @GamerX-qn7ou10 ай бұрын

    Very high quality content from this man, every time I have doubts on certain topics I just look for his tutorial and really helps me to understand, crazy precise and concise explanations (IMO). I guess he isn't joking when he says "my job is to simplify the web for you". Respect good sir!!!

  • @delta4v
    @delta4v Жыл бұрын

    You earn my respect for the extra content routing. I never think about it. Thank you for sharing that

  • @BiofordxD
    @BiofordxD Жыл бұрын

    you literally just saved my life holy shit i've been trying to learn this stuff for like a whole week and you just magically did it THANK YOU

  • @alexcolbourn9142
    @alexcolbourn9142 Жыл бұрын

    Appreciate all your videos! I always look for your breakdown on pretty much any topic that pops up now.

  • @thearcadiusproject
    @thearcadiusproject11 ай бұрын

    The basics really helped me complete the header component for a project of mine!!! Very useful!! Will watch the rest at another point too!!

  • @ramonmaximiliano3557
    @ramonmaximiliano3557 Жыл бұрын

    Thanks, perfect as always, one of the most complete videos on the topic I've seen!

  • @fei5002
    @fei5002 Жыл бұрын

    You really make those content simple and easy to understand, genius!

  • @andrebuitoni9686
    @andrebuitoni96869 ай бұрын

    3 minutes into the video and my page is already working! Awesome! Now I'm going to watch the entire thing!

  • @vaibhavmatere18
    @vaibhavmatere18 Жыл бұрын

    Thank you so much for explaining with practical examples and code walkthrough! I learnt it well!!!

  • @verldopia
    @verldopia Жыл бұрын

    So I had a bug for days, and this man showed it to me 2mins into the video. Love it

  • @arlaxia
    @arlaxia Жыл бұрын

    This was an excellent video! A great summary of React router, helped me a lot.

  • @adexmokson7185
    @adexmokson718511 ай бұрын

    This is a great lecture and well tutored. A little input. The react-router-dom is already pre-installed with create-react-app so we do not need to install it seperately when dealing with React apps. Routing become complex in React because React is a SPA - single page application however react-router-dom simplifies routing system in React application. Great lecture and the way you simplified it is insane. Respect.

  • @KedarBasutkar
    @KedarBasutkar Жыл бұрын

    Awesome video Kyle. It served as a nice refresher!

  • @MayeenulIslam
    @MayeenulIslam Жыл бұрын

    Simply loved it. Concise. Proved. Bull's Eye stuff. Thank you sooooo much

  • @miq_5239
    @miq_52393 ай бұрын

    This was so hard, but I was able to follow it. Thanks man

  • @sviatoslav8776
    @sviatoslav87764 ай бұрын

    Thanks a lot for the course. It is really full and comprehensive.

  • @minzeymichael
    @minzeymichael Жыл бұрын

    This is the first programming tutorial I've watched at 1x. That is a huge compliment in my book.

  • @malkareddyjithender3961
    @malkareddyjithender3961Күн бұрын

    You teached me in a very simple way !!!! Thanks Man

  • @adityanayak01
    @adityanayak01 Жыл бұрын

    Seriously just few days back finished your react navbar route video and now this comes🤩🤩

  • @simonpetrovic502
    @simonpetrovic5027 ай бұрын

    Thank you for all free guides! Very helpful and easy to understand.

  • @simple8810
    @simple8810 Жыл бұрын

    Man you really simplifying web for us, Huge respect and lots of love🤩🤩

  • @htetwaiyan2499
    @htetwaiyan2499 Жыл бұрын

    Thank you Kyle, your videos always help.

  • @megatronskneecap
    @megatronskneecap3 ай бұрын

    Thank you so, so much. This is the guide about this on all of KZread.

  • @vivienpmc
    @vivienpmc Жыл бұрын

    One of the best updated React Router Dom videos! 👍🏼

  • @iep6228
    @iep6228 Жыл бұрын

    Thank you Kyle! Once again saving the day.

  • @davidl.7747
    @davidl.77475 ай бұрын

    Can not thank you enough man ! You've really summarised it efficiently !

  • @gmjitendra
    @gmjitendra8 ай бұрын

    you are awesome. you covered almost everything that I wanted to know. Thank you so much Kyle.

  • @Vedant-M
    @Vedant-M Жыл бұрын

    Kyle man you are god sent, can't thank you enough for uploading such really useful videos.

  • @Anton-hg2wv
    @Anton-hg2wv Жыл бұрын

    You are extremely good teacher, thanks for ur content!

  • @iftakharhussain
    @iftakharhussain Жыл бұрын

    Thank you for these comprehensive videos. I would be very grateful if you upload a full in-depth video on Redux Tookit and RTK Query.

  • @clixgaming2504
    @clixgaming2504 Жыл бұрын

    You have saved my life so many times with your videos! Thanks just for existing

  • @yakligian
    @yakligian Жыл бұрын

    This video came at the perfect time! Thanks so much!

  • @naveedalirehmani4135
    @naveedalirehmani4135 Жыл бұрын

    this video was extremlly helpful thank you very much.

  • @clerus2
    @clerus2 Жыл бұрын

    This content is very useful and easy to understand. You are the best!

  • @johanlewenhaupt1262
    @johanlewenhaupt1262 Жыл бұрын

    You are the best. KZread is lucky to have you!

  • @ajlebeau
    @ajlebeau3 ай бұрын

    Wow! I feel like I watched this on 1.5 speed. Such amazing information in such a short period of time! I'll definitely have to watch this a few times for it all to sink in. Exciting!!!

  • @nabintimilsina8404
    @nabintimilsina8404 Жыл бұрын

    Thanks man it really helps everytime i caught problem with react router you really great man

  • @hadjerjoo6744
    @hadjerjoo6744 Жыл бұрын

    This is the best tutorial I've seen so far, Thank you so much !!

  • @aishastechroom
    @aishastechroom2 ай бұрын

    This is very insightful. Thank you for the tutorial.

  • @hamoodhabibi7026
    @hamoodhabibi70266 ай бұрын

    Great overview now I can go ahead and read the docs with more confidence :)

  • @EddyMunsta
    @EddyMunsta4 ай бұрын

    Nice video, helped me through my routing exercise.

  • @itsahmedbasha
    @itsahmedbasha Жыл бұрын

    Thanks mate 🙏, very clean of explanation, I'm new to react and with your video alone I learned React Router very quickly. Thanks once again 🙂

  • @iafofkhadze4628
    @iafofkhadze4628 Жыл бұрын

    i love your tutorials. it's really clear and easy to understand. btw glad to see u hit 1m subscribers tho

  • @zabinoori49
    @zabinoori492 ай бұрын

    best explanition ever covered every thing i don not know how to thank you

  • @raymondorenda7385
    @raymondorenda7385 Жыл бұрын

    Thanks man. Very informative.

  • @erickaboge9473
    @erickaboge947311 ай бұрын

    This is brilliant you just earned a subscriber

  • @jayasinghekasun
    @jayasinghekasun5 ай бұрын

    Great tutorial !!! learned a lot.

  • @saberstoner
    @saberstoner Жыл бұрын

    thank you so much, the best and most comprehensive router v6 tutorial!

  • @gabhanhome
    @gabhanhome Жыл бұрын

    Fantastic tutorial for someone newish to React and React Router. Much appreciated!

  • @srushteesatardey9478
    @srushteesatardey9478 Жыл бұрын

    Hey man. Thank you so much for these videos. Because of you, I am now proficient in react and I am pretty good at my new job as software developer.

  • @shelbyrothman4522

    @shelbyrothman4522

    Жыл бұрын

    Ditto!

  • @qiwenxiao7260
    @qiwenxiao7260 Жыл бұрын

    OMG This is so helpful. This makes the reference page extremely readable!

  • @maq3009
    @maq3009 Жыл бұрын

    This guy is my hero! For reals, thanks man, your tutorials have saved my butt in this coding bootcamp I'm taking.

  • @system2072
    @system2072 Жыл бұрын

    great one kyle... i was just ignoring react route v5 and implementing v6 for my project... compared to v5, v6 is pretty straight forward...

  • @mohammedelhoussni
    @mohammedelhoussni Жыл бұрын

    thanks kyle for this amazing video it's very helpful

  • @JAcOBRuK
    @JAcOBRuK5 ай бұрын

    amazing tutorial, really well explained, precise and concise

  • @felicia499
    @felicia499 Жыл бұрын

    Thanks for your generous and pedagogical information.

  • @simone-oq4if
    @simone-oq4if8 ай бұрын

    very comprehensive explanation and easy to understand. Thankyou

  • @Arnav404
    @Arnav40417 күн бұрын

    Glad for this valuable content, i also saved it for the future, on my React router dom notes

  • @AbdelSamieShamsi-ze3yt
    @AbdelSamieShamsi-ze3yt Жыл бұрын

    Thank you bro it helped me a lot . I always had problem with this .

  • @ankitdharsandiya8775
    @ankitdharsandiya8775 Жыл бұрын

    really a good one.....explained in details............thank you so much

  • @dalvanbcarvalho
    @dalvanbcarvalho Жыл бұрын

    Amazing explanation!

  • @hezzronaustin7548
    @hezzronaustin7548 Жыл бұрын

    Perfect tutorial ! This is my first ever comment on KZread and I've watched many vids but learned so much so much quickly in this video 👏👏

  • @salpygidis
    @salpygidis Жыл бұрын

    Could you also go over protected pages like account pages once you are logged in?!

  • @Alb0z32

    @Alb0z32

    Жыл бұрын

    was wondering about that one aswell, with the new version it seems to be a bit more complicated imo

  • @WebDevSimplified

    @WebDevSimplified

    Жыл бұрын

    This video should hopefully help with how to do this. It is using an older version of React Router, but the general idea should be the same. kzread.info/dash/bejne/gn-r15NunMfAZ84.html

  • @patrickwilliams8209

    @patrickwilliams8209

    Жыл бұрын

    you can just create an HOC

  • @mohamedkhaled3047
    @mohamedkhaled3047 Жыл бұрын

    amazing work man you covered everything thanks

  • @diptimalik0101
    @diptimalik0101Ай бұрын

    This was awesomely explained !!

  • @vasilemidrigan50
    @vasilemidrigan50 Жыл бұрын

    Thanks, Kyle! As always, to the point! Great!

  • @harrypidd4755
    @harrypidd47558 ай бұрын

    Fantastic tutorial. Thanks, legend.

  • @spinningaround
    @spinningaround Жыл бұрын

    Thank you. Very useful!

  • @eudeamonism
    @eudeamonism Жыл бұрын

    Wow. It worked really well and smoothly.

  • @PAINZOR
    @PAINZOR Жыл бұрын

    Thanks Kyle, as always the best one. Clear and powerful!

  • @emirdior
    @emirdior Жыл бұрын

    great video, helped me a lot thanks