React Router 6 - Tutorial for Beginners

[@eacardenase]

John is so good at teaching! Thanks to him I landed my first job as web developer! :3

[@Steel0079]

Same here 😊

[@danilkrymskiy3431]

Wow, congrats!

[@toppmoviehighlights]

I totally agree.... and congratulations, man.

[@aldimilano4516]

Good to hear that, congratulations.

[@jacksonson1593]

Can you share how can I connect with you?

[@tanaydwivedi2922]

Best react router v6 explanation that i had ever found on internet. Binged watch this whole video and it was absolutely worth it. Thank you John for making react router v6 easier.

[@mohitsaud2071]

Love you John ❤. One of the biggest reasons that I have started working as node.js developer is you John ❤.

[@remitto8367]

I took some time away from React, came back, and was having tons of problems with the new React Router 6. Following this tutorial fixed everything, thanks so much.

[@Sports-Made]

I watched lots of videos, but whenever I watch John’s videos things are so much clearer…. Thank you for all the time you have put into these videos… Will definitely send a big one to you….

[@eyujunior9991]

I was going to learn this tomorrow morning and somehow youtube recommended it to me🤩🤩🤩

[@jamesonajobi3135]

The Simplicity is Amazing

[@eliarece-5996]

You published this the day after I learn React Router 6...

[@chibuzorobiefuna9586]

Great piece watching from Nigeria 🥰🥰👍👍

[@tarunsikarwar]

Please make a full course on typescript beginners to advance level

[@pedroafonso2114]

Best explanation about react router I saw, thank you for this John !

[@python-programming]

Looking forward to this tutorial!

[@vaibhavshukla1685]

😃 I have just completed this tutorial and now i confidently say that i know react-router-dom uses.. Thanku john smilga and whole FreeecodeCamp team...

[@BlastbeaterPT]

This is the best React Router course i have witness. Very concise and straightforward :)

[@mathewdavies1480]

If you are finding your NavLink component is always highlighting 'home' as well as the current page, you can fix this by putting 'end' on the end of your Home NavLink opening tag. i.e. (isActive ? "link nav-link-active": "link")} to="/" end>Home

[@joshualord986]

Thanks!

[@onkillstreak2106]

saved my day. I was trying to debug this

[@amitsaha642]

Thanks a lot man

[@CoderDmitri]

John Smilga does it all... with STYLE! =)

[@alvincodes]

Awesome tutorial. Most courses are yet to adopt to React Router V6. Thank you, John.

[@riteshmauryafullstackdevel3753]

always waiting for video 💗💗💯

[@elamandeep]

Thank you John for awesome tutorial

[@chinonsoojoechem]

Thanks a lot John. I'll be so glad if you release a NextJs course

[@donramsey8119]

Absolutely one of (if the not the best) I have viewed! Thank you.

[@ayi8603]

宝藏博主！我挖到宝了，好清晰的教学呀，爱了爱了🥰

[@nischaljadhav8395]

Done and Dusted. React Router V6 understood !! Roger that sargent

[@fedu_sampa]

Another project from John. Thanks man.

[@jorgenUA]

finally a good teacher,

[@vitaly_p]

Amazing tutorial! Exellent work, guys!

[@sharathnair2790]

Every v6 tutorial is lacking the searchParams part of it. I feel that is the most important part. There are only few tutorials on that

[@abhishekkumarsingh2387]

Scrimba has included searchParam in detail .

[@INAVACL]

Thank you so much, this solved two issues ive been having. I feel dumb lol

[@chadrogers5743]

Great tutorial! Thanks for teaching react router v6 so clearly!

[@Javous12345]

Thanks man you re the best teacher i ve ever had

[@medzikuser]

Thanks for video!

[@charlesxstorm]

This is very well taught. Thanks for making it very clear.

[@martapfahl940]

Perfect explanation pace! Thank you John!

[@florenciobritez5521]

The course is awesome! 🔥

[@peterpardo4138]

Amazing job! Thank you so much for this awesome content. Props to John for teaching this topic. I appreciate your effort.

[@Mozatron87]

I'd have given this multiple likes if it was possible. Top work John.

[@dreamerwandering]

this tutorial is very concise, tk u teacher!

[@FiveFourThor]

That voice .. I can recognize it anywhere! hahah. Awesome video!!

[@RN-hq8gg]

simple and great tutorial

[@JeyDotC]

Pretty good tutorial! Also, I have discovered, several voices in English make me fall asleep, I don't know why, I've found a few channels that produce that effect on me :|

[@inaamkhan7886]

I also have the same problem .

[@wxIyz]

With subtitles, Thank you FreeCodeCamp

[@aiFeeling]

Wow. Its great one .❤️

[@yimiesart9262]

Thank you so much, John Smilga!

[@junsgk]

John f. DOE! Cant miss you teaching code.

[@adebayoayo5898]

So simplified, thanks for the great tutorial❤️

[@boluwatifejanet3162]

I just got the explanation. Thanks 😊

[@danialez]

Just amazing

[@nodiraegamberdiyeva5581]

thank you so much for video tutorial , it really helps me to understand react router dom v6 )))

[@jacerchetoui709]

Thank you so much john for this amazing tutorial !

[@yulyasaroyan8696]

OMG guys this is sooo nice, thanks to this channel

[@al_domingo]

Thank you for your work. Awesome explanation of each detail !

[@rightsonkirigha9669]

Finally, the video i have waiting for

[@kennedychukwu4152]

This is a great resource. Wow! thank you

[@miketepes8208]

Thank you I learned a lot, you helped me a lot. Godbless Sir and the free Code Camp

[@IamCkNitin]

Excellent

[@silviualexandruparaschiv9838]

Just awesome!

[@Sovit705]

Thankyou for sharing the knowledge.👍👍

[@jaloliddinhaqnazarov2667]

Very good 👍👍👍👍

[@junkmailthreestacks6675]

Awesome tutorial! Noob question. Once on the single product page, how would one button click through all the available products? Would that be slider functionality or still routes?

[@videopreneur2127]

i was at the 8 minutes mark then i got engrossed in the potential masterpiece i could make and started dancing and bobbinb my head

[@RiteshNEVERUNIFORM]

Great!

[@mahdiouatah761]

Thank you so helpful

[@prabhakarmishra2182]

Hi John, I really appreciate the way you teach, but I think you are not showing us the real webpage that is the product of the code on the left side, Pay attention to @10:26 "Testing" in the browser and "testing" in the code, how come this be so?

[@chimdimgbeokwere2415]

Amazing content!

[@jandeswart1378]

This is a very very good video!

[@darismathewrivalx5862]

thank you

[@voice_famous_books4301]

Perfect, thanks;)

[@jitendramistry1241]

Angular tutorials❤❤❤ please🤩??

[@heavilgaming4763]

Please post a nuxt js course ...plsssss 🙏

[@Amanidridi457]

thank uo so much

[@westernpigeon]

FINALLYYYY

[@nikwotten1804]

such a great content leave more ducking likes

[@shivamrana5984]

Today I am struggling with routers and then I found this

[@badboys7656]

sotis when the sample finishes playing it will play over itself and you get tNice tutorials echo effect.

[@saplay3372]

Thanks this

[@returnMarcco]

El Reacto of the JavaScript Cartel

[@thegullvlog1551]

can someone explain to me if i learned React Router V6 why would i need to learn Next.js ? Can someone tell me the difference?? i never dove deep into Next.js so i dont know if there is a secret trick Next does im just wondering

[@demawobass]

what you do with React to configuring your own routes , with nextjs , it does that for you out of the box, nested routes might be tricky with React router but nextjs You can just put those in a folder and use index.js as the parent

[@prakharmj]

Hey is the on refresh action giving error because the user request is sent to the backend handled here?

[@briandacallos4234]

Mind grenade - John Smilga

[@calvinwilliams729]

React Router updated their lib

[@copaceticobserver]

For some reason on the home page/shared layout page I can't use any of the navigation links I can't click any of them and their styles on active and hover don't seem to be applied. If I open up the dom though I can access them by just clicking and if I go to one of the nested pages. the navigation seems to wrok again

[@shineLouisShine]

So unfortunately,this tutorial doesn't seems to include the option to register/sign up from within the login form as a reasonable common requested and legit possibility..? Thanks anyway.

[@mrrishiraj88]

👍

[@wishmeheaven]

Hey John, v6.4 changed the rules

[@azubuikenjoku712]

Please what if the data is coming from a server? How do I pass it from Products page to product page?

[@yoismak]

hey, cool video! Im new to react and got a little confused... can we simply not use NextJS for this? It comes with other features too

[@Steel0079]

React is where you start before learning Nextjs.

[@martapfahl940]

44:05 for some strange reason my Home Link is always keeping the active class.... cant figure out why

[@martapfahl940]

Found the solution actually in the React Documentation, maybe it has changed since you've been recording this. You just have to add the word "end" just before you close the opening NavLink Tag like so: This way it will work

[@siralone3646]

@@martapfahl940 Thanks

[@KrishnaKumar-qx1mk]

when we change the url after login , since he is a user he must be able to navigate to other pages , how can i achive this feature?

[@johngeronimo8821]

48:16 May I know why you have "link active" instead of "active" in the first condition of your classname?

[@christopherpink842]

i had to watch over a few times to know, so "active" is default styling provided by react-router, so when you want to style it yourself with custom colours your can create a class name in your css and name it whatever you want , he just named it link and added it to active, thats why he wrote "link active"

[@EhteshamShahzad]

React Router tutorial: switch to NextJS.

[@liyaguliaieva1111]

How does he iterate over the object at 59:00 min? I got an error that " map is not a function"😕😔

[@chubbyBunny94]

Can someone please summon me or when there's a tutorial for Redux without TypeScript

[@leonzeng4139]

how to create the initial project and how to run it? I clone the github but I can't run it. I tried npm start, but it shows: 'react-scripts' is not recognized as an internal or external command, operable program or batch file

[@leonzeng4139]

Thanks,I got it.

[@peterisaiah8665]

really good content, but too much back and forth on the md file

[@patt4343]

The image links to cloudinary in data.js does not work anymore :/

[@patt4343]

Now they work again :)

[@aiFeeling]

Can you give me something like spotify with flutter?

[@DeGuzman1]

TypeError: setUser is not a function Error in Login.js in string - setUser({ name: name, email: email }); Can anybody help me? Maybe someone stuck on this too.

[@willi3.mp4]

How can the title be changed?

[@ericcartman2294]

Barak Obama teaches React Router.

[@bishalmahanta1765]

49:05