Это видео недоступно.
Сожалеем об этом.
React Router 6 - What Changed & Upgrading Guide
HTML-код
- Опубликовано: 3 ноя 2021
- React Router v6 (stable!) was released and it's a great improvement over v5! This video covers all the important new features AND dives into selected example apps that will be updated from v5 to v6.
Learn all about React with my full "React - The Complete Guide" course: acad.link/reactjs
Examples Code:
First example v5: github.com/academind/react-ro...
First example v6: github.com/academind/react-ro...
Second example v5: github.com/academind/react-ro...
Second example v6: github.com/academind/react-ro...
Full project example v5: github.com/academind/react-ro...
Full project example v6: github.com/academind/react-ro...
Join our Academind Community on Discord: academind.com/community
Check out all our other courses: academind.com/courses
----------
• Go to www.academind.com and subscribe to our newsletter to stay updated and to get exclusive content & discounts
• Follow @maxedapps and @academind_real on Twitter
• Follow @academind_real on Instagram: / academind_real
• Join our Facebook community on / academindchannel
See you in the videos!
----------
Academind is your source for online education in the areas of web development, frontend web development, backend web development, programming, coding and data science! No matter if you are looking for a tutorial, a course, a crash course, an introduction, an online tutorial or any related video, we try our best to offer you the content you are looking for. Our topics include Angular, React, Vue, Html, CSS, JavaScript, TypeScript, Redux, Nuxt.js, RxJs, Bootstrap, Laravel, Node.js, Progressive Web Apps (PWA), Ionic, React Native, Regular Expressions (RegEx), Stencil, Power BI, Amazon Web Services (AWS), Firebase or other topics, make sure to have a look at this channel or at academind.com to find the learning resource of your choice!
![Finesse2Tymes & Og Boo Dirty - Real Recognize Real [Official Music Video]](http://i.ytimg.com/vi/3xb4bl5PWF8/mqdefault.jpg)
As usual, you do the heavy lifting for us and save us a ton of time. Thanks, Max!
Really great to hear that, thank you!
Max, you are hands down the best teacher for programming. So easy to understand and whenever you upload I know its quality content and learning is gonna be a breeze. Humblest thank you for your work! ❤️
That's just amazing to hear and honestly means a lot to me! Thank you so much!
Max is Sal Khan of React.
1.000.000.000 % Agree.
@@b4lax That's equivelant to 1%, meaning you 99% disagree.
@@Omar_Al_Seddik lol
When the front team at my company needs to learn a new skill or just needs to refresh on a rusty one, we usually say "Check one of Max's courses, he prob. has a good one on the topic".
We are really grateful for the amazing, well structured easily approachable teaching content.
Thanks Max! I was reading React Router's documentation yesterday and was super confused. Very clear now.
Really great to hear that! Thank you so much for the nice feedback! :)
I've come back to this video several times, it's a lifesaver! Thanks!
Thanks, man! Helped me figure out how to fix my very first independent project. Not hired yet, working on some projects to get my portfolio some meat! Thanks again!
oh, Max, you just saved my day, I upgraded to V6 a couples hours ago, and feeling frustrated with those red errors. I learnt a lot from this video, thanks.
I got stucked for an hour then got ur video and it really helps me .
Thank You Sir
These changes broke my app for like 20 minutes while I tried to figure out what was going on, but all-in-all, I like the new way. The semantics make more sense, the route matching algorithm is more intuitive, and the "exact" keyword is there by default, which is typically the behavior we're looking for. Progress! 🏆
It deadass it to me too
Your words are clearly understood by non-English speakers.
And your video is really helpful. Thanks! 감사합니다.
Thank you very much for this awesome video.
as a little point for relative Links in Routes:
if you start the "to" with '/' then it will be relative path
but you can use absolute path for it to navigate to another Route in the app
Thank you for updating you React course which I have enjoyed a lot! These changes make the code a lot leaner! Thank goodness 'exact' was removed, it was a bit confusing.
Max, You are simply great ! And there is absolutely no definition for your greatness ! First of all, let me tell you, I am now a professional Frontend React Developer by only learning React from ground zero from your Udemy Course. Literally I had to go nowhere after learning from your course.
Your teaching method is just amazing where your start from very basic and then gradually move to very advance levels covering almost the aspects required to start with any concept.
Coming back to this video, since the update of React Router to v6, I was finding difficulties to migrate from v5 but again you made it really simple by covering all the important points in this video and that too by using the same sample apps which you used in your Udemy course that makes really easy for me to update my notes ( as almost all my React notes are based on your concepts ).
Thanks once again !
I got that error @2:40 and thought to myself, "is this a typescript issue of some kind?", then went down a crazy rabbit hole for like 20 minutes, reviewing their source-code, trying to figure out why neither I nor VSCode could find the import in node_modules. Lol I didn't, for a second, stop to consider the possibility that react-router-dom just got a major update with breaking changes. Wild that this only happened like 2 weeks ago, insane timing 😂. Anyway, thanks Academind for putting out this video! 🙌🏽 Now, lets keep watching and learning what's new ☮️
Thankyou so much Brother, I was getting Error from last 2 Hours and Now your video is Life Saver Thanks Man🖤
Thanks, Max, I had purchased your react course on Udemy, your course is absolutely the best I had learned!
It really helps my job! Hope the detailed react-router v6 course will be updated to the paid content soon.
I have stuck for 2 days that what's happening to react router and fortunately came across your video. Really informative.
This video is a piece of gold, it's rare to find videos that cover everything 💚
It's worth to mention that links starting with a slash are still considered absolute paths, regardless of any nesting.
So if Welcome page renders a Link to='/welcome', it will point to a '/welcome' path. But Route path='/welcome' in the same case will work as it's shown here - it will actually point to '/welcome/welcome'.
This difference is a bit confusing for starter, but logical when you think about it. Links are working as they did before, while Routes always maintain a hierarchy.
Before 2 year, you both are super champ in youtube, now a days I see only less videos in youtube
Thanks a million, Maximilian, for an excellent update, always coming up with a clean and clear explanation as you always do in your courses.
Helpful. I did fall in love with your React course
I like ur all videos. you talk to the point and save a lot of times . Thanku so much sir . keep it up
Such a brilliant and to the point explanation.
I learned react native from you and now react router explanation is superb.
As a guy still in school who doesn't have the best grasp of react.
YOU SAVED ME OMG I WAS STUCK FOR ALMOST AN HOUR BEFORE WATCHING THIS/
Seriously thanks
This is so useful, old tutorials using a different syntax meant I had absolutely no clue why my jsx weren't rendering until I stumbled across your video. Thank you!
Please how did you do it my is still showing a white blank page after changing the the route into an element format
@@naruto.boruto_edt Hey, can you copy past your code in here? This is what I made:
//removed
@@ao4-stzf thanks for your concern but I figured it out. It was just an error of wrapping Routes on route.
@@naruto.boruto_edt No worries! Glad it worked out ^^
Thanks Max. Whenever a new video comes up I have a grin on my face
Really nice summary. I'm starting with React dev now, and this video was not just an upgrading guide, but a tutorial on React Router v6 in itself. One question though, is it possible to listen to browser navigation (for example, by pressing the browser back button), or this is the part that we are missing on v6?
Excellent!!! I am actually loving the changes! (Having to update a full project here, but nothing that CTRL+Shift+H did not solve it quickly like replacing SWITCH to ROUTES and REDIRECT to NAVIGATE). The new syntax for the elements within the ROUTE is much better, as well as no longer needing the EXACT statement).
This is a great video, the docs shuold be a walk in the park now
WoooW a clear explanation everything was clear.
Thanks Max for such a clear and concise upgrade guide it really helped me a lot. Awesome as always.
Max, make a video on Next.js 12.
i have spent my two day for this error !!
Thanx Sir for provide this video
Fan of your work Max, I love how easily you make us understand these complex things.
I was watching the "Adding Routing" video in your Udemy course and I got the "wrap your in a element" error, I tried to fixed it and found that you've already uploaded this video :D, you are the best Max! Greetings from Argentina.
I was thinking to upgrade my current project to react router 6 but was super confused. You cleared all my confusions. ❤️
Yet another perfect video by Academind ❤️❤️❤️
Guys, you are my number one when it comes to courses! I have almost all your courses on Udemy ❤️
Exactly what I was looking for.......cheers
Awesome, thanks Max your vids taught me Vue better than anyone else did and now these React ones are doing the same.
תבורך מפי עליון!
Omg, you literally saved my life! I have been strugling to understand what all those errors came from even though I knew about Router v6 came out but now I know exactly how to fix them! So precious!
Your entire life was in precarious danger because of react router's v6? The dev team behind the new version are very evil...
@@Omar_Al_Seddik Haha, it's figuratively speaking, of course not, my life is not in danger. And I am not the first person ever who expressed their gratitude in such a dramatic way to show how big is the impact from the video. So why bother implement sarcasm in your comment towards mine?
Was just fooling around.
@@Omar_Al_SeddikOk, I get that
Thank you, Max. Excellent information, as usual. Keep up the great work. 👨💻
Thanks for the best explanation about activeClass for NavLink :-)
the new change of nested routes will help a lot , because I used to change the relative path's name and have to go through every nested routes to replace it .
thanks for this video max!!!!! youre the best teacher by far, so easy to understand. Just waiting for protected routes documentation, cannot find it
Thanks Max for sharing such information
This is very helpful video please make more of this kind when something changes...
You've earned a new subscriber, thank you!
You have good pronunciation, I can easily understand you despite my English is not very , very good.
Thank you so much for making this react router v6 video for us, MAX♥♥
Thank you for making this video,really helpful.
Thank you max for going through this, I've got all your courses on udemy and love your content. One of my fav dev heads you are.
THANK GOD THIS TUTORIAL EXIST
Amazing! Much appreciated, amazing explanation, will start using v6 now
so much with one upgrade, thanks max!!!!
I liked the video, it would be interesting if you made a video of how to perform the tests with React Testing Library in this new version, because I had difficulties to render the elements.
Following
Thank you so much sir. Your video is just right on time. Hope you make another one for protected routes too. Thanks again sir😀
Super, max loving it.
Thanks, it was really helpfull to get updated with react!
Please please big AWS course for developers. Existing one is small. ❤️
Thanks, finally React navigation becomes more elegant like Angular
Thank you very much for that video and good explanation AND the source code of your examples, much appreciated :)
Max, you are the best. Thank you for these instructions
Thank you so much! Happy to hear that this was helpful!
Very helpful content! Thanks!
I wub you
Thanks, it makes my life a little bit easier.
Btw `matchPath` also broken during migration from v5 to v6, replace it with `useMatch`.
This was such a clean explanation, thanks!
such a great video, thanks so much for making the video
This is awesome. You are awesome. Thank you so much. This is exactly what I wanted.
Outlets are a game-changer for the semantic structure of routes!
Max, one of the best!!!! Thanks so much!
I like the new concept of relative path in a nested route. Anyway, You are a good explainer, thanks for your video, seeing this, I think I will immediately upgrade to V6
excellent clear explanation, auto subscribe!!!
Hey! Fantastic tutorial. Two questions tho:
1- If I'm inside of a component, now routing is relative to the parent. What if I want to go out, and have a link to the main page? Am I obligated to use navigate? Or navigate is also relative to the parent route?
2- The outlet: we saw an example of an outlet with just one child. But what if have two or more children? How can I specify the place to show each of those if the position in the page for them is different?
Thank you so much for this!
YOU ARE THE BEST!!!!
YOU DESERVE EVERYTHING YOU PRAY FOR
Thanks man, I had upgraded to v6 and you saved my from seeing that lengthy documentation !!
Excellent! Thank you.
mindBlowing Explanation...
Isn’t changing the established form of the className prop (for NavLink) a debatable design decision?
This is a great summary of the changes btw!
Extremely helpful
Thats why you are highest rated on udemy too.. Thanks Max
ended a day of agony for me..thank god i found this video
Wow, great tutorial. Thank you so much.
Thank you so much Max!, you saved my day too.
Hello, thank for the video. I have a quastion about history:
On v5 version i was creating history with createBrowserHistory and pass her into . And then i could programically redirect from outside of the component. I do this for move most login from component to the store-manager. How its possible to do the same on v6? Thanks for answer.
Very useful content 🙂, thanks, thare are a lots of changes.
BLESS YOU GUYS SOOOOOO MUCH
Thank you, was stuck a bit :)
I still watching to see if your video cover react router : Route Render Function and Route Props thanks for your efforts
Max thank you from Passau
My English bad but great teacher, i undestand your lesson, thank from Russia
thanks, that help is very help full
Thanks so much, Regards!
yore best teacher in the world
yeah, React Router 6 is more readable and intuitive
Thanks Max!
Thanks, Max .
amaizing explanation, thanks
Thanks Max....
Very clear.