Skip to content

Aver005/tanstack-template

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 

History

2 Commits
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

πŸš€ TanStack Start Enterprise Template

A modern, production-ready, and highly opinionated full-stack starter template built on TanStack Start, React 19, and Vite. It's designed for maximum type safety, developer experience, and performance, leveraging the power of the Bun ecosystem.

✨ Features

  • Full-Stack React: Powered by TanStack Start (Router + Query + SSR + Server Functions).
  • React 19 Ready: Utilizing the new React Compiler for automatic memoization and performance optimizations.
  • Modern Styling: Tailwind CSS v4 combined with highly customizable Shadcn UI / Base UI components.
  • Type-Safe Database: Drizzle ORM with PostgreSQL for robust, fully-typed database interactions.
  • State Management: Zustand for simple, scalable, and type-safe global state.
  • Internationalization (i18n): Paraglide JS for fully type-safe, zero-runtime-overhead translations.
  • Error Tracking: Built-in Sentry integration for React and Server components.
  • Blazing Fast Tooling: Built on Vite and powered by Bun for lightning-fast installs and execution.
  • Docker Ready: Pre-configured Dockerfile and compose.yml for seamless deployment.

πŸ› οΈ Tech Stack

Category Technology
Framework TanStack Start, React 19, Nitro
Language TypeScript
Styling Tailwind CSS v4, Lucide Icons, Framer Motion
UI Components Shadcn UI, Base UI, Radix UI Primitives
Database Drizzle ORM, PostgreSQL
State Management Zustand, TanStack Query
Tooling Vite, Bun, ESLint, Prettier, Vitest
i18n Paraglide JS

πŸ“‚ Project Structure

.
β”œβ”€β”€ messages/               # i18n translation files (en.json, de.json, etc.)
β”œβ”€β”€ project.inlang/         # Paraglide JS configuration
β”œβ”€β”€ public/                 # Static assets
β”œβ”€β”€ src/
β”‚   β”œβ”€β”€ db/                 # Drizzle ORM schema and database client
β”‚   β”œβ”€β”€ integrations/       # Third-party integrations (e.g., TanStack Devtools)
β”‚   β”œβ”€β”€ lib/                # Utility functions
β”‚   β”œβ”€β”€ routes/             # TanStack Router file-based routing
β”‚   β”œβ”€β”€ shared/             # Shared application logic
β”‚   β”‚   β”œβ”€β”€ stores/         # Zustand state stores
β”‚   β”‚   β”œβ”€β”€ styles/         # Global and theme CSS
β”‚   β”‚   β”œβ”€β”€ types/          # Global TypeScript definitions
β”‚   β”‚   β”œβ”€β”€ ui/             # Reusable UI components (Shadcn/Base UI)
β”‚   β”‚   └── utils/          # Shared utilities
β”‚   β”œβ”€β”€ widgets/            # Complex, feature-specific components and providers
β”‚   └── router.tsx          # TanStack Router initialization
β”œβ”€β”€ .env.example            # Environment variables template
β”œβ”€β”€ components.json         # Shadcn UI configuration
β”œβ”€β”€ drizzle.config.ts       # Drizzle ORM configuration
β”œβ”€β”€ instrument.server.mjs   # Sentry server instrumentation
└── vite.config.ts          # Vite configuration (React Compiler, Nitro, Tailwind v4)

🏁 Getting Started

Prerequisites

Ensure you have the following installed:

  • Bun (Recommended) or Node.js >= 20
  • PostgreSQL (Local instance or Docker)

1. Clone & Install

# Install dependencies using Bun
bun install

2. Environment Variables

Copy the example environment file and configure your local variables:

cp .env.example .env.local

Make sure to update the database connection string and any Sentry/API keys in .env.local.

3. Database Setup

Generate and apply Drizzle migrations to your local PostgreSQL database:

bun run db:generate
bun run db:migrate

# Alternatively, if you want to push the schema directly:
bun run db:push

To view and manage your data, you can launch Drizzle Studio:

bun run db:studio

4. Run the Development Server

Start the Vite development server with hot module replacement (HMR):

bun run dev

The application will be available at http://localhost:3000.


πŸ“œ Available Scripts

  • bun run dev: Starts the development server.
  • bun run build: Builds the application for production.
  • bun run start: Runs the compiled production server.
  • bun run preview: Locally previews the production build.
  • bun run test: Runs the Vitest test suite.
  • bun run lint: Runs ESLint.
  • bun run format: Checks code formatting with Prettier.
  • bun run check: Runs TypeScript type checking.
  • bun run db:*: Drizzle ORM commands (generate, migrate, push, pull, studio).

🌐 Internationalization (i18n)

This template uses Paraglide JS for type-safe internationalization.

  • Translation files are located in the messages/ directory (e.g., en.json, de.json).
  • When you update the JSON files, Paraglide automatically generates type-safe getter functions.
  • The active locale is managed via the URL or base settings configured in vite.config.ts.

🐳 Docker Deployment

The project includes a ready-to-use Dockerfile and compose.yml for containerized deployments.

To build and run the application using Docker Compose:

docker compose up --build -d

The app will be exposed on port 3000 (configurable in compose.yml).


πŸ›‘οΈ License

This project is licensed under the MIT License.

About

πŸš€ A modern, production-ready full-stack starter template powered by TanStack Start, React 19, Bun, Tailwind v4, and Drizzle ORM.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors

Languages