← All projects

String Tools

A privacy-first developer utility for text transformations, naming-style conversions, encoding and decoding, pattern extraction, and secure string generation. Built as a static Next.js app where every operation runs locally in the browser.

Role
Creator / Developer
Period
Open source
Team
Independent build
Stack
Next.js · React · TypeScript · Tailwind CSS · shadcn/ui · Zustand

Problem

Developers constantly need small string operations: converting text into snake_case, decoding a URL value, extracting emails from a pasted log, generating a UUID, or creating a strong temporary password. The usual workflow is scattered across command-line snippets, browser extensions, and ad-heavy web tools.

That workflow has a privacy problem. The text being transformed might contain logs, credentials, customer data, or internal URLs. A useful string tool should be fast enough for daily use while making the safest default obvious: do the work locally and avoid sending pasted content anywhere.

Constraints

  • Local-only processing - All transforms, extractors, and generators must run in the browser with no server calls.
  • Broad utility surface - The tool must cover case conversion, naming conventions, text manipulation, encoding/decoding, pattern extraction, and generation without becoming hard to navigate.
  • Secure generation - Passwords and random strings must use browser cryptography instead of predictable pseudo-random helpers.
  • Shareable state - Tool configurations should be bookmarkable or shareable through URLs without requiring accounts or storage.
  • Static deployment - The app must build cleanly for GitHub Pages, including stable asset paths and static export behavior.

Key decisions

  • Next.js App Router with static export - Next.js provides a structured route model for separate transform and generator categories while still producing a static site suitable for GitHub Pages.
  • Operation shell pattern - Shared operation UI keeps input, output, copy actions, timing feedback, and state handling consistent across tools. Each operation stays focused on its own transformation logic.
  • Client-side operation registry - Transform functions live behind a registry, making it straightforward to add new operations without duplicating page-level wiring.
  • Web Crypto for generation - Secure passwords and random strings use crypto.getRandomValues(), keeping generated values unpredictable and avoiding server-side generation entirely.
  • Zustand for lightweight state - Local UI state remains simple and isolated while allowing operation pages to preserve selected options, results, and shareable configurations.
  • shadcn/ui and Tailwind CSS - The interface uses accessible, composable controls with a responsive layout that works for quick desktop workflows and mobile use.
  • Accessibility checks in the project workflow - Playwright and axe-based tests document the expectation that utility pages remain navigable and usable beyond the happy path.

Outcome

String Tools ships as an open-source, static developer utility at satheez.github.io/string-tools. It covers text case transformations, naming-style conversions, manipulation helpers, Base64/URL/HTML encoding and decoding, email/URL/phone/UUID extraction, and UUID/NanoID/random string/password generation.

The architectural payoff is simple: pasted text never needs to leave the browser. The project remains easy to extend because new operations follow the same registry and shell pattern, and deployment stays low-maintenance through GitHub Pages.

What I’d do differently

The current README describes the intended architecture well, but the implementation would benefit from clearer public documentation for adding operations, including examples that show how operation metadata, UI controls, tests, and static routes fit together. That would make outside contributions easier without expanding the runtime surface.