TanStack Start Template is a full-stack boilerplate built on the TanStack Start meta-framework and React 19, shipping with Prisma, PostgreSQL, Tailwind CSS v4, Shadcn UI, and Auth.js Google OAuth out of the box.
What is TanStack Start Template?
TanStack Start Template is a minimal full-stack application scaffold that runs on TanStack Start, a Vite-based meta-framework, and uses React 19 for UI. The template takes environment configuration for a PostgreSQL database and Google OAuth credentials as input, and produces a server-side rendered web application with type-safe loaders and authenticated routes. The template is maintained by danybeltran on GitHub.
Key Features
- TanStack Start meta-framework — Full server-side rendering and hydration with type-safe loaders, built on a Vite-based architecture.
- Tailwind CSS v4 — Styling is compiled natively through
@tailwindcss/vite. - Prisma + PostgreSQL — ORM integration with Supabase-ready configuration via
DATABASE_URLandDIRECT_URL. - Auth.js Google OAuth — Framework-agnostic
@auth/coreauthentication with Google, including a ready dev redirect URI. - Shadcn UI — Component library for building accessible interfaces.
- atomic-utils — Client-side state caching and data query utilities.
- Zod integration — Schema validation for data handling, listed in the stack.
- Bun-native commands — Install, dev, build, and start scripts are all run through Bun.
Who is it for?
- Full-stack developers — A complete starting point for TanStack Start applications that want SSR, database access, and authentication preconfigured.
- Startup teams — Need a production-ready scaffold with Google login and PostgreSQL persistence to speed up MVP development.
- Developers learning TanStack Start — A reference implementation combining React 19, Prisma, and Auth.js with clean project structure.
What can you do with it?
- Build a SaaS product — Set up Google OAuth, connect a Supabase PostgreSQL database, and ship a server-rendered app quickly.
- Prototype an internal tool — Use type-safe loaders and Prisma to build data-heavy pages with minimal boilerplate.
- Learn full-stack patterns — Study how SSR, auth, and ORM are wired together in a single coherent template.
How does it work?
After cloning the repository, you create a .env file with your database and Google OAuth credentials. Running bun install and then bun run dev starts the development server on port 3000, while Prisma generate and push run automatically during startup so the database schema stays in sync.
FAQ
How do I set up Google OAuth with this template?
Follow the Google OAuth2 credentials guide, then add GOOGLE_APP_CLIENT_ID and GOOGLE_APP_CLIENT_SECRET to your .env file. The authorized redirect URI for local development is http://localhost:3000/api/auth/callback/google.
How do I generate the NEXTAUTH_SECRET?
Use openssl rand -base64 32 or python3 -c "import secrets; print(secrets.token_urlsafe(32))" to create a secure hash, then set it as NEXTAUTH_SECRET in .env.
Does this template use Next.js?
No, it uses TanStack Start, a Vite-based meta-framework. The repository name and some older tags may reference Next.js, but the codebase is built on TanStack Start with React 19.
