Folder Structure
Here’s how the boilerplate is organized:
/saas-boilerplate
├── apps
│ ├── web # Next.js app
├── packages
│ ├── ui # Shared UI components and styles (ShadCN based)
│ | ├── components (Shadcn, Aceternity, Mdx, Notion components)
│ | ├── styles (Shadcn and Custom Colour themes and css styles to use)
│ | ├── typography
│ ├── auth # Better Auth Authentication library
│ ├── database # Prisma ORM Client library
│ ├── email # Email Templates and Resend Client library
│ ├── typescript-config # Typescript configs library
│ ├── eslint-config # Eslint configs library
│ ├── cms # Notion Client for functions
│ ├── analytics # Google and Vercel Analytics
│ ├── payments # Dodo
│ ├── observability
├── docker # Docker configuration with example env files
└── docs #Docs for opensource contributors to this repo
└── .github #Github Actions for testing
└── vitest.config.ts #Vitest Config for testing
├── scripts # Bash Scripts to run to get started
└── turbo.json # TurboRepo config
Tech Stack
The SaaS Boilerplate is built on a modern, robust technology stack.
Core Framework
- Next.js 15: The React framework for the web. Used with the App Router for improved routing and layouts.
- React 19: The library for web and native user interfaces.
- TypeScript: Strongly typed JavaScript for better tooling and fewer bugs.
Styling
- Tailwind CSS 4: A utility-first CSS framework for rapidly building custom designs.
- Shadcn/UI: Re-usable components built using Radix UI and Tailwind CSS.
- Lucide React: Beautiful & consistent icons.
Data Fetching & State
- TanStack Query: Powerful asynchronous state management.
- tRPC: End-to-end typesafe APIs.
Database & Backend
- Prisma: Next-generation Node.js and TypeScript ORM.
- PostgreSQL: Advanced open-source relational database.
- Upstash Redis: Serverless Redis for caching and rate limiting.
Authentication & Security
- Better Auth: Modern authentication library with built-in session management.
- OAuth Providers: GitHub, Google, LinkedIn integrations.
Payments & Commerce
- Dodo Payments: Merchant of Record for global tax compliance and payment processing.
Content Management
- Notion API: Headless CMS for landing pages and documentation.
File Storage
- Vercel Blob: Serverless file storage for user uploads.
Observability
- Winston: Universal logging library.
- BetterStack: Log aggregation and uptime monitoring.
- Google Analytics: User analytics and tracking.
- Resend: Modern email API for transactional emails.
- React Email: Build emails using React components.
Infrastructure & Tools
- TurboRepo: High-performance build system for monorepos.
- pnpm: Fast, disk space efficient package manager.
- Zod: TypeScript-first schema declaration and validation.
- React Hook Form: Performant, flexible and extensible forms with easy-to-use validation.
UI & Animation
- Framer Motion: Production-ready motion library for React.
- Radix UI: Unstyled, accessible component primitives.
- MDX: Markdown for the component era.
