React Routing - Better & scalable Architecture 💜

With the new v6.4 of the react-router-dom library of ReactJS, you can do the following:
1. Use object style to define the routes.
2. Create children routes.
3. Define the Root component for your application.
4. Define the Outlet where you want to load the components based on route changes.
5. Define routes in a separate file and use Provider to set those routes in your application.

and a lot more.

In this video, I will update the routing done in the previous video using the latest version of react-router-dom library and will use the more decoupled way of defining the routing in the React app, with Object style and using the new features added in react-router-dom library version 6.4

I hope you enjoy this video and learn something new.

Follow me on Instagram:

Keywords:
learn reactjs
reactjs tutorial
reactjs complete tutorial
reactjs tutorial 2023
reactjs complete tutorial 2023
reactjs beginner tutorial
react tutorial beginner
react tutorial 2023
learn react 2023
react router dom
react route with params
multiple params react routing

[jad_fenergi]

Amazing explanation couldn't find any better explanation

[SWIFT]

great explanation brother, if u could continue with the new features of routing in react

[Habitura]

Hey sir, Can you also please make a video about the structure of what all things we need to make a App (like for fullstack project), there are many project tutorial but no structure explanation of what comes first and what next....( your way of explaining is too good, thanks).

[er-santosh]

Great job. I am curious about how we are supposed to implement private routes in this architecture? Are we supposed to create a HOC and wrap each element that are passed to the routes or do we have more efficient way of doing it?

[admindeep]

Can you help me with this. if a user is logged in then i want them to go to '/dashboard' instead of '/', if they are not logged in then i want them to go to 'auth/login' and lastly, if they go to any other path, i want them to redirect to login if they not logged in or dashboard if they are. How can i achieve this?

The auth has register, reset, forgot path but i know how to make them work, its just the redirecting based on auth

[chintudash]

Sir please Rract-Bootstrap ke uper bhi video banaiye iska video YouTube me milnehi rahihai

[dhruvyadav]

nah confusing video to be very honest, a good video is one where u can even watch it at 2x and it seems like so intuitive but here I have to use my brain and be lost, just try to simplify things like dhoni does .. would work well then