Hacker News Reader

Comment by amcsi | Hacker News Reader

Every time I hear any news about routing in a React framework I always get disappointed that the news isn't that they're introducing type-safe (TypeScript) routes to enable type-safe linking.

View on HN

I'm curious about what you mean. There's no way to embed type information into a URL - every GET parameter is a string. Are you suggesting that visiting a link like /123 would go to the 'string: "123"' route, while clicking a <Link to={123}> would route you to 'number: "123"'? That would make deep linking in an app really hard to manage. I'm struggling to understand why you'd want to overload routes like that.

I'm pretty sure what they are looking for is that something like a Link that takes a route name and a params object that are both typed.

Generating a set of links from the routing as a union of strings as type Route. And a <Link /> component that only accepts an href of that type.

Like so: https://www.typescriptlang.org/play?jsx=4#code/C4TwDgpgBASg9...

TS' string literal types are powerful.

https://www.typescriptlang.org/docs/handbook/2/everyday-type...

edit: I did implement this a while back but found it gave me only so much additional value. Though I can imagine that large applications with dozens of developers might indeed benefit from type-safe routes to avoid dead links.

That's an interesting idea. Cheers.

This may be of interest: https://www.npmjs.com/package/hono

Shameful ad for our own router: https://swan-io.github.io/chicane, with type-safe route consumption and creation (and other goodies).

No weirdness or magic API, the useRoute hook just return a discriminating union with typed params. It's fully-featured and used in prod.

The API is quite simple:

const Router = createRouter({ UserDetail: "/users/:userId" });

Router.UserDetail({ userId: "xxx" }); // safe

Reply on news.ycombinator.com