Folder Structure
An overview of the project's organization and file structure.
The Pro Next.js Drizzle starter kit follows a clean and logical structure designed for scalability and ease of maintenance in a single-repo setup.
- app
- components
- config
- content
- hooks
- lib
- schemas
- trpc
- types
- public
- drizzle.config.ts
- next.config.ts
- biome.jsonc
- tsconfig.json
Directory Descriptions
app/
Next.js App Router directory containing all routes and pages. Uses route groups (marketing) and (saas) to organize public and protected pages.
components/
React components organized by feature. The ui/ subdirectory contains reusable UI primitives from shadcn/ui.
config/
Application configuration files. Each feature has its own configuration file for easy management.
content/
MDX content for blog posts, documentation and legal pages. Uses Content Collections for type-safe content management.
hooks/
Custom React hooks for shared functionality like session management, storage and theming.
lib/
Core business logic and service libraries. Each subdirectory represents a major feature:
auth/: Better Auth setup and utilitiesbilling/: Stripe integration and billing logicdb/: Drizzle ORM schema and clientemail/: Email service and React Email templatesstorage/: File storage service (S3-compatible)
schemas/
Zod validation schemas for form validation and API input validation. Organized by feature domain.
trpc/
tRPC API layer providing end-to-end type safety. Routers are organized by feature, and the context provides session and organization scoping.
types/
Shared TypeScript type definitions used across the application.
Highlights
(marketing)&(saas)Route Groups: Clearly separates public-facing pages from the protected dashboard application.lib/Directory: Centralizes all core services like database, authentication and billing, making them easy to test and maintain.schemas/Directory: Centralizes all Zod validation schemas for consistent validation across the application.trpc/Directory: Contains your entire API layer, ensuring end-to-end type safety with React Query integration.components/ui/: Houses reusable UI primitives, following the shadcn/ui pattern.hooks/Directory: Custom React hooks for shared functionality, reducing code duplication.