zachy.cc — v3
Third pass at the personal site. Astro + the Cloudflare adapter (matches where v2 is hosted). Calm single-column layout, serif body / mono labels, light + dark following the OS with a manual toggle.
Stack
- Astro 7,
@astrojs/cloudflareadapter (mostly static; one on-demand route) - Self-hosted fonts: Newsreader (body), JetBrains Mono (labels/meta), Unbounded (wordmark)
- No UI framework, minimal client JS
Layout
src/
data/site.ts all copy lives here — bio, work, values, links, buttons
layouts/Base.astro <head>, top bar, footer, theme toggle (no-flash script)
components/
Music.astro "now playing" + "on repeat" shells
CopyEmail.astro click-to-copy with a little tooltip
Webrings.astro hotline + online webrings
Buttons.astro 88x31 wall — images in public/badges/
scripts/music.ts hydrates the music sections from /api/spotify.json
pages/
index.astro
projects.astro placeholder list — swap in real projects
notes/ content collection (src/content/notes/*.md)
api/spotify.json.ts Spotify Web API proxy (on-demand)
Editing
- Text:
src/data/site.ts. - Notes: drop a
.mdinsrc/content/notes/withtitle/date/summary. - Buttons: add to
buttonsinsite.tsand put the gif inpublic/badges/.
Spotify (optional)
now playing / top tracks need three env vars — see .dev.vars.example.
Without them the sections stay hidden and everything else works.
Add ?mockmusic to any URL to preview those sections with fake data.
Commands
npm run dev # localhost:4321
npm run build
npm run preview # wrangler, runs the built worker