Getting Started

The best way to get started with TanStack Start is TanStack Builder. It's the AI-first setup flow and the easiest way to get to a working project fast.

If you'd rather scaffold locally or want a backup path, use the TanStack CLI:

npx @tanstack/cli@latest create

npx @tanstack/cli@latest create

You'll be prompted to choose your package manager and optional add-ons like Tailwind CSS and ESLint.

If you'd rather begin from a working codebase, clone one of the official examples.

To start with the Basic example:

npx gitpick TanStack/router/tree/main/examples/react/start-basic start-basic
cd start-basic
npm install
npm run dev

npx gitpick TanStack/router/tree/main/examples/react/start-basic start-basic
cd start-basic
npm install
npm run dev

To use a different example, replace start-basic with one of the slugs below.

• Basic (start-basic)
• Basic + Auth (start-basic-auth)
• Counter (start-counter)
• Basic + React Query (start-basic-react-query)
• Clerk Auth (start-clerk-basic)
• Convex + Trellaux (start-convex-trellaux)
• Supabase (start-supabase-basic)
• Trellaux (start-trellaux)
• WorkOS (start-workos)
• Material UI (start-material-ui)

Each example page also includes a StackBlitz preview so you can inspect it before cloning.

To clone a different example manually, replace EXAMPLE_SLUG below with the slug you want to use:

npx gitpick TanStack/router/tree/main/examples/react/EXAMPLE_SLUG my-new-project
cd my-new-project
npm install
npm run dev

npx gitpick TanStack/router/tree/main/examples/react/EXAMPLE_SLUG my-new-project
cd my-new-project
npm install
npm run dev

If you want to clone and deploy quickly, use the Deploy to Netlify button on an example's page.

If you want to wire everything up by hand, follow Build a project from scratch.

• If you want to learn Start from a clean slate first, use one of the new-project options above.
• Refer to a migration guide for your specific framework:
  • Next.js
  • Remix 2 / React Router 7 "Framework Mode" (coming soon!)

Once you've created, cloned, or deployed a project, continue to the Routing guide.

If you want Router-focused examples that are not Start-specific, these are useful references:

• Quickstart (file-based)
• Basic (file-based)
• Kitchen Sink (file-based)
• Kitchen Sink + React Query (file-based)
• Location Masking
• Authenticated Routes
• Scroll Restoration
• Deferred Data
• Navigation Blocking
• View Transitions
• With tRPC
• With tRPC + React Query