JA

Why this site runs on Astro, Vercel and Cloudflare

This site does not run on a server I rent. The only recurring cost is the domain, and it still has a custom domain, HTTPS, a working contact form, inbound mail at contact@, Japanese/English pages and RSS.

I recorded each decision as an ADR while building it. This post is the summary — weighted less toward what I used and more toward what I turned down and why.

Here is what this post covers:

Constraints first

Every decision below is derived from these:

  • The goal is getting contract work. The common case is sending the URL to someone at a company
  • Posts are Markdown. No CMS
  • Four pages (Home / Posts / Work / About) plus post detail
  • English pages get added later. Overseas work is part of the target
  • Updates are infrequent. Prefer “low friction to start writing” over fast builds
  • Only two things move on the page: theme toggle and scroll progress bar

And the constraint that mattered most:

On a solo project, my own time is the only scarce resource.

That axis came before cost.

Why Astro

I compared candidates on one question: how much of the downstream work does this thing do for me? The wider the range covered by built-ins, the closer the site is to done.

Downstream workAstroNext.jsHugo
Typed frontmatterContent Collections + Zod, built inRoll your ownNo type concept
Light/dark code themesShiki dual themes, built inConfigure it yourselfManual for both modes
i18nNative routingHand-rolled in App RouterSupported, idiosyncratic config
RSS / sitemapOfficial integrationssitemap onlyBuilt in
JS outputZero by defaultRuntime includedZero

Two moving parts on the page is no reason to ship a framework runtime on every page. Astro emits no JavaScript by default and lets exactly those two spots become islands.

Why not Next.js

My professional React and Next.js experience transferring directly was the one genuine advantage. I still passed, for two reasons:

  1. The runtime is excessive for a static text site
  2. All four rows above would have to be built by hand

Astro’s template syntax is close to JSX, and React can go inside an island when needed. The switching cost never exceeded those two points.

Why not Hugo

The build speed and single-binary distribution are appealing, but this project explicitly prefers low writing friction over build time, so the headline advantage does not apply. What remains is learning Go templates and living without typed frontmatter.

The question is whether a candidate’s strengths line up with your constraints. General-purpose rankings were not usable input.

Why Vercel

Only two things needed to run server-side:

  1. Contact form submission — the intake for enquiries, and the site’s exit
  2. OG image — since the URL gets pasted into Slack or X, the card preview is effectively the first impression

Both map straight onto the goal. If the form does not work, no enquiry ever arrives. So I picked whichever option made those two easiest.

GitHub Pages is fully static and could do neither, so it was out. Cloudflare Pages was a strong runner-up with a larger bandwidth allowance. I still chose Vercel, prioritising implementation ease over a bandwidth problem I did not have yet.

What comes free

I did not weigh this during selection, but it stood out once I started using it.

CapabilityDetail
CDNServed from edges worldwide. No configuration
HTTPS certificatesIssued automatically when you add a domain. Renewal is automatic too
DDoS mitigationL3 / L4 / L7, automatic on every plan. No configuration
Attack ModeChallenges all traffic during an attack. Free on every plan
WAFThree IP blocks and three custom rules
Preview deploymentsEvery PR gets a production-equivalent URL

The DDoS piece is stated plainly in the docs:

Vercel provides automatic DDoS mitigation for all deployments, regardless of your plan.

Vercel does not charge customers for traffic that gets blocked with DDoS mitigation.

Blocked traffic is not billed. A personal site is unlikely to be attacked, but publishing without the “if this happens I go bankrupt” worry is worth a lot.

Automatic certificate renewal quietly matters too. Running Let’s Encrypt renewal on a cron job, missing a failure, and finding out when the certificate expires is a classic incident that simply cannot happen here.

Preview deployments earned their keep

Open a PR and a URL appears with only that change applied. Things that work locally still break in production, so verifying in a production-equivalent environment before merging paid off more than expected.

It is how I caught a CSP misconfiguration that silently blocked form submissions before it reached production.

Why Cloudflare

The domain is registered with Cloudflare Registrar and DNS lives there too. Three reasons:

1. At-cost pricing, no renewal hike

A domain cannot be changed once you hand it out. It goes on business cards, CVs and every inbound link to old posts, so the horizon is a decade. Plenty of registrars discount the first year and raise it afterwards; Cloudflare states it sells at cost. That lines up directly with holding it long term.

2. Whois privacy included, free

The registrant name shows as DATA REDACTED. When you own a domain as an individual, having this behind a paid add-on adds up.

3. DNS in the same dashboard

Serving happens on Vercel and DNS on Cloudflare, so there are two dashboards — but domain, DNS and mail all sit in one of them.

Email Routing turned out to be free

Mail to contact@yomaru-tech.com forwards to my regular Gmail. Cloudflare Email Routing costs nothing, and it adds the MX, SPF and DKIM records for you.

The traditional answer for a custom-domain address on a personal site was paying for Google Workspace. If you only need to receive, it is free.

The catch: it is receive-only. There is no way to send from contact@, so replies go out from the Gmail address. I accepted that.

Trade-offs I took on

Writing only the upsides would be dishonest, so here is what I gave up:

  • Vercel’s bandwidth allowance is smaller than Cloudflare’s. A post going viral could hit the ceiling
  • Two dashboards. Domain and mail on Cloudflare, deployments on Vercel
  • The domain contains a hyphen (yomaru-tech.com). You have to say “hyphen” out loud, and it gets dropped when written down. Both yomaru.com and yomaru.dev were already taken
  • Astro’s ecosystem is smaller than React’s. Fewer options if I ever need elaborate UI

Read the terms on free plans

I noticed this after launching. Vercel’s Hobby plan is explicit in the docs:

the Hobby plan restricts users to non-commercial, personal use only.

A personal portfolio or blog is not usually a problem, but a site that actively solicits work sits in a grey area. Having the URL on a business card go dark would hurt, so check the terms before you settle onto a free tier.

Writing this straight after praising the free tier is awkward, but relying on a tier without checking its terms is luck, not a good deal, so it belongs here.

Summary

  • Astro — with two moving parts, shipping no JavaScript is the fastest path
  • Vercel — CDN, HTTPS, DDoS mitigation and preview environments, free and with zero configuration
  • Cloudflare — for a domain you hold long term, at-cost pricing and free Whois privacy matter. Inbound mail is free too

What is available on free tiers today would have cost tens of thousands of yen per month a decade ago. Automatic certificate renewal, a global CDN, L7 DDoS mitigation — all of it, unconfigured.

That said, I want to keep the ordering straight: choose it because it fits the constraints, not because it is free. Every decision here was made on “how much of my time does this save” first. Being free was the outcome, not the reason.