start-auth

Implements authentication and authorization for TanStack Start apps with sessions, CSRF, and OAuth.

1|Updated Jul 29, 2026
One-click install
npx skills add https://github.com/fusengine/kimi-code --skill start-auth-fusengine
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: start-auth
Source: https://github.com/fusengine/kimi-code/tree/main/plugins/tanstack-start-expert/skills/start-auth
Command: npx skills add https://github.com/fusengine/kimi-code --skill start-auth-fusengine

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires @tanstack/react-start, @tanstack/react-router, zod, and includes references (resource) components.

What problem does it solve? Adding auth to a TanStack Start app is error-prone because route guards (beforeLoad + redirect) only protect the UI while server functions remain directly callable API endpoints. This Skill enforces authorization at the real security boundary — inside server-function handlers and middleware — and provides hardened patterns for sessions, cookies, CSRF, and OAuth. ## Core Features & Use Cases - Two-layer auth architecture: _authed layout routes for UX redirects plus authMiddleware on every private createServerFn as the actual data boundary. - Session and cookie management: useSession sealed cookies or manual __Host- cookies with HttpOnly, Secure, SameSite=Lax flags, plus session rotation on privilege changes. - Hardening templates: CSRF/origin middleware, per-IP rate limiting, OAuth authorization-code flow with state and PKCE, and enumeration/timing defenses. - Use Case: You are building an admin panel in TanStack Start. Use this Skill to create the _authed layout, attach requireRole('admin') middleware to the deleteUser server function, and wire a rate-limited login endpoint with constant-time password comparison. ## Quick Start Add authentication to my TanStack Start app with a protected _authed layout, an authMiddleware on my server functions, and a secure login endpoint.

Frequently Asked Questions about start-auth

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I protect routes in TanStack Start?▼

Create a pathless _authed layout route whose beforeLoad calls a server function to get the current user and throws redirect to /login when absent. Pass location.href in search.redirect so users return to their target page after login.

Why is beforeLoad not enough to secure TanStack Start server functions?▼

beforeLoad only runs during route navigation, so it protects screens but not data. Server functions are independently reachable RPC endpoints, so authorization must be enforced inside the handler or its middleware on every private createServerFn.

How do I manage sessions and cookies in TanStack Start?▼

Use useSession from @tanstack/react-start/server for a sealed HTTP-only cookie, or manually set a __Host- prefixed cookie via getRequestHeader and setResponseHeader. Always apply HttpOnly, Secure, SameSite=Lax, and Path=/ flags, and rotate sessions on login or role changes.

Does TanStack Start support OAuth with PKCE?▼

Yes, you can implement the authorization-code flow with server functions by generating a state parameter and PKCE code_verifier/code_challenge pair stored in a short-lived signed cookie. The callback verifies state, exchanges the code with the verifier, and issues a rotated session.

Should I use Better Auth or Clerk instead of DIY auth in TanStack Start?▼

The official TanStack Start guide lists Clerk, WorkOS, Better Auth, and Auth.js as supported managed options. For those, install the library and follow its own current docs; this Skill's DIY server-primitive templates are for portable, vendor-lock-free implementations.

Why does reading process.env at module scope break in TanStack Start?▼

Module-scope env reads can leak secrets into the client bundle and return undefined on edge runtimes like Cloudflare Workers at import time. Always read process.env inside the server-function handler so it resolves per request.