← zapleo

Appendix · Colophon

How this site is actually made.

A colophon is the page at the back of a book that lists the type, the paper, the printer. Same idea here — the stack, the fonts, the AI in the workflow, the host. So you can audit before you trust.

APPENDIX

Stack

Framework
Next.js 16.2 (App Router, static export)
Language
TypeScript 5.9 (strict)
Styling
Tailwind CSS 4 (oklch native), CSS @theme tokens
Motion
Motion 12 (Framer Motion lineage), GSAP, Lenis smooth scroll
3D moment
react-three-fiber + drei (one scene on /journey)
i18n
next-intl, 4 locales (EN / UK / RU / ID)
Forms
react-hook-form + zod (no form on /contact by default)
Lint + format
Biome (replaces eslint + prettier)
Package manager
pnpm@9

Type

Display
Fraunces (variable: wght · SOFT · WONK · opsz)
Pangram-feel editorial, single-axis serif for cinematic emphasis.
Body
Newsreader (variable opsz)
Designed for long reading at body sizes.
Mono
JetBrains Mono
Eyebrows, year stamps, marginalia, switcher.

Infrastructure

Hosting
Bare nginx on Debian, static files via rsync
CI/CD
GitHub Actions on push to main → build → rsync to /var/www/zapleo.com (~50s end-to-end)
TLS
Cloudflare Origin Cert + edge proxy
Analytics
Cloudflare Web Analytics (cookieless)
Backups
Server-side nightly snapshots, off-site mirror

AI / human split (honest disclosure)

Design system
Drafted with Claude · reviewed and adjusted by Dmitriy
Copy
Co-authored with Claude · facts cross-checked against LinkedIn, GitHub, Clutch, DOU, Tripadvisor public records
Photos / b-roll
Mine. Or labelled stock when used.
Voice in social
AI-augmented per Vibe Coding strategy. Decisions and replies — mine.

Source code & audits