Notes — Yaya's

Real work, quietly shipped.

A salon site built around a chair, not a template — and why none of its imagery was generated.

The brief

Yaya’s is an Atlanta natural-hair boutique. The site had to book seats, sell gift cards, run an admin Yaya could actually use from her phone between clients, and show the work — without ever looking like a template. The hard requirement underneath all of it: the work shown had to be the real work.

The look

This is where this build deliberately parts from reiahx.io. Nothing here is generated. The before-and-afters are real clients in Yaya’s chair; the headshots are Yaya; the hero is real footage of a palm-roll, encoded down for the web from the original clip. A “transformation” only means something if it actually happened — so a 4:5 crop discipline is written into the codebase to keep every before/after honest. The restraint is the credential.

The build

Claude Code pair-authored this one too — the same quiet stack, scaled up for a working business: Next.js with Server Components, TypeScript, Tailwind, Google Sheets as the backbone Yaya edits from her phone, Zod at every boundary, mock-mode for safe local work. On top of that spine: magic-link admin auth with its token store in Sheets, Stripe gift cards, a Claude-powered chat assistant, PDF generation for business cards and plans, and a Transformations surface with a before/after slider. Architecture decisions are recorded as ADRs so the reasons survive the commit.

What it runs now

A brand-locked public site, an owner-operable admin, gift cards, the Transformations portfolio, and a full SEO/GEO setup so the shop gets found by Google and cited by AI assistants. After launch it got a dedicated hardening pass — security, accessibility, performance — as its own sprint. It compounds quietly: Yaya adds a row in a spreadsheet, the site updates itself.

yayas-shop.com
Screenshot of Yaya's Natural Hair Boutique homepage

The stack

Claude Code
Pair-author of the codebase.
Real client photography & video
All imagery. No generative tools, by design — a transformation only counts if it actually happened.
Next.js · RSC
React Server Components, TypeScript, Tailwind.
Google Sheets
The backbone Yaya edits from her phone. No database; Zod at every boundary; mock-mode for safe local work.
Magic-link admin
Owner auth with its token store in Sheets.
Stripe · Claude · @react-pdf/renderer
Gift cards, a chat assistant, and PDF generation for business cards and plans.
Transformations
A before/after slider over real client work, with a 4:5 crop discipline written into the codebase.
Vercel · ISR · ADRs + CONTEXT.md
Hosting, incremental regeneration, and decisions recorded so the reasons survive the commit.