I'm Never Using React Router Again
HTML-код
- Опубликовано: 28 янв 2024
- We can all appreciate React Router for what it is. But I spent a while playing around with TanStack Router and this is definitely my go-to for pure React projects. Just look at the TypeScript support :O
tanstack router website: tanstack.com/router/latest
-- my links
Newsletter: www.joshtriedcoding.com/
Discord: / discord
GitHub: github.com/joschan21 
Наука
Love the endless change in life cycle of apps before going from dev to production.
Dude whenever I want to know what's up and coming libraries or software I check out your channel. You rock!! I'd love to see a longer in depth tutorial video where you built a basic app.
Oh wow, thanks a ton for the Shift+option+O shortcut! It has always been a pain point for me to manually remove those things
Thank you for sharing these informative videos; they've certainly enriched our knowledge and understanding
Don’t lie Josh. You’ll be using react router in your next project 😂
Truee 😂
😂😂😂
*Dom
yes
Haha it's funny but true
Thanks... this is a great intro video. is like a portal that keeps changing the UI view whenever a matching route is active.
Cool review! Thank you!
4:27
Josh: That is magical ✨
Also Josh : That is basic stuff.
Need a full video about this
Please make more comprehensive Tut on this please.
Josh: **eats Ryder** - Twix: **comes out** - Josh: “I never eat Ryder again!!!”
I am trying to switch to Tanstack Router from React Router. But as I experience, all of my components are going to be placed in the routes. Is that a right conclusion?
You can add the component as a function but not give any properties.
Has anybody have tips?
Can you please make a tutorial making and app using tanstack router and react query with pagination , this would be best combo
this was ridiciliously helpfull thanks
We need an end to end tutorial
I hope you have talk about the layout part next time.
Can u make a full stack app using tanstack router and trpc with SSR? Would love to see if SSR is possible with tanstack router
I would love to see this setup also!
Crazy how Josh don't know what Outlet does, is literally the most awesome thing about react routers
I was also a bit shocked about that. I mean come on, this doesn’t exist for only 2 days or so…
He could of at least looked it up. He does edit his videos@@lollol-il2vz
I dont know what Outlet does too 😆the funny thing is that in some projects I use React Router
PD: I would rather never touch anything about React Router to be honest
Outlet is a place which sells slightly damaged or outdated goods from a particular manufacturer, or goods that it made in greater quantities than needed. But in a dev world outlet is a magical component that makes dev tools work 😅
"fully type safe" does't add much for most sites and projects which are small and have a few routes to begin with
Ur complaining about something the tool was not designed for. It’s for large apps that heavily rely on routing. Updating routes and search params can cause large breaking changes that u would not be aware of unless u had good typechecking on routes.
Hey. I would love to see project on React Vite Tanstack Query and Router
Congrats on the mac!
I only like the type-safe part but I also hate it at the same time because I have to use that much boilerplate code to make it actually type-safe... 😂
Nothing is beating the loader and action of react router💪🏾
dude, there is loaders as well and they are type safe
@@vty4261 just found out. Thanks
I need to try this 👀, but I need to migrate all the routes hhhh
this is great
hey do us an advanced shadcn totorial advanced costumisation and variants .....
josh moved to mac?
i dont understand the point of using a router.
it seems so much easier to me to just create folders which tells where in the url something is (like /home)
and put a .tsx file there
this just seems way too much work for something so basic
is there something about routers that im not getting?
That's a router, but the complexity is removed
"fully typesafe" but in the codegen, I see some "any" type lol
it is unbound from react tree ?
well "parallel Route Loaders" hahah nice
I'm too used to the in-one-place version of routing.
Vercel should take some pointers
looks good But no thanks, i already spent lots of time from react router v5 to v6 to v6.3.3 to v6.4 and not going to invest anymore time in routing!
fair enough
And there is also no sense using this library :D you can achive routes type safety with many other ways (you do not need another useless fancy "autogen "solution"") and also react-router way too powerful
This feels way too complex, compared to only few lines of code with react router,
@@zoltanbalogh8949autogen is one way of doing it, tanstack router prefers u don’t do it that way but gives u the option regardless
@@zoltanbalogh8949 true i already made a simple approach which is putting all the routes in an object so you don't have to worry about typos and stuff. there could be better approaches as well
So what about next?
So much boilerplate 😅
💥
Josh, enjoy your new Mac! 😅
YESSIR
Sorry! I will go with NextJS
Outlet is too good to gloss over!
I think it's easier to just use next js
7:50 Installed the package with pnpm and ran the server with yarn. 🤣🤣
haha its just quicker to type
Maybe bun will be the new shortcut 👀@@joshtriedcoding
Or use nextjs!!
It just crazy how we can say that React Router is not a modern router lib. Remix is using it under the hood and these loaders/mutations and apis for managing url state are driven by React Router. This Tanstack and React Router are not totally comparable. Tanstack is more opinionated compare to the later like having its own caching. But you can integrate caching into React Router like using it with react-query.
But saying React Router is not a modern is kinda misleading.
how much did they pay you? this is just an ad guys
I wonder how React devs feel when they use Angular Routing System.
react devs use nextjs anyway
how can you title this "I'm never using react router again" then proceed to say "I don't know what an outlet is". Did you ever use react-router to begin with?
It's only for "vanilla" react only, right? Like for dashboards, or SPAs. Vite + react is not widely used anymore, due to SSR libs like Next. It's a shame, because this library looks very cool indeed.
I would say react by its own is still used a lot
dont be fooled by twitter and reddit, react + vite is still used
JavaScript influencer is very popular job on youtube, obviously🙄
You're still using raw react? Why?
Why wouldn't he? For many projects SPA can be a better way of doing things. E.g. you have third party or own web APIs in doesn't matter which language, and you're building an actual application, not a web site (ERP, banking, Book keeping stuff etc) where you would care about SEO and random people.
@@denissorn What are you using to make these apps? CRA?
@@robertsandiford6223 last time I worked with react I used vite. Not sure what's the current best/recommended way to do it, but if I would simply search the web and check the situation/recommendedations. Vite worked quite well for me, and migrating projects from CRA to Vite was pretty straightforward and simple.
@@robertsandiford6223 React + Vite. CRA is dead
incroyable, its too fast ;) thx
Outlet is for putting children
naahh setup takes to long
Obviously if it's a small project with nothing important then this is not worth the setup but for anything where you want resilience and the type checking this is worth it even if it takes ten times longer
Are we really gonna forget the fact that this is for SPAs?
All those SPAs will eventually become websites backed by a full-stack framework once those developers get to know about the drawbacks of SPAs. Then this package is in stone unless it is adopted by NextJS. I don't think that would happen either because NextJS and React-Router are maintained by Vercel. Pretty sad ;(
Not for me though, because I don't like the maintainer of TanStack.
enough of click bait
The cool kids like to use TypeScript ("i cannot longer use vanilla js")
First
240th
Wtf is this easy?
yeah.... another JS library... doing exactly same job, like many other....
TanStack Router has so many innovations compared to other client-side and framework routers. It's actually a game-changing library.
@@KevinVandyTech Tanstack is excellent for data fetching and it's headless data grid. I don't know about this routing.
Josh you are too young and junior
You will probably switch to Remix in the future so i think ull be using react router
This is totally a lie.
isnt tanstack basically react query?
Tanstack Query is the new name for react query. Josh is showing a different Tanstack product called Tanstack Router, which is equivalent to react-router(made by Remix devs) but different from Tanstack Router
U look like Ben foakes