Quick Start

Get Started with Next.js Boilerplate

Transform your development workflow and launch your high-performance web application in under five minutes. This boilerplate provides a production-ready ecosystem featuring Next.js 16+, Tailwind CSS 4, and TypeScript, pre-configured to handle authentication, database management, and internationalization out of the box.

1. Initialize Your Project

Start by cloning the repository and installing the dependencies. This setup includes a comprehensive suite of developer tools like Lefthook, ESLint, and Prettier to ensure your codebase remains clean and maintainable from day one.

git clone https://github.com/ixartz/Next-js-Boilerplate.git my-project-name
cd my-project-name
npm install

2. Configure Your Environment

The boilerplate integrates seamlessly with industry-leading services to provide a "zero-config" feel for complex features. To unlock the full power of the product, you will need to set up your environment variables.

Authentication with Clerk

This boilerplate uses Clerk for secure, passwordless, and social authentication.

1. Create a free account at Clerk.com.
2. Copy your NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY and CLERK_SECRET_KEY into a .env.local file.

Database with DrizzleORM

For local development, the system uses PGlite, a WASM-based PostgreSQL that runs in-memory or in a local file, requiring no heavy external installation.

1. Copy .env.example to .env.local.
2. The system is pre-configured to use DrizzleORM for type-safe database interactions.

cp .env.example .env.local

3. Launch the Development Suite

Once configured, start the development server. The boilerplate doesn't just launch a website; it initializes a complete development environment including the App Router, i18n routing, and real-time error monitoring.

npm run dev

Open http://localhost:3000 to see your application in action.

4. Explore Integrated Features

Your new project comes equipped with a sophisticated set of tools designed to solve common scaling problems:

• Multi-language Support: Change languages and manage translations via next-intl and the src/utils/AppConfig.ts file.
• Database Migrations: Update your schema in src/models/Schema.ts and synchronize your database instantly:

  npm run db:generate
  npm run db:migrate
  

• UI Component Lab: Develop and test your Tailwind components in isolation using Storybook:

  npm run storybook
  

• Safety & Testing: Ensure product reliability with built-in testing suites:

  npm run test        # Runs Vitest for unit testing
  npm run test:e2e    # Runs Playwright for end-to-end testing
  

Intended Use Cases

• SaaS Foundations: Rapidly build subscription-based platforms with pre-integrated auth and database logic.
• International Apps: Launch in multiple markets simultaneously using the built-in i18n architecture.
• Enterprise Starters: Utilize the strict TypeScript configurations and automated AI code reviews (via CodeRabbit) to maintain high standards in professional environments.