tanstack-start
TanStack Start Skill
When to use
- Creating or refactoring routes under
src/routes/*. - Implementing server functions (privileged reads/writes).
- Ensuring SSR + hydration correctness with TanStack Query.
Guardrails
- Keep secrets and privileged writes server-side only.
- Validate inputs at boundaries with Zod (params/search/server-function inputs).
- Prefer “thin routes”: UI composition + data wiring; move business logic into domain modules.
Workflow checklist
- Identify route + data boundary (client vs server) and decide what must run server-side.
- Define Zod schema(s) for inputs/params; parse early; return typed results.
- Use SSR-friendly loading patterns (route-level loader + SSR Query integration).
- Keep cache behavior explicit (staleTime, gcTime, invalidation) and predictable.
- Add minimal tests for critical logic when behavior changes.
More from huynhsang2005/blog-tanstack
framer-motion
Create smooth, performant animations with framer-motion. Use when building page transitions, component animations, or gesture-based interactions.
18tanstack-form
Use TanStack Form for complex forms with Zod validation. Use when building non-trivial forms or admin editors.
10frontend-ui-ux
Designer-turned-developer workflow for crafting cohesive UI/UX with strong visual polish and interaction quality.
9tanstack-table
Use TanStack Table for complex admin grids and data tables. Use when you need sorting/filtering/pagination/column defs beyond a simple list.
8tanstack-router
Work effectively with TanStack Router file-based routing in this repo. Use when adding/changing routes, loaders, route params/search params, or navigation.
6zustand
Use Zustand for client state in this repo. Use when you need shared client state, derived selectors, or cross-component UI coordination.
4