utils+

A collection of handy developer tools, hosted at https://utils.plus.

Everything runs locally in the browser: no server-side processing, no third-party requests, and no invasive tracking. Fonts, the editors, the key generators and the Python and JavaScript engines are bundled or served from this site rather than fetched from anyone else, so content blockers have nothing to break — a private key is built in the tab and never leaves it. Each utility keeps its state in the URL fragment, so copying the address bar shares exactly what you see.

Development

Requires the Bun version packageManager names in package.json, and xz on the path — the regional internet registries publish the route origin data bun run data reads in that format and no other.

bun install
bun run dev        # build for development, serve it, and rebuild and reload when src changes
bun run build      # typecheck and build to dist/
bun run preview    # serve dist the way the host does

Testing

bun run test       # format check, typecheck, unit tests, build
bun run unit       # unit tests only
bun run playwright # end-to-end tests, against a fresh build served by `bun run preview` (both run for you)

bun run test is the script and bun test is Bun's own runner, which on its own would pick up the Playwright specs as well; the unit script is what points it at the unit tests and their setup. Neither runs the Playwright specs — run those separately. CI runs both, and installs Chromium for the specs with bunx playwright install --with-deps chromium.

Project layout

• src/utilities/ — a directory per utility: the page named after it holds the components, and the modules beside it hold the parsing, formatting and generating the page reads
• src/utility-registry.ts — the list the router, navbar and welcome page all read; adding a utility is one entry here, its words in page-meta.ts and its article in page-content/
• src/page-meta.ts — the label, title, description and keywords of every page and the groups the utilities are listed under, read by the browser and by the build that writes a document per address and the sitemap
• src/page-content/ — the article under each utility: how it works, examples, common problems, questions, related tools and references, written into the document the build emits and drawn under the tool
• src/page-document.ts — the markup written from those two: each document's head, its structured data, and the body a reader with no script is handed
• src/common/ — shared hooks and helpers
• src/global.css — layout classes shared across utilities
• tests/ — *.test.ts are bun test, *.spec.ts are Playwright
• scripts/ — the build and the server that serves it, and the generators behind bun run data
• conf/ — the tool configuration the package scripts point at: dprint, Playwright, PostCSS and the unit tests' setup file

License

Apache License 2.0