So, I wanted to build this thing called 2agenda. I was the class P.I.O. (Public Information Officer) and let me tell you, posting assignments on Messenger is absolute chaos. People chat, links get lost, and then everyone misses deadlines. So I thought, Why not make a dedicated app for this? But internet is not always present in concrete classrooms, and sometimes it just dies. So it had to work offline.
Honestly, when I started, I didn't even know how to properly execute an offline-first application. I just wanted to solve our section's problem. I used React 19 and Vite because they are super fast, with Tailwind CSS for clean styling.
How I Made It Work Offline
For the offline part, I used service workers with cache-first lifecycle rules. All critical UI bundles and icons are cached directly on the student's device on their first visit.
When internet connectivity drops, 2agenda saves all task completions, checkmarks, and schedule edits directly inside the browser's IndexedDB. Once connection returns, the Service Worker queue automatically pushes all updates to Firebase Firestore in the background.
The Outcome
It actually cut our section's missed homework rates significantly throughout the semesters! I'm super proud of it, because building software that immediately solves an everyday physical friction standardizes what I want to build going forward.