DEV Community: chenghui wu

15 tiny developer annoyances I stopped tolerating this year (and the browser tools that fixed them)

chenghui wu — Fri, 24 Jul 2026 02:56:17 +0000

You know that specific flavor of dev annoyance — the tiny task that shouldn't exist, appears three times a week, and steals five minutes each time?

"This JWT looks wrong somehow."
"The API returned 418. Cool. What?"
"I need to strip EXIF before I post this photo."
"Merge these 8 PDFs into one, please."
"How much will this GPT-4o batch actually cost me?"

Individually, none of them are a crisis. Together, they're death by a thousand paper cuts. Over the last year I got tired of it and started building a tool for every single one — DevKits.vip. It's now 160+ tools, everything runs locally in your browser, no accounts, no uploads.

This post isn't the tool list. It's the 15 scenarios. Every dev has hit at least half of these. Let's go.

Ground rules

100% local. Every operation runs in your browser. Your JWTs, private keys, PDFs, and photos never touch a server.
No accounts, no tracking of your inputs. Analytics counts page views. That's it.
Free forever. No trial, no upgrade nag.

If you're the kind of person who reflexively pastes secrets into random online tools, I hope this post at least gives you a safer place to do it.

1. "A coworker sent me a JWT and something's off"

The user says login is broken. You get the JWT. Now what?

Header wrong? Payload wrong? Signature wrong?
Expired? Not-yet-valid? Issued in the future because someone's server clock is wild?
The classic — alg: "none" because someone's library trusted the header?

Old flow: paste into jwt.io, squint at the payload, wonder if the signature was actually checked, dig up the key from a Slack thread from 2 months ago.

New flow: JWT Decoder shows the header + payload immediately. If you have the signing key (secret or public PEM/JWK), JWT Verifier takes it and gives you a definitive pass/fail — plus per-claim time status (exp, nbf, iat).

It handles all 12 RFC 7518 algorithms: HS256/384/512, RS256/384/512, PS256/384/512, ES256/384/512. alg: none is explicitly rejected as invalid.

Companion tools when you're on the producing side:

JWT Generator — signs with any of the 12 algorithms
JWKS Generator — build a /.well-known/jwks.json from your public keys
Public Key Extractor — derive the public key from a private one (found out your JWKS is out of date? this is faster than regenerating)

2. "Two API responses look almost identical, but which field actually changed?"

You're regression-testing an API. Git-style diff shows you 40 red-green lines — but 39 of them are because your JSON library sorted keys differently.

JSON Diff does a structural comparison. Key order doesn't matter. It tells you: "field user.email changed from alice@a.com to alice@b.com. Nothing else."

Same idea for YAML Diff (Kubernetes / Helm values), XML Diff, and character-level Text Diff with syntax-highlighted Code Diff for actual source code.

Bonus: all 5 diff tools now generate shareable URLs. Content is compressed with deflate-raw into the URL hash — nothing sent to any server, but the link works cross-machine.

3. "Postman gave me a cURL. I need it in Go."

Someone drops a curl -X POST -H 'Authorization: Bearer …' in Slack. You need it as production code by end of day.

cURL Converter — paste the cURL, click a language tab: Python / Node / Go / PHP / Ruby / Java. Ready to compile. Handles multi-line curls, multiple headers, JSON bodies, basic auth, everything.

4. "The API returned 418. Cool. What?"

You know 200, 404, 500. But 418? 451? 511? And the perennial code-review argument: 401 vs 403?

HTTP Status Codes reference — 60+ codes, each on its own page, with the RFC citation, "when to use it," "how clients react to it," and internal comparisons. The 301/302/307/308 comparison and the 401 vs 403 breakdown are worth bookmarking alone.

Same treatment for HTTP Headers (45 headers, real-world examples) and MIME Types (50+, one page each).

5. "I need a regex for X. Not writing it from scratch."

Every regex is a bug waiting to happen. The email one especially.

Regex Cookbook — 30 tested patterns (email, URL, IPv4, IPv6, UUID, hex color, phone, credit card, ISO date, semver, …) each with copy-ready JavaScript / Python / Go / Java snippets. These are tested. You can steal them.
Regex Tester — paste your pattern + test input, get live match highlighting and named-group output.
Regex Replace — with backreferences and a live preview so you don't have to run your dry-run 12 times.
Visual Regex Explainer — hover any part of a pattern to see what it does. Great for maintaining regex written by past-you.

6. "My CSV has 47 columns and 'Smith, John' in one of them and I need it as JSON"

The "convert this data blob before I can even do real work" tax. Every non-trivial CSV has quoted commas that break every naïve parser.

CSV → JSON — proper RFC 4180 quoting
JSON → CSV — with the reverse escaping
YAML → JSON / JSON → YAML
XML → JSON / JSON → XML

Paste, click, done.

7. "I have a JSON payload and I want a typed interface for it"

Stripe webhook, Shopify order, whatever. You need type Order = { … } and you'd rather not hand-write 47 field declarations.

All handle nested objects, arrays, optional fields, null unions, and preserve field naming casing.

8. "The LLM returned broken JSON again"

Every RAG / agent developer has hit this. The response comes wrapped in `json, contains trailing commas, uses True/False/None because the model was trained on Python, single-quotes some fields. JSON.parse() throws. You retry, which burns tokens.

JSON Repair fixes all of the above, deterministically, in one pass. It handles:

Trailing commas
Single quotes instead of double
Unquoted object keys
Python-style True / False / None
Markdown code fences
Missing closing brackets (best-effort recovery)

Paste the broken output, get valid JSON.

Related: JSON Validator gives you the exact line/column of every syntax error if you'd rather fix by hand.

9. "Wait — does this photo I'm about to post leak my home address?"

Every JPG straight off a phone can carry: GPS coordinates (to 5 meters), device serial number, timestamp, camera settings, sometimes even the WiFi network name.

EXIF Viewer — drag any photo, see what's in there. Includes a map pin if GPS is present.
EXIF Remover — strip all metadata losslessly (no re-encoding, no quality loss).

The file never leaves your browser. This is the one tool I'd tell a non-dev friend to use before posting anything to social media.

10. "Client sent 8 PDFs. Needs to be one."

The most-googled PDF task on Earth. And 90% of the "free" tools online want to upload your (probably confidential) client documents to their server.

Merge PDF — drag, reorder, merge. Nothing uploaded.
Split PDF — range, chunks, or one file per page
Remove PDF Pages — with "1, 3-5, last" syntax
Rotate PDF — whole doc or range
PDF Text Extractor — proper CJK support (many extractors mangle Chinese/Japanese/Korean)

11. "I need a favicon set for a new project"

12 sizes, a manifest.webmanifest, and the HTML snippet. Every time.

Favicon Generator — drop one square image, get a ZIP with every size (16 / 32 / 180 / 192 / 512 / …), the manifest, and the exact <link> HTML to paste into <head>.
SVG Optimizer — run your logo through SVGO in your browser before you rasterize it.
PNG → ICO — the "just the .ico please" case.

12. "Cron expression `/15 9-17 * 1-5` — when does that fire next?"

Cron syntax reads like APL. And you always, always want to see the next 5 fire times before pushing.

Cron Parser — paste any expression, get plain English + the next N runs
Cron Generator — visual builder if you'd rather not type

13. "Standup at 3pm JST. I'm in São Paulo. When?"

Distributed teams. DST edge cases silently ruin calendar invites twice a year.

Timezone Converter — DST-aware, any IANA zone, multi-column display
Timestamp Converter — Unix epoch ↔ human, in every format ever
ISO 8601 Duration parser — for parsing PT2H30M out of an API response

14. "How much will this GPT-4o batch job actually cost me?"

Blind estimate = surprise invoice. Vendor pricing pages are painful to compare.

Token Counter — estimates for GPT-3.5/4/4o, Claude, Gemini
AI Cost Calculator — 20+ models, daily-refreshed pricing via a cron, side-by-side comparison, cache / batch / prompt-caching discounts factored in
Text Chunker — character / word / token-based splits for RAG, shows per-chunk token counts
Cosine Similarity — pair mode + N×N matrix; useful for debugging why your RAG returned the wrong chunk

15. "How strong is my password, really?"

Not "it has an uppercase letter and a number" strong — actually strong. Under a real attacker's compute budget.

Password Strength Checker gives you:

Entropy in bits (the actual math, not a color bar)
Crack time under 4 attack models:
- Online, throttled (login form with rate limits): 100 tries/sec
- Online, unthrottled (broken rate limit): 10k tries/sec
- Offline, GPU on a fast hash: 10 billion tries/sec
- Offline, GPU on bcrypt: 10k tries/sec
Structural findings: dictionary words, keyboard sequences (qwerty, 1234), repeats, common patterns
Optional HIBP k-anonymity lookup — checks Have I Been Pwned without ever sending your password. Only the first 5 chars of a SHA-1 hash go over the wire.

Fun exercise: try Summer2024!, correct horse battery staple, and a 32-char random string. The gap between them is educational.

Related for the "I need a secret NOW" case:

Password Generator — customizable alphabet, target entropy
UUID v7 Generator — time-ordered UUIDs for DB primary keys (RFC 9562)
RSA Key Pair Generator / ECDSA Key Pair Generator — full PEM / JWK / DER output for JWT signing

Bonus: everything is discussable

Every tool page has an in-page Comments button in its hero — expandable thread pinned to that tool. There's also a global Community Board across all tools.

No signup. Nickname auto-suggests from your rough geo (with your IP masked). Report / mod tools exist for spam.

What's the catch?

Honestly, none. It's a static Next.js site on Vercel. Cost to run: less than one coffee a month. There's no VC, no upsell, no email capture. I built it for me and it turned out other devs wanted it too.

If you find it useful:

Bookmark devkits.vip — it's a fast keyboard target when you need "that one converter"
Star / follow if I ever ship a GitHub repo (thinking about it)
Subscribe to the RSS feed for new releases (we ship weekly)
Something missing? Ping me on the community board.

Tech stack (for the curious)

Next.js 15 App Router + React 19 + Tailwind 3
All crypto via the browser's built-in Web Crypto API — no crypto-js, no jose, no node-forge. Everything is native subtle.generateKey, subtle.sign, subtle.verify.
PDFs via pdf-lib (write) + pdfjs-dist (read), including a hack to make text extraction work correctly on CJK PDFs
Regex visualizer built from scratch (parsing the pattern into an AST, no external lib)
Diff algorithm custom — Myers diff for text, structural walk for JSON/YAML/XML
Zero server-side data processing. The comment board is the only thing that hits a DB (Neon Postgres, and it only ever stores comment content — never your tool inputs).
Vercel for hosting; a daily cron submits the sitemap to IndexNow so Bing / Yandex see new tools within a day

Questions I get

"Why not use crypto-js / jose / node-forge?"
Every one of those is 100-400 KB gzipped. The browser has all of it built in, at zero bundle cost, running native code. There's no reason to ship a library that reimplements what your runtime already does — unless you need something the platform genuinely lacks (like RFC 6979 deterministic ECDSA, which we don't).

"How do you make money?"
I don't, yet. It costs less than a coffee to run. If it ever becomes expensive I'll add non-tracking ads or open sponsorships. No auth wall, no premium tier. Ever. The whole point is that these tools should exist without a login form.

"Is the source open?"
Not right now. I'm considering it. The concern is duplicate content — GitHub repos with heavy READMEs sometimes outrank their own product sites, which would be a weird outcome. I might open just the tool implementations without the marketing pages.

"Can I self-host?"
Not currently, but it's a plain Next.js app with no backend beyond a Postgres comments table — nothing exotic. If enough people ask, I'll write a self-host guide.

If you got this far, a share means a lot. Which of these annoyances did you last hit? Drop it in the comments — I'll add tools for the ones I don't cover yet.

— Built and maintained by one person, publicly, in a browser. If you're building something similar, I'd love to see it.

I built 162 dev tools that never upload your data. Here's what I learned

chenghui wu — Wed, 22 Jul 2026 07:15:18 +0000

The problem with 90% of "online dev tools"

You paste a JWT into a random site to decode it. You paste JSON into another one to format it. You paste a private key into a third to extract the public half.

Every one of those pastes is a leak. Your token, your JSON, your key — they hit someone else's server, get logged, and sometimes get sold.

For sensitive stuff, most of us just skip online tools and open a REPL. But you don't want to python -c "import base64; ..." for the 40th time this week either.

I got tired of the tradeoff. So I built devkits.vip — a set of 162 developer tools, all running entirely in the browser. Nothing is uploaded. No crypto-js dependency. No jsrsasign. No node-forge. Just the browser's native Web Crypto API doing the heavy lifting.

The whole point: curl -sD - https://devkits.vip/tools/jwt-verifier > /dev/null followed by network-panel-verification shows zero outbound requests when you actually use it. Try it.

The numbers


Total tools	162
Categories	11
Interactive visualizers	4
Reference pages (MIME / HTTP / regex / ASCII / status codes …)	~495
Data uploaded during typical use	0 bytes
Uses of `crypto-js` / `jsrsasign` / `node-forge` in package.json	0
JWT algorithms supported	12 (HS/RS/PS/ES × 256/384/512)
PBKDF2 iterations for AES	200,000

That last point is the whole thesis: everything is done with the browser's own primitives. If your browser can't do it, we don't ship it.

Five things that ended up being interesting to build

1. A JWT tool that supports every algorithm in RFC 7518

Most "JWT decoder" sites just base64-decode and hand-wave the signature. We do the actual verification, for the entire RFC 7518 algorithm family:

HS256 / HS384 / HS512 — HMAC with a shared secret
RS256 / RS384 / RS512 — RSASSA-PKCS1-v1_5 with an RSA public key
PS256 / PS384 / PS512 — RSA-PSS (modern padding) with an RSA public key
ES256 / ES384 / ES512 — ECDSA with a P-256, P-384, or P-521 public key

Paste a JWT and a public key (PEM or JWK), and you get a real signature check. The tool also flags time claims (exp / nbf / iat) and explicitly rejects alg: "none" — that classic JWT vulnerability where an attacker strips the signature and hopes the verifier accepts it.

All twelve algorithms are wired straight into crypto.subtle.sign / crypto.subtle.verify. Zero JWT libraries in package.json.

2. RSA & ECDSA key generation, without a single crypto library

The whole asymmetric-keys.ts module is 150 lines. It generates a key pair via crypto.subtle.generateKey, exports the private key as PKCS#8, the public key as SPKI, and both as JWK — all through browser APIs.

Output formats I actually needed:

PEM (PKCS#8 for private, SPKI for public) — for OpenSSL, Node, Go, Java, Python cryptography
JWK — for JWT libraries, browser Web Crypto import, JWKS endpoints
DER — hex or base64, for low-level inspection

There's also a companion "Public Key Extractor": paste a private key, get the matching public key. Useful when you inherit a .pem file with no matching .pub, or when you're about to publish a JWKS endpoint and only have the signing key on hand.

3. Regex Visualizer — the tool I wish I had in college

Regex is dense. When someone shows me ^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$ I want to see it decomposed, not stare at a wall of characters.

The Regex Visualizer at /visualize/regex breaks any pattern into colored tokens with plain-English explanations, and shows live match highlighting against your test string. It's less "tool," more "textbook you can play with."

4. A fake-data generator that ships as ~5KB of word lists

Every dev needs 10 fake users as CSV at some point. The usual workflow is npm install faker, write a script, run it, delete. That's fine — but if you've already got a browser tab open, an online generator wins.

The problem: most online generators are backend calls (privacy leak) or bundle faker.js (~500KB gzipped).

I inlined ~50 items per category as plain string arrays. Total: about 5KB. That's enough entropy to look real for 100 rows of users. Combined with a seeded PRNG (mulberry32), you get reproducible output — same seed = same rows, byte for byte.

25+ field types, 5 output formats:

JSON array
JSONL / JSON Lines
CSV (proper quoting for commas & newlines)
SQL INSERT statements with configurable table name
TypeScript type Row = { ... } + a typed array literal

5. Password strength check that never uploads the password

Every "how strong is my password" site is a security joke: you paste your actual password into their form. Even if they don't log it, they could.

We do the entropy math locally — character-class analysis, keyboard-sequence detection, repeated-pattern detection, dictionary check — and estimate crack time under four realistic attack scenarios:

Online, throttled (10 tries/sec)
Online, no throttling (100 tries/sec)
Offline fast hash — GPU cluster on SHA-1 (10 billion tries/sec)
Offline slow hash — bcrypt cost 10 (10k tries/sec)

There's also an optional breach check against Have I Been Pwned, using their k-anonymity API. Only the first 5 hex characters of the SHA-1 hash are sent (matches ~450 hashes on average). Your actual password never touches the network, even for the breach lookup.

The rest of the toolkit (in ~10 seconds)

Rather than list all 162, here's the vibe per category:

JSON (12) — formatter, diff, repair (fixes LLM output — trailing commas, unquoted keys, python-style True/False), JSONPath tester, schema generator (Draft 2020-12 + OpenAI function-calling + Anthropic tool_use schemas), to-TS / to-Go / to-Rust / to-Python / to-C# / to-PHP / to-Java, flatten, minifier, escape, validator, sort, XML↔JSON, YAML↔JSON, CSV↔JSON
Encoding (9) — base64 / base32 / base58 (Bitcoin + Solana + IPFS CID v0) / URL / HTML / hex / punycode / rot13 / unicode escape
Security (20) — everything above + AES (GCM/CBC, 128/192/256, PBKDF2 200k iterations, self-describing ciphertext), bcrypt, HMAC, hash generator (MD5/SHA-1/SHA-256/SHA-512 with streaming for multi-GB files), JWKS generator (RFC 7517, auto SHA-256 thumbprint kid per RFC 7638)
AI & LLM (4) — cost calculator (live pricing for GPT / Claude / Gemini / DeepSeek — refreshed daily by cron), token counter, RAG text chunker (recursive / paragraph / sentence / fixed strategies), cosine similarity (pair mode + N×N matrix)
Converters (21) — cURL to Python/Node/Go/PHP/Java, number bases (BigInt-backed), unit converters (data size, bandwidth, Bitcoin, Ethereum, dates)
Web (17) — CIDR calculator, CSS visual generators (Grid, Flexbox, Box Shadow, Border Radius, cubic-bezier, text-shadow, glassmorphism, gradient), regex tester + replace, user-agent parser, meta tag preview (Google + Facebook + Twitter + LinkedIn cards), QR generator + reader
PDF (10) — extract text (with CJK support — proper cmaps + geometric reading order, not pdf.js's hasEOL guesswork), merge, split, remove pages, rotate, password remover, metadata viewer, images↔PDF
Image (19) — compressor (with target-KB binary-search mode — kills the "just under 2MB please" pain), EXIF viewer + lossless remover, format converters, resizer, cropper, favicon generator (one image → full ZIP with .ico + PNGs + apple-touch + manifest + HTML snippet), SVG optimizer (full SVGO in browser), image diff (pixelmatch)
Text (28) — diff (with syntax highlighting for 14 languages, zero external highlight libs — I wrote a 150-line tokenizer), case converter, sort, dedup, word/char/line counter, markdown-to-HTML with the works
Generators (14) — password, UUID v4 + v7, NanoID, ULID, KSUID, CUID2, Snowflake ID, fake data, lorem, random number / string / picker / shuffler
Time & Date (8) — timestamp converter, timezone converter with DST, cron generator + parser, age calculator, date diff, working days with holiday support, ISO 8601 duration

The 495 reference pages nobody asked for (but Google loves)

Some of my favorite dev-time browser habits:

"quick, what's the MIME type for .mjs?"
"what does HTTP Strict-Transport-Security actually do?"
"give me a regex that matches an ISO 8601 date"

The answer to each is curl or Wikipedia away, but that's 3 tabs and 20 seconds. I inlined all of it as static pages, one URL per entity:

51 MIME type pages at /mime-types/*
46 HTTP status code pages at /tools/http-status-codes/*
48 HTTP header pages at /http-headers/*
30 regex cookbook patterns at /regex-cookbook/* — each with runnable JS, Python, Go, and Java snippets
256 ASCII/Latin-1 character pages at /ascii/* — every character 0–255 gets its own page with hex, binary, HTML entity, URL encoding, and UTF-8 bytes
22 seasonal "days until X" pages at /tools/days-until/*

They're all static-rendered at build time by Next.js and served from the edge. This started as an SEO experiment but it also became my personal quick-reference — I use /http-headers/strict-transport-security more than the MDN version because it's faster.

The tech stack

Deliberately boring. Nothing to justify.

Next.js 15.1.6 on the App Router
React 19
TypeScript 5.7 in strict mode
Tailwind CSS 3.4
Deployed on Vercel (SSG + edge CDN + analytics + speed insights)
Neon Postgres — used only for the comment board (/messages), because that one thing does need persistence. Every other tool is 100% client-side.
Web Crypto API for all crypto — JWT signing, AES, RSA, ECDSA, HMAC, hashing, PBKDF2. No crypto-js, no jsrsasign, no node-forge. Not a single crypto package in package.json.
pdf-lib + pdfjs-dist for PDF read/write
Canvas API + exifr + piexifjs + pixelmatch + svgo + jsqr + qrcode for imaging

Static-rendered pages share ~103 KB of JS. Every tool page loads its heavy deps (svgo, pdf-lib, pdfjs, jszip, exifr, pixelmatch) via await import() inside the operation handler, not at module top — so opening the JSON formatter doesn't pull down PDF rendering code.

How it grew: 16 releases in a few weeks

The project is open in the sense that every release is public and documented. There's a Changelog with 16 releases so far, and an RSS feed if you want the drip.

Recent shipments:

Image toolkit — 19 privacy-first image tools in one drop
PDF toolkit — 8 tools with CJK support, geometric reading order (not pdf.js's line-based guessing)
Security wave — RSA + ECDSA key generators, encrypt/decrypt, sign/verify, JWKS, public-key extractor, JWT verifier — all Web Crypto, no libraries
AI toolkit — cost calculator with live pricing, token counter, RAG chunker, cosine similarity
CSS layout wave — Flexbox + Grid + Box Shadow + Border Radius + cubic-bezier + text-shadow + glassmorphism generators, all with Tailwind output

Try it

Site: devkits.vip
Any tool page has a comment box at the bottom for feedback / bug reports
Feature requests: community board

I'd genuinely love to know what your paste-into-random-site-anyway workflow is — that's the next tool I want to build.

If you want to hear about new tools, subscribe to the changelog RSS: https://devkits.vip/changelog/feed.xml.

Cover image is auto-generated by the site's /api/og endpoint. All screenshots in this post are real screenshots of the live site — no mockups.

I built 31 developer tools in a weekend — here's what I learned

chenghui wu — Sun, 19 Jul 2026 08:08:27 +0000

Every time I want to format a JSON blob, decode a JWT, or convert a Unix timestamp, I end up on a different random site — each covered in ads, popups, and "click here to install our extension" banners. Half of them upload my data to their server for no reason.

So this weekend I built DevKits — a single site with 31 developer tools that all run 100% in the browser. No uploads, no accounts, no tracking.

What's in it

Right now, 31 tools across 9 categories:

JSON: formatter, validator, JSONPath tester
Converters: JSON ↔ TypeScript / Go / YAML / CSV / XML
Encoding: Base64, URL, HTML entities, image → data URL
Security: JWT decoder, MD5/SHA-256/SHA-512, password generator
Text: regex tester, diff, case converter, word counter, Lorem Ipsum
Web: color converter, user-agent parser
Time: Unix timestamp, cron expression parser
AI: OpenAI/Claude/Gemini token counter
Formatting: SQL, XML, Markdown → HTML

Live at devkits.vip. Open source? Not yet, but the whole project is deployable to Vercel in ~2 minutes.

Why not just use `it-tools.tech` or `smallpdf` or …?

Fair question. Existing sites have some (or all) of these problems:

Bloat. Loading 500KB of JS to format 200 characters of JSON.
Ads. Layout shifts on every visit.
Privacy. Some upload your input to a backend to "process" it — a red flag when your input is a JWT or an API response.
Cluttered UX. "Please sign in to save your favorite tools." No thanks.

DevKits does the opposite:

Every First Load JS is under 130KB. Most pages are 105–115KB.
Zero ads, zero cookies, zero cross-site tracking.
Everything runs client-side. Even the MD5 implementation, the tokenizer, the cron parser — all pure functions in your browser.
Every tool page is a single URL you can bookmark.

Tech stack

Next.js 15 with the App Router
TypeScript (strict mode)
Tailwind CSS (with @tailwindcss/typography for the Markdown preview)
Vercel for hosting

I picked Next.js specifically because:

SSG is a first-class citizen. All 41 pages are pre-rendered at build time. No cold starts.
The metadata API is a joy. Per-page title, description, canonical, OpenGraph, and JSON-LD structured data — all just typed objects.
File-based routing scales beautifully. Adding a new tool is: (1) one entry in tools.ts, (2) one page.tsx, (3) one client component. The sitemap, homepage listing, and "related tools" links update automatically.

The tool registry pattern (my favorite part)

The whole site is driven by a single tools.ts config file:

export interface Tool {
  slug: string;
  title: string;
  shortName: string;
  description: string;
  category: ToolCategory;
  keywords: string[];
  faq: { question: string; answer: string }[];
}

export const tools: Tool[] = [
  {
    slug: "json-formatter",
    title: "JSON Formatter & Validator",
    shortName: "JSON Formatter",
    description: "Format, beautify, and validate JSON online. Free, fast, and 100% local...",
    category: "json",
    keywords: ["json formatter", "json beautifier", "json validator"],
    faq: [
      { question: "Is my data uploaded?", answer: "No..." },
      // ...
    ],
  },
  // 30 more tools...
];

From this single array, four things are auto-generated:

sitemap.xml — every tool becomes a URL entry
Homepage listing — grouped by category
Per-page metadata — title / description / canonical / OG / Twitter card
JSON-LD structured data — SoftwareApplication + FAQPage schema for rich Google search results

The "related tools" section on each page is also just tools.filter(t => t.slug !== current.slug).slice(0, 6). So internal linking is automatic.

Adding a new tool takes about 20 minutes.

The token counter surprised me

The AI Token Counter (for GPT-4o / Claude / Gemini) was the trickiest. Real tokenization requires shipping ~1MB of tokenizer vocabulary. Way too heavy for a "