Next.js Monorepo Architecture

// turbo.json
{
  "$schema": "https://turbo.build/schema.json",
  "pipeline": {
    "build": {
      "dependsOn": ["^build"],
      "outputs": [".next/**", "dist/**"]
    },
    "dev": {
      "cache": false,
      "persistent": true
    },
    "lint": {},
    "test": {
      "dependsOn": ["build"]
    }
  }
}

monorepo/
├── apps/
│   ├── web/          # Next.js main app
│   ├── admin/        # Next.js admin app
│   └── docs/         # Next.js docs
├── packages/
│   ├── ui/           # Shared components
│   ├── config/       # Shared configs
│   ├── database/     # Prisma schema
│   └── utils/        # Shared utilities
├── turbo.json
└── package.json

// packages/ui/package.json
{
  "name": "@repo/ui",
  "exports": {
    ".": "./src/index.tsx",
    "./button": "./src/Button.tsx"
  }
}

// apps/web/package.json
{
  "dependencies": {
    "@repo/ui": "*",
    "@repo/database": "*"
  }
}

// packages/config/tailwind.config.ts
import type { Config } from 'tailwindcss';

const config: Config = {
  content: [
    './src/**/*.{ts,tsx}',
    '../../packages/ui/**/*.{ts,tsx}',
  ],
  theme: {
    extend: {
      colors: {
        brand: '#0070f3',
      },
    },
  },
};

export default config;

// apps/web/tailwind.config.ts
import baseConfig from '@repo/config/tailwind';

export default {
  ...baseConfig,
  content: [...baseConfig.content, './app/**/*.{ts,tsx}'],
};

// packages/database/index.ts
export * from '@prisma/client';
export { prisma } from './client';

// Type-safe across all apps
import { prisma, User } from '@repo/database';