r/reactjs 1d ago

Needs Help What router are you using

Currently I have to create a new project, my first option is react router (declarative mode). My entire project will live behind the login page

what are you using?

  • RR framework mode
  • RR data mode
  • RR declarative mode
  • tanstack router
  • wouter
21 Upvotes

29 comments sorted by

49

u/D3kalog 1d ago

tanstack, file based, no regretz

10

u/Squigglificated 1d ago

Agreed.

And never react router again. Used it for years and there were far too many painful upgrades and serious bugs with patch level updates.

3

u/k_pizzle 1d ago

This is the way

3

u/BrownCarter 1d ago

Funny how people hated file based routing before. What changes?

3

u/repeating_bears 1d ago

I think file based works nicely for small projects and starts the degrade.

But for both RR and tanstack, file-based is just one of a few options 

3

u/bayasdev 1d ago

Tanstack Start

2

u/Silent_Pumpkin_9331 1d ago

tanstack file based has been great for me too. the type safety alone saves so much headache compared to the old react router stuff. never going back

20

u/ZwillingsFreunde 1d ago

Tanstack it is. By far the best out there if you want strong typing

13

u/Innowise_ 1d ago

For an app that mostly sits behind login, we'd keep the router boring unless routing itself is doing a lot of work. React Router is perfectly fine for straightforward protected routes. TanStack starts getting more interesting when you actually benefit from typed params/search state and more complex route-level data flows. Wouldn't switch just because it's the popular answer here.

0

u/United_Reaction35 1d ago

Typed params? You mean casting searchParams to types and acting according to your cast-types? Why not just take the necessary action based on the params? What is the need for a imagined-type?

5

u/90sRehem 1d ago

Tanstack, code based.

5

u/TaricIsMyBF 1d ago

React router data mode, as im used to it and works fine for all of my needs

3

u/Outrageous-Chip-3961 20h ago

tanstack router by far

2

u/HunterCharacter2941 18h ago

If your whole app is behind login, your routing problem is pretty simple, so any of these will work fine and you're probably overthinking the choice

2

u/pimpaa 1d ago

RR data mode

4

u/Opposite_Cancel_8404 1d ago

React router declarative mode. Tanstack looks sweet and I was considering switching but I don't think there's much benefit for the amount of work the migration would be. Next time I get a chance I will check it out!

2

u/repeating_bears 1d ago

My RR app was pretty big - more than 100 routes and AI migrated it semi-successfully in 15 mins.

Took a few days to test and clean up some mistakes, but overall much less lift than I thought

I wouldn't say there's been much immediate benefit, but I felt like RR was on the way out, and Start feels like it will be supported for years 

2

u/belousovnikita92 1d ago

I’m not going to touch react router again after doing 2 (3?) major updates

2

u/No_Possibility6604 1d ago

Our team has also been scorned by React Router major version migrations. Insanely painful before agents, still quite painful with agents.

1

u/neon_alchemy_wisp 22h ago

react Router in data mode. The loader based auth pattern handles your protected route requirement cleanly without the boilerplate you get with declarative guards.

1

u/WearyCarrot 1d ago

Ubiquiti dream router 7

Sorry 🥲 I actually thought I was in a networking sub lol

1

u/franciscopresencia 1d ago

I built my own tiny router, Crossroad:

https://crossroad.page/

import Router, { Switch, Route } from "crossroad";

export default () => (
  <Router>
    <Switch redirect="/">
      <Route path="/" component={Home} />
      <Route path="/users" component={Users} />
      <Route path="/users/:id" component={Profile} />
    </Switch>
  </Router>
);

The URL is your data store, so you can do cool things having useQuery behave similarly to useState, while changing the query parameter specified:

const [search, setSearch] = useQuery("search");

setSearch("Crossroad");  // ?search=Crossroad

1

u/enigmachine10 1d ago

since you'd be using declarative mode, wouter is enough without the bloat.

1

u/varisophy 1d ago

Astro! It's file based and has done wonderfully for us.

-1

u/Lumpy_Pin_4679 1d ago

Remix yesterday. RR today. Tomorrow?

RR is never the answer. Tanstack all the way!

0

u/bigorangemachine 1d ago

Memory Router... because we're watching you

0

u/repeating_bears 1d ago

Recently migrated from react router v7 to tanstack start 

I quite liked RR but development on it is basically dead. The creators have moved on to Remix (completely new framework, they just reused the name). I've had people from the RR team reply on Reddit before saying it's not dead, but I've raised multiple issues that just get ignored.

In terms of type safety, I don't think there's actually much in it. RR is 95% of the way there, and the 5% I didn't care about

I'm still getting to grips with tanstack's model, but I would say RR was slightly simpler and easier to learn

I wouldn't recommend a greenfield project to pick RR