Next Start

A basic Next.js starter.

• Next Start
  • Stack
  • Branches
  • Setup
  • Resources

Stack

• Linting / Code Style
  • eslint
    • eslint-config-prettier
      • ESLint | Next.js
    • eslint-plugin-check-file
      • Bulletproof React Guide
    • eslint-plugin-n
  • prettier
    • @trivago/prettier-plugin-sort-imports
    • prettier-plugin-tailwindcss
      • Automatic Class Sorting
• Environment Variables
  • dotenv
  • dotenv-expand
  • @t3-oss/env-nextjs
    • Documentation
  • cross-env
• Styles / UI
  • tailwindcss
  • @nextui-org/react
    • NextUI
  • next-themes
  • @tabler/icons-react
    • Tabler Icon Search
• Validation
  • zod
  • @conform-to/zod
    • Conform | Next.js
  • drizzle-zod
    • Drizzle Zod Docs
• Forms
  • @conform-to/react
• Database
  • drizzle-orm
  • postgres
  • drizzle-kit
• Authentication
  • next-auth
  • @auth/drizzle-adapter
    • Auth.js Drizzle Adapter Documentation

Branches

The main branch contains the entire setup. The following branches build on each other from top to bottom:

• base
  • eslint / prettier settings
• nextui
  • layout / styles
  • dark / light theme toggle
• typesafe-env
  • typesafe environment variables
• next-auth
  • google oauth with no database
• drizzle / main
  • basic drizzle schema with users / accounts / sessions

Setup

1. Install dependencies:

pnpm install

2. Copy the .env file:

cp .env.example .env

3. Update the following values in the .env file:

NEXTAUTH_SECRET=your-value-here
GOOGLE_CLIENT_ID=your-value-here
GOOGLE_CLIENT_SECRET=your-value-here

4. Start the database:

docker compose up

5. Migrate the database:

pnpm run db:migrate

6. Start the app:

pnpm run dev

Resources

• Next.js Discord FAQs
  • "Module not found" error on deployment but build works fine locally
• Bulletproof React