I've been building the fetch-kit ecosystem for about a year - ffetch (a fetch wrapper with resiliency features), chaos-fetch (a network failure testing tool), chaos-proxy (a proxy to inject network chaos), and the chaos arena (to set up different network failure modes). Each tool has its own GitHub repo and README, but there was no single place that answered "what is this, when do I use it, and how does it all fit together"? Someone landing on the ffetch repo had no idea chaos-fetch existed, let alone the arena.
So I built fetchkit.org.
The stack
- Eleventy (v3) for static site generation - Nunjucks templates, fast builds, zero client-side framework overhead
- Tailwind CSS v4 with a custom dark color palette derived from the logo background color
- GitHub Pages for hosting with a custom GitHub Actions workflow that builds on push to main and deploys the dist folder
- Cloudflare for DNS (with A records kept grey/DNS-only - GitHub Pages does its own cert verification and breaks if it sees Cloudflare IPs instead of its own)
- GoatCounter for privacy-friendly analytics
What's on it
Each tool gets its own page with: what it does, code examples, a comparison table (e.g. chaos-fetch vs chaos-proxy), and links to the blog posts I've already written about it. The homepage has a news widget that pulls from my blog's RSS feed filtered by the fetch-kit tag.
The Cloudflare gotcha
Worth calling out: if you host on GitHub Pages with a custom domain and Cloudflare, keep your A records as DNS only (grey cloud), not proxied. GitHub periodically re-verifies that the domain resolves to its own IPs. With Cloudflare proxying on, it sees Cloudflare IPs, marks the domain as misconfigured, and stops serving it. The CNAME for www can be proxied fine - only the apex A records matter.
Source
The site source is at github.com/fetch-kit/fetch-kit.github.io if you want to see the Eleventy + Tailwind v4 setup.
Top comments (0)