# CRUSH.md ## Commands - **Install dependencies**: `pnpm install` - **Development server**: `pnpm dev` (runs `next dev --turbopack`) - **Build**: `pnpm build` (runs `next build --turbopack`) - **Start production**: `pnpm start` (runs `next start`) - **Lint**: `pnpm lint` (runs `eslint`) - **Typecheck**: `pnpm tsc --noEmit` (TypeScript compiler without emitting files) - **Tests**: No test script defined. Add Jest or Vitest via `pnpm add -D vitest` and configure. - **Run single test**: Once tests are set up, e.g., `pnpm vitest src/app/page.test.tsx` (example; adjust based on setup). ## Code Style Guidelines - **Language**: TypeScript with strict mode enabled (`strict: true` in tsconfig.json). - **Framework**: Next.js 15 (App Router). Use server components by default; mark client components with `'use client'`. - **Styling**: Tailwind CSS (via globals.css). Use utility classes; avoid custom CSS unless necessary. - **Fonts**: Geist Sans for body (`--font-geist-sans`), Geist Mono for code (`--font-geist-mono`). - **Imports**: - Use absolute paths with `@/*` alias (e.g., `import { Component } from '@/components'`). - Prefer named imports over default where possible. - Import types explicitly: `import type { Metadata } from 'next';`. - Group imports: Next.js/React, then third-party, then local. - **Formatting**: Follow ESLint rules from `eslint.config.mjs` (extends `next/core-web-vitals`, `next/typescript`). Use Prettier if added. - **Types**: Always type props (e.g., `Readonly<{ children: React.ReactNode }>`). Use `React.FC` sparingly; prefer function signatures. - **Naming Conventions**: - Components: PascalCase (e.g., `HomePage`). - Variables/functions: camelCase. - Files: kebab-case for pages (e.g., `page.tsx`), PascalCase for components. - **Error Handling**: Use Next.js error boundaries or try-catch in async functions. Log errors to console in development. - **Components**: Functional components with hooks. Colocate styles and logic. - **Paths**: Use `next/image` for images with `priority` for above-fold. Optimize with width/height. - **Ignores**: ESLint ignores `node_modules/**`, `.next/**`, etc. Respect `.gitignore`.