Agent skill · software engineering · deckardger

tanstack-start-best-practices

TanStack Start best practices for full-stack React applications. Server functions, middleware, SSR, authentication, and deployment patterns. Activate when building full-stack apps with TanStack Start.

Why this skill is useful

Provides specific patterns and rules for implementing full-stack React applications with TanStack Start that the AI wouldn't reliably generate on its own.

What it needs

About 2k tokens when loaded. Last updated 2026-04-03. 205 stars on the source repository.

What this skill does

TanStack Start Best Practices Comprehensive guidelines for implementing TanStack Start patterns in full-stack React applications. These rules cover server functions, middleware, SSR, authentication, and deployment. When to Apply Creating server functions for data mutations Setting up middleware for auth/logging Configuring SSR and hydration Implementing authentication flows Handling errors across client/server boundary Organizing full-stack code Deploying to various platforms Rule Categories by Priority Priority Category Rules Impact ---------- ---------- ------- -------- CRITICAL Server Functions 5 rules Core data mutation patterns CRITICAL Security 4 rules Prevents vulnerabilities HIGH Middleware 4 rules Request/response handling HIGH Authentication 4 rules Secure user sessions MEDIUM API Routes 1 rule External endpoint patterns MEDIUM SSR 6 rules Server rendering patterns MEDIUM Error Handling 3 rules Graceful failure handling MEDIUM Environment 1 rule Configuration management LOW File Organization 3 rules Maintainable code structure LOW Deployment 2 rules Production readiness Quick Reference Server Functions (Prefix: sf-) sf-create-server-fn — Use createServerFn for server-side logic sf-input-validation — Always validate server function inputs sf-method-selection — Choose appropriate HTTP method sf-error-handling — Handle errors in server functions sf-response-headers — Customize response headers when needed Security (Prefix: sec-) sec-validate-inputs — Validate all user inputs with schemas sec-auth-middleware — Protect routes with auth middleware sec-sensitive-data — Keep secrets server-side only sec-csrf-protection — Implement CSRF protection for mutations Middleware (Prefix: mw-) mw-request-middleware — Use request middleware for cross-cutting concerns mw-function-middleware — Use function middleware for server functions mw-context-flow — Properly pass context through middleware mw-composability — Compose middleware effectively Authentication (Prefix: auth-) …

How to use it

Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:

@skills deckardger/tanstack-start

View the source on GitHub

Browse the @skills marketplace