🟢 Building2026•Featured Project
Dev Toolbox
A browser extension that brings everyday developer utilities directly into the browser.
ReactTypeScriptViteTailwind CSSChrome Extension API
Gallery
Overview
The goal of Dev Toolbox is to provide a collection of developer utilities inside a browser extension. Instead of opening separate websites for encoding, decoding, formatting, or generating data, developers can access everything from one lightweight popup.
Architecture
- Chrome Extension Manifest V3
- React popup application
- Reusable utility modules
- Feature-based architecture
- Shared UI component library
Challenges
- Designing a compact interface that remains easy to navigate.
- Keeping the extension fast while adding many utilities.
- Creating reusable conversion modules.
Lessons Learned
- Small tools can have a large productivity impact.
- A consistent UI is more valuable than adding dozens of features.
- Shipping early provides better feedback than over-planning.
Roadmap
- JSON formatter
- JWT decoder
- UUID generator
- Base64 encoder and decoder
- Timestamp converter
- Regex tester
- Color converter
- Markdown preview
Tech Stack
ReactTypeScriptViteTailwind CSSChrome Extension API