Complete CLAUDE.md template for Next.js projects with TypeScript, Tailwind, and modern best practices.
CLAUDE.md is a project-level configuration file that provides Claude with context about your codebase. It defines coding standards, project structure, preferred patterns, and important conventions. Place it in your project root and Claude automatically reads it at session start.
Copy to your project root as CLAUDE.md
# Project Name ## Tech Stack - Next.js 14 with App Router - TypeScript (strict mode) - Tailwind CSS - Prisma ORM (if using database) ## Code Style - Use functional components with hooks - Prefer server components when possible - Use TypeScript strict mode - Follow ESLint and Prettier rules ## File Structure ``` src/ app/ # App router pages components/ # React components lib/ # Utilities and helpers hooks/ # Custom React hooks types/ # TypeScript types ``` ## Conventions - Components: PascalCase (Button.tsx) - Utilities: camelCase (formatDate.ts) - Constants: SCREAMING_SNAKE_CASE - CSS: Tailwind classes, mobile-first ## Best Practices - Always add "use client" directive when needed - Use proper loading and error states - Implement proper SEO with metadata - Use Image component for images
Claude will follow these conventions when working on your Next.js project.