I built a free online toolbox with 260+ tools — here's the tech stack and what I learned

Anirudha Sonwane — Fri, 26 Jun 2026 06:45:15 +0000

Every small task used to mean a new tab. JSON formatter on one site, GST calculator on another, PDF merger somewhere that wanted my email before it would merge two pages. Ads everywhere, slow UIs, and that low-grade worry about uploading a payslip or invoice to a server I do not control. I got tired of juggling twenty bookmarks for work that should take thirty seconds — so I started building one place for all of it.

What ToolReign is

ToolReign is a free online toolbox: 260+ utilities across 15 categories, all running in your browser. Developer tools (JSON formatter, JWT decoder, API client), text utilities, SEO helpers, PDF and image tools, spreadsheets, and a finance section I built with India in mind — GST with CGST/SGST/IGST splits, EMI and SIP calculators, HRA exemption, gratuity, income tax estimates, and more.

The idea is straightforward: open a tool, do the work, leave. No signup wall, no file uploads to a backend, no account to manage. I am Anirudha Sonwane, a Senior Software Engineer at Giant Leap Systems in Pune. ToolReign is a side project I build around my day job — not a pitch deck, just something I wished existed.

The tech stack decisions

Next.js 14 App Router and static export

Each tool lives at its own route under src/app/{category}/{tool-slug}/. That maps cleanly to SEO: one URL, one search intent, one page of metadata. The site exports statically (output: 'export'), so production deployment is uploading an out/ folder to static hosting — no Node server to babysit.

The App Router made this scale. Add a page component, register the slug in tool-registry.json, and the sitemap, category hubs, and search index pick it up automatically. At 260+ tools, hand-maintaining URLs would have broken within a month.

100% client-side — the decision that shaped everything

This was the core architectural bet, and it is also the privacy story: your data never leaves the browser. Finance calculators are plain TypeScript math with useMemo. PDF merge and split use pdf-lib and pdfjs-dist in-tab. Images go through the Canvas API. Audio through the Web Audio API.

The engineering is harder than the marketing. A five-file PDF merge on a mid-range phone can freeze the main thread if you are careless. I had to think about memory when combining multi-megabyte documents, show progress where it matters, and avoid loading entire files when a page-range operation would do. Getting "merge these PDFs" to feel instant without a server was more interesting than wiring another REST endpoint.

The supporting cast

Tailwind CSS and next-themes for light, dark, and system mode — calculators get used late at night more than I expected.
Recharts for finance visualisations: EMI principal-vs-interest donuts, SIP growth curves.
DOMPurify anywhere user-adjacent HTML might render — small surface area, non-negotiable.
Security headers in next.config.js — CSP, HSTS, X-Frame-Options, a tight Permissions-Policy. Static sites still get scanned.
PWA via next-pwa so repeat visitors can install the toolbox like an app.

One scaling problem: metadata without drift

Early on I realised I could not hand-write Open Graph tags for hundreds of tools. Everything funnels through a shared helper:

// src/lib/seo.ts (simplified)
export function buildMetadata({ title, description, path }: {
  title: string
  description: string
  path: string
}): Metadata {
  const canonical = `${SITE.url}${path}`.replace(/([^/])$/, '$1/')
  return {
    title: { default: `${title} | ${SITE.name}`, template: `%s | ${SITE.name}` },
    description,
    keywords: extractKeywords(title, description),
    openGraph: { type: 'website', url: canonical, title, description, locale: 'en_IN' },
    twitter: { card: 'summary_large_image', title, description },
    alternates: { canonical },
  }
}

Each tool page calls buildMetadata() once. Canonical URLs, Twitter cards, and en_IN locale stay consistent. The sitemap reads from the same tool-registry.json, so search indexing and on-site navigation never disagree about what exists.

What surprised me

SEO is half the product. I assumed I would spend ninety percent of my time on calculator logic. Reality: JSON-LD per tool (WebApplication, FAQ schema, HowTo steps), breadcrumb markup, related-tool links, synonym keywords for long-tail queries, collapsible formula explainers on finance pages. Google's AI overviews love "how is EMI calculated?" — a tool site competes on clarity as much as code.

India-specific finance tools punched above their weight. Global EMI calculators are everywhere. Adding GST split logic, HRA exemption rules, and lakh/crore formatting with en-IN locale matched how people actually search here. Locale is not polish — it is a product decision.

Client-side PWAs are more capable than I assumed. Installable shell, offline-friendly caching, no account — it fits the "I just need to convert this PDF" use case better than a bloated web app.

What I would do differently: invest in a stricter component scaffold earlier — shared input toolbars, validation helpers, result placeholders, WhatsApp share buttons, formula explainers — before the finance silo grew past twenty calculators. Copy-paste refactors across similar tools cost more time than the shared abstractions saved later.

What's next

I am continuing down the long tail: more text and developer utilities, deeper finance coverage, and better mobile UX on canvas-heavy tools like handwriting generators. AdSense is on the horizon, but the constraint stays the same — do not interrupt the work surface.

If you try a tool and something feels off, I genuinely want to hear it. Comment here or use the contact form on the site. Broken on Safari? Confusing GST inclusive vs exclusive? Tell me.

Closing

ToolReign started as "one bookmark instead of twenty" and turned into a lesson in static SEO at scale, in-browser media processing, and building for a specific audience without locking everyone else out. It is a side project built after hours in Pune, alongside my work at Giant Leap Systems.

Happy to answer questions about the stack, static export tradeoffs, or how to structure a registry when your tool count stops being cute.

Check it out at toolreign.com — completely free, no account needed.

DEV Community: Anirudha Sonwane