Type-safe url params in NextJS app-router, similar to tanstack-router?
Some tankstack router features:
- "first-class search-param for managing state in the URL."
- "Search Param Parsing + Serialization"
- "Search Param Validation"
Hoping to achieve this in nextjs app-router.
So far, I only found https://github.com/pbeshai/use-query-params
GitHub
GitHub - pbeshai/use-query-params: React Hook for managing state in...
React Hook for managing state in URL query parameters with easy serialization. - GitHub - pbeshai/use-query-params: React Hook for managing state in URL query parameters with easy serialization.
4 Replies
There is also https://github.com/asmyshlyaev177/state-in-url
GitHub
GitHub - asmyshlyaev177/state-in-url: Easily share complex state ob...
Easily share complex state objects between unrelated React components, preserve types and structure, with TS validation. Deep links and url state synchronization wthout any hasssle or boilerplate. ...
Want to point out this project too: https://next-typesafe-url.dev/
And nextjs is kinda working on this too: https://nextjs.org/docs/app/api-reference/next-config-js/typedRoutes
next.config.js Options: typedRoutes | Next.js
Enable experimental support for statically typed links.
Nuqs is great https://nuqs.47ng.com/
nuqs | Type-safe search params state management for React
Type-safe search params state management for React. Like useState, but stored in the URL query string.