From Hugo to Astro: Rebuilding This Site with Claude Design and Claude Code

This site ran on Hugo with the Blowfish theme for about two years. It worked fine. I had a design I wanted to ship, a CV update I kept putting off, and a CodeBuild pipeline that was showing its age. On a Saturday afternoon I opened Claude Code. By evening the site was on Astro, redesigned, and deploying through a rewritten buildspec. This post covers why the migration made sense, who did what, and the small pieces that add up at the end.

Why Astro instead of Hugo#

Hugo is fast and mature. Nothing was broken. The move came from a few frictions that built up. Go templates make component-level composition harder than it needs to be, and I kept forking Blowfish shortcodes to change small visual details. Living inside any theme means every tweak is either a config option the author exposed or an ugly override. Astro gave me a way out. Same static output (fast, cheap to host), but with real components, scoped styles, a content collection system that validates front matter against a schema, and a built-in image pipeline that produces WebP variants and responsive srcset attributes at build time. TypeScript works in front matter and in component scripts. For a small marketing site with a blog, it is a better fit.

The design came from Claude Design#

The visual redesign was not mine. It came from Claude Design. I described the site I wanted (cloud architect and fractional CTO consultancy, editorial typography, dark-mode option, not too corporate) and got back a design handoff bundle: a 953-line HTML prototype with inline CSS, a set of production-ready assets, and a README explaining the design tokens, section anatomy, and interaction details. The kind of deliverable a freelance designer would put together, minus the scheduling and the invoices. The CSS variables it proposed (the --ink, --paper, and --accent palette, the typographic ramp, the spacing scale) are what drive the whole site today. I made a couple of calls on top of that: picked the cyan accent, wrote the About and At-a-Glance copy to match my CV, swapped the picture for a mountain photo. Skeleton and bones, though, are Claude Design’s.

Claude Code did the port#

Claude Code handled turning that prototype into real Astro. It pulled the CSS custom properties into a global token system, broke the section anatomy into nine .astro components (Hero, About, Services, Certifications, At-a-Glance, Writing, ContactCta, Nav, Footer), and wired them to the existing content collections. Theme switching persists through localStorage with a pre-paint inline script, so no flash-of-unstyled-content. It also did the content freshening: extracted data from my CV (a Word document), rewrote the Skills, Past Engagements, and Timeline blocks with my actual roles and clients, swapped details on the About page, and wired in a Cal.com popup embed for the Book-a-call button. The mechanical parts that would have taken me a focused day or two happened in minutes, with me reviewing each chunk instead of typing it.

The hosting architecture#

The site runs on a small, boring AWS stack: S3 for the static files, CloudFront in front for TLS and global edge caching, Route 53 for DNS, and CodeBuild for the build itself, triggered on pushes to main. Nothing fancy, and nothing I need to babysit. Every piece is standard AWS, cheap, and easy to debug when something drifts. The ongoing bill rounds to zero for a personal site.

Rewriting the deploy pipeline#

The old buildspec installed Hugo and synced the output to S3. The new one builds the Astro site, syncs the result with sensible cache headers, and invalidates CloudFront so changes show up at the edge quickly. Total time from push to live is about ninety seconds. For SEO continuity I shipped a tiny redirect stub at the one indexed Hugo URL so inbound links still land where they should, the sitemap moved to /sitemap-index.xml, and the default favicon got replaced by a mountain icon generated with Gemini Nano Banana Pro.

What still needed me#

I made the product calls: which collection name to keep, whether to preserve old URLs or accept some re-indexing friction, which clients to name in the bio, which photo to use, what the accent color should be. I configured AWS for some of the requirements. What Claude Code handled was the fiddly middle: the design port, the pipeline migration, the first pass on the content transformation, the scheduling embed, the favicon, the redirect stub. Each of those used to be an afternoon. Now they are a conversation, and that leaves me with more time for the parts that are not mechanical: what the site says, who it is talking to.