ea63347cd6
- replace CRA scaffold with Next.js static export config - add app router pages: home, homelab, archive - add components: Nav, Footer, Hero, Skills, ProjectCard, ThemeScript - add ThemeContext for dark mode with FOUC prevention - add data layer: projects.ts, services.ts - update .gitignore for Next.js (ignore .next/, out/, next-env.d.ts) - add docs: handoff plan, homelab decisions, style reference
56 lines
2.4 KiB
Markdown
56 lines
2.4 KiB
Markdown
# CLAUDE.md
|
|
|
|
This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
|
|
|
|
## Project Overview
|
|
|
|
**Project:** [PERSONAL PORTFOLIO]
|
|
**Stack:** [Next.js 16 + React 19 + TypeScript + Tailwind v4]
|
|
**Deployed to:** [github pages]
|
|
|
|
## Branch Strategy
|
|
|
|
This repo uses two branches:
|
|
- **`master`** — production build output (HTML, JS, CSS bundles); what GitHub Pages serves
|
|
- **`dev`** — Next.js source code; all development happens here
|
|
|
|
**Always work on the `dev` branch.** Never manually edit files on `master`.
|
|
|
|
## Commands
|
|
|
|
```bash
|
|
npm run dev # Dev server at localhost:3000
|
|
npm run build # Production build into out/ (static export)
|
|
npm run deploy # Build + push out/ to master branch (deploys to GitHub Pages)
|
|
```
|
|
|
|
## Architecture
|
|
|
|
Next.js 16 static-export portfolio site with React 19 and TypeScript.
|
|
|
|
- **`src/app/layout.tsx`** — Root layout; Montserrat + Source Code Pro via next/font, Font Awesome CDN, ThemeProvider
|
|
- **`src/app/page.tsx`** — Home page (Hero, Skills, ProjectCards)
|
|
- **`src/app/homelab/page.tsx`** — Homelab page: at-a-glance, VLAN table, services grid, ADRs, GitHub CTA
|
|
- **`src/app/archive/page.tsx`** — Archive grid with older projects
|
|
- **`src/components/`** — Nav, Footer, Hero, and other UI components
|
|
- **`src/context/ThemeContext.tsx`** — Dark mode provider + useTheme hook, localStorage key `lerko96-dark-mode`
|
|
- **`src/components/ThemeScript.tsx`** — Blocking script injected in `<head>` to prevent FOUC
|
|
- **`src/data/projects.ts`** — All projects typed, featured + archive split
|
|
- **`src/data/services.ts`** — Homelab services with categories
|
|
- **`src/app/globals.css`** — Full design system: colors, fonts, breakpoints, keyframes (Tailwind v4 CSS-first config)
|
|
- **`public/CNAME`** — Custom domain (`www.lerko96.com`); copied into out/ on deploy
|
|
|
|
### Tailwind v4 note
|
|
Tailwind v4 is CSS-first — there is no `tailwind.config.ts`. All custom tokens live in `globals.css` under `@theme {}`. Dark mode variant is defined as `@variant dark (&:where(.dark, .dark *))`.
|
|
|
|
## Coding Standards
|
|
|
|
### Always
|
|
- remove any advertisement of "ai", "claude", "anthropic" from commit messages
|
|
|
|
## Deployment
|
|
|
|
`npm run deploy` runs `predeploy` (build) then `gh-pages -b master -d out`, which force-pushes the `out/` directory contents to the `master` branch. GitHub Pages serves from `master`.
|
|
|
|
`postbuild` writes `out/.nojekyll` to prevent GitHub Pages from ignoring `_next/` asset directories.
|