A minimal starter template for 🏝️ TanStack Start.
- React 19 + React Compiler
- TanStack Start + Router + Query
- Tailwind CSS v4 + shadcn/ui
- Drizzle ORM + PostgreSQL
- Better Auth with OAuth2 for GitHub, Google, and Discord.
-
Use this template or clone this repository.
-
Install dependencies:
pnpm install # npm install -
Create a
.envfile based on.env.example. -
Push the schema to your database with drizzle-kit:
pnpm db push # npm run db push -
Run the development server:
pnpm dev # npm run devThe development server should be now running at http://localhost:3000.
- React Compiler docs, Working Group discussions - React Compiler is still in beta. You can disable it in app.config.ts if you prefer.
- TanStack/router#2863 - TanStack Start is currently in beta and may still undergo major changes.
- shadcn-ui/ui#6714 - We're using the
canaryversion of shadcn/ui for Tailwind v4 support.
These scripts in package.json use pnpm by default, but you can update them to use other package managers if you prefer.
auth:generate- Regenerate the auth db schema if you've made changes to your Better Auth config.db- Run drizzle-kit commands. (e.g.pnpm db generateto generate a migration)ui- The shadcn/ui CLI. (e.g.pnpm ui add buttonto add the button component)formatandlint- Run Prettier and ESLint.
auth-guard.ts- Sample middleware for forcing authentication on server functions. (see #5)ThemeToggle.tsx- A simple component to toggle between light and dark mode. (#7)
Read the hosting docs for information on how to deploy your TanStack Start app.
- nekochan0122/tanstack-boilerplate - A batteries-included TanStack Start boilerplate that inspired some patterns in this template. If you're looking for a more feature-rich starter, check it out!
- AlexGaudon/tanstarter-better-auth for his own better-auth implementation.