Jonathan
6b698c5f58
- Add CLAUDE.md with project conventions and architecture notes
- Create Navbar (sticky, backdrop blur, mobile menu) and Footer
- Build homepage sections: Hero, FeaturedProjects, Skills, CurrentWork, CallToAction
- Add /projects, /about, and /contact pages
- Create reusable ProjectCard and Badge components
- Centralise project data in content/projects.json with featured flag
- Add class-based dark mode toggle (default dark, persisted to localStorage)
- Refactor globals.css: remove conflicting prefers-color-scheme media query
- Fix two-instance ThemeToggle sync bug in Navbar
- Fix key={index} anti-pattern in timeline, stale closure in setOpen
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
38 lines
1.5 KiB
Markdown
38 lines
1.5 KiB
Markdown
# CLAUDE.md
|
|
|
|
This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
|
|
|
|
@AGENTS.md
|
|
|
|
## Commands
|
|
|
|
```bash
|
|
npm run dev # Start development server
|
|
npm run build # Production build
|
|
npm run start # Start production server
|
|
npm run lint # Run ESLint
|
|
```
|
|
|
|
No test runner is configured.
|
|
|
|
## Stack
|
|
|
|
- **Next.js 16** with App Router — read `node_modules/next/dist/docs/` before writing any Next.js code; APIs may differ from training data
|
|
- **Tailwind CSS v4** — configured via PostCSS (`postcss.config.mjs`); no `tailwind.config.*` file; theme tokens defined in `app/globals.css` using `@theme inline`
|
|
- **TypeScript** — strict mode, path alias `@/*` maps to project root
|
|
|
|
## Architecture
|
|
|
|
This is a portfolio site built with the Next.js App Router. All routes live under `app/`. Global styles and theme variables are in `app/globals.css`. Fonts (Geist Sans/Mono) are loaded in `app/layout.tsx` and injected as CSS variables.
|
|
|
|
Reusable UI components should go in `components/`. There is no `components/` directory yet — create it when adding the first component.
|
|
|
|
## Project Rules
|
|
|
|
- Functional components only — no class components
|
|
- All styling via Tailwind utility classes — no CSS modules or inline styles
|
|
- Dark mode by default; use Tailwind dark-mode utilities and the CSS vars (`--background`, `--foreground`) defined in `globals.css`
|
|
- Keep components small and single-purpose
|
|
- Prefer readability over cleverness
|
|
- Do not add features unless explicitly asked
|