NaPa Counter
The Ultimate Dose Tracker with premium dark-mode aesthetics
[THE CHALLENGE]
Tracking daily doses or repetitive tasks is usually handled by clunky apps or boring spreadsheets. The goal was to build a tracker that feels as premium, fast, and satisfying to use as a high-end code editor.
[THE SOLUTION]
Developed a highly responsive Vite + React 19 application utilizing Framer Motion for smooth, hardware-accelerated transitions. Implemented strict keyboard listeners for a 'God Mode' navigation experience (Space to tap, Escape to abort) and integrated native Bengali numeral formatting.
[TECHNICAL DEEP DIVE]
Built completely client-side using Tailwind CSS 4 and Shadcn UI components for rapid, accessible styling. State is instantly synced with LocalStorage to prevent accidental data loss on reloads, while dynamic UI elements transition seamlessly from 'Resting Red' to 'Emerald Success'.
// DEVELOPER'S RETROSPECTIVE
"Adding full keyboard support combined with auto-focus made the app feel incredibly fast—proving that web utilities don't need to feel like 'websites'. The feedback loop of typing to count, combined with fluid Framer Motion animations, created an unexpectedly addictive user experience."