Full React Tutorial #22 - Exact Match Routes

[@munchybonbon8675]

Just a heads up for other viewers, with React Router v6 (latest version), the code would look like this: Basically has been replaced with , and accepts the element attribute, to which you assign the component you would like to load.

[@bugsyplays3560]

Does this also mean the exact prop isn't needed? I'm using 6 and my Create page seemed to work fine without it when done like this.

[@unknownman1]

@@bugsyplays3560 ARe u sure u are using v6 in your project, as Switch is throwing an error in v6

[@sabinoramirez2600]

@@bugsyplays3560 correct

[@sabinoramirez2600]

@@unknownman1 bugsy is referring to the 'exact' part of . In v6 it works with just path

[@susmantobealivebruh4238]

@@unknownman1 remove "switch" and use "routes "instead of switch then use the code shown as above that should solve that problem

[@stevegopop]

Bro, this guy has cliff hangers for react tutorials.....I cant stop watching

[@NetNinja]

Haha, thanks Steve!

[@sophiaonyoutube]

who needs netflix when you have netninja on youtube?

[@cyberohn]

Honestly broo😂... I came to learn just React router and I find myself watching the whole tutorial 😂

[@adityaverma6120]

Hi Shaun, I think the explanation for partial matching is a bit incorrect at 2:40. /create URL won't match /c route, partial match means partial after every forward slash in the URL. For example, the URL /create/user/123 will match the routes /create or /create/user/, but it won't match any partial word. And this makes more sense because using partial matches, we can nest the routes.

[@adeleke5140]

Hi Shaun, it does seem like in Router6, a lot has changed and the path does work automatically

[@meditationgalaxy9839]

yes it seems to have improved , dont need exact part

[@StephenBeale]

love this course and also the way you delivered the word "preview" with a flourish at 3:30😊😊 thanks again

[@NetNinja]

Thanks for your support as always Stephen :)

[@beinyourguard]

Shaun, will you include styled components in this tutorial? I'd love to learn about it.

[@wontontech]

This is excellent, short and to the point! Thank you

[@NetNinja]

Thanks, hope you enjoyed it!

[@ReachByteBurst]

congrats on a mil, thanks for the content!

[@NetNinja]

Appreciate it! :)

[@sadev0]

Hey Shawn thanks for this :)... Is there any chance of Coming "Testing React - Typescript with JEST || ENZYME " Course?

[@infobare2644]

You are on point, most instructors do not explain what that "exact

[@johnmoore4248]

Hi Shawn, I am really excited to see the final product so I am learning a head by studying your github codes up to lesson 32. And again, thank you for creating these educative and informative series. Cheers

[@rohitdummu7526]

Thank you so much you have cleared all my doubts🥳

[@NetNinja]

Happy to help Rohit! :)

[@mohamedmousa2777]

Always the best instructor

[@HostDotPromo]

Agreed. His tutorials are so good.

[@dailydosehq-official]

If you are working with V6 you also do not need to use the exact in the Route declaration.

[@anthonycalo4047]

You the man! Thanks for the videos. Every other react router video is unclear or some guy from India

[@joelmurphy7702]

In addition to @munchyBonbon 's comment, remember to define an 'element' attribute if you're using v6 of react-router-dom:

[@kashmirtechtv2948]

Amazing!! You clear the things in a very short time

[@carlijn1460]

thank you so much for this video! I am new to react and i had some trouble with routes, but you explained it so well in this video and it helped a lot! Keep up the good work!

[@tarekghosn3648]

for the algorithm we need to send this to the world.

[@spookimiiki5891]

Very good video! Straight to the point!

[@Yasmine_habun]

Thanks a lot for everything literally. THANKS

[@amjadiqbalkhanniazi]

great tutorials, thanks, it will be good if you include context api in this tutorial with useReducer hook

[@johnconnor9787]

Please, consider someday to make a playlist on MERN stack

[@basilm.b8499]

In recent versions of react-router-dom, the Switch component has been replaced by Routes function App() { return ( ); }

[@indianlongboarder2844]

i finally learned the use of exact thank you

[@scanpower8439]

I need to sleep and chill WHY AM I SO ADDICTED TO THIS xD

[@pranavmishra9366]

Thanks buddy, I implemented and it worked.

[@NetNinja]

Glad it helped Pranav!

[@theobellash6440]

What about lazy loading a component?

[@oscardbg9654]

Ninjas, how can i deploy locally the app if i'm using webpack, i've tried the vscode live server and express server for the index.html but didn't work...

[@catz497]

How does this work with unit testing? I'm having issues when trying to test that the Stats button on my app takes you to the stats page, it's expecting "/stats" but receiving "/". I suspect it's a similar issue to the exact path issue you mentioned in these videos but I can't for the life of me figure out how to make the test check the whole string specifically

[@kashmirtechtv2948]

It looks for the first address It finds / so it shows homepage that's why we use exact

[@Gamesoc]

Note for viewers, React Router v6 uses exact matching by default.

[@matthewsteedman6867]

Hey Guys , "Switch" has been Deprecated is there any other alternative?

[@JanabSmile]

Use 'Routes' instead of Switch.... just replace every 'Switch' with 'Routes'

[@gracelee5182]

if the Switch tag renders the route component exclusively, why do we need the exact property in the first place? I'm confused.

[@nandopookey9195]

Thankyou very much sir

[@renzjorgesjaredsanfernando3441]

THANK YOU SO MUCHHHHH

[@NetNinja]

[@clarencelindh1178]

gz to 800k

[@sertacekici3342]

This is amazing. Good job as always. Thank you Shaun

[@himadribhargava8455]

Awesome tutorial series

[@mohamedhourri5607]

i love u man !!

[@jess140]

great video!

[@alexstaresson9517]

nice stuff!

[@rownokmahbub]

'useEffect' is defined but never used how could i Solve this error? anyone please help me?

[@bharathr5936]

Thank you

[@artihlec]

actually /c will not match /create , but /np will match /np/something (things between slashes must be exactly the same )

[@Ridhu]

"Things between slashes" also refers to things after the last slash right?

[@developerbox3079]

@@Ridhu try and seeeeeee

[@natnaelghirma2617]

Is there a better way to route. It seems very tedious to create routing this way. If you have 20 routes, it will be like 60 lines.

[@developerbox3079]

did you find a way? because I have a same problem as well .d

[@ghofranedarragi5601]

thank you very much

[@mkmalikcom]

thank-you ♥️

[@naolchala4354]

Good tutorial, can you add à video with router animation?

[@learningit2572]

I love you!!!

[@hasanalkhder6260]

Great tutorial's

[@wpxpert98]

great! thank you

[@NetNinja]

No worries! thanks for watching :)

[@Mahmudulhasan-ts5hm]

thanks

[@DilshardAhamed-q2e]

Update in react-router-dom V6 return ( );

[@allenjohn4863]

It would be great if we get a video on how to integrate Gpay into our website.

[@all-in-all7862]

Can u create react-router beta version-6

[@nick_jacob]

Why wouldn't they just build in the 'exact' property into the 'path' property? That seems unnecessary.

[@Bee4Brendan]

When you misspelled exact and it wasn't underlined and you saved it, I was about to freak out that it worked 😂 then it didn't

[@ridl27]

ty

[@adelgafo7412]

good job sir

[@kashmirtechtv2948]

Which job?

[@vojka2973]

Ninja can you do react tutorial on udemy bro ?! PLZ

[@ZTF666]

compared to nuxt , nuxt is a blessing in this area ! haha

[@ckatke]

Ohh 😯 I thought it was all

[@Jacksons_are_jackson]

routerv6 done this by default :D

[@memory8888]

Let's save that now and... pRRreview.

[@akkaradechsrithongchai7766]

🙏

[@NetNinja]

[@christianibana933]

React router v6 made routing easier and less code

[@icetmzz9074]

this is no longer needed in v6

[@taicheeeee]

【2023/6/29】 #NO NEED TO WATCH THIS CLIP.# I think the content this clip talked about was kind of bug of react routers. However, they've fixed this problem. Don't need to watch this video now.

[@muskankoshti2665]

plzzzzzzzzzzzzzzzzzzzzzz share the codeeeeeeeeeeeeeeeeeeeee

[@PamdoraPam]

Is not easy to understand the routes, I had to figure out that you already made the hrefs in the navbar point to the routes you were using here

[@jyotirmaysengupta2360]

First

[@shiyadh4471]

thanks

[@jacobzak7494]

Thanks

[@forresthu6204]

Thanks

[@subee128]

Thanks