Loading page...Загружаем страницу...正在加载页面...
AtlasRepo

I built a free browser-based image & utility toolkit — here's what I learned

Description and use

ToolZip is a set of 18 browser‑only tools that provide privacy‑first image, code, and 3D file processing.

Problem

Clients needed to compress images but free online tools risked uploading files to unknown servers.

Outcome

ToolZip delivers a privacy‑first, browser‑only image and utility toolkit, overcoming challenges like EAN‑13 barcode rendering and 3D viewer stability, and plans to expand with lazy loading and server‑side generation.

Workflow

  • 1. Built a Next.js 14 app with Vercel deployment.
  • 2. Implemented image tools using browser-image-compression, heic2any, and Canvas API.
  • 3. Added developer tools (JSON formatter, URL encoder/decoder, Base64, timestamp, color converter).
  • 4. Created utilities (QR/barcode generator, password generator, special characters tool, 3D viewer).
  • 5. Solved EAN‑13 barcode rendering by extracting glyphs and re‑rendering digits as SVG text.
  • 6. Fixed 3D viewer by switching Three.js from CDN to npm import and handling BVH scaling correctly.
  • 7. Planned lazy loading of tool components and server‑side generation for complex outputs.
  • 8. Tested with real files and expanded to more formats.
  • 9. Launched and monitored traffic and SEO.
  • 10. Gathered feedback for future features.

Evidence

ToolZip currently has 18 tools across several categories

Source

The library I used (bwip-js) has a known bug where enabling includetext: true causes the text digits to overlap with the bars

Source

I initially loaded Three.js via CDN and referenced it as window.THREE. This caused intermittent failures

Source

  • Record date: 2026-09-05T18:22:48.273Z