Claude Showcase
A portfolio of sites built with Claude. Next.js (App Router), Tailwind v4, shadcn/ui, Aceternity UI.
pnpm dev # http://localhost:3000
pnpm build
pnpm lint
pnpm test
pnpm sync # refresh GitHub activity once
Structure
src/app: routing only ((site) public pages, (payload) admin and API)src/features/showcase: site cards and grid (components/, data/)src/components/ui: vendored shadcn / Aceternity components (lint-ignored)
Content is placeholder data in src/features/showcase/data/sites.ts; getSites() is the seam the CMS will replace.
Content management
Payload CMS runs in this app. Admin at /admin; domain model in docs/domains.md.
createdb claude_showcase # once, local Postgres
cp .env.example .env.local # set PAYLOAD_SECRET
pnpm payload migrate # create tables
pnpm seed # optional placeholder works
pnpm dev # then open /admin and create the first editor
Cover art
Covers are generated illustrations, one per project, in design/covers/ (SVG source and 1600x1000 PNG).
node design/covers/build.mjs regenerates them; pnpm covers also uploads them and sets each matching
work's cover in the connected database. In production, upload the PNGs through /admin instead.
Moving content between databases
scripts/content-export.ts writes content.json plus media files from the connected database (read-only);
scripts/content-import.ts loads them into another database, matching by slug/title so it is safe to re-run.
The import prints the target host and refuses to run unless CONFIRM_HOST equals it.
Migrations
Create them with pnpm migrate:create <name>, not payload migrate:create directly. The Vercel Blob plugin
adds a column to media only when it is enabled (a token is set), so the script sets a dummy token to make the
generated migration match production.
