A small team running zero-waste operations at large outdoor events needed a tool that worked reliably in the field — spotty connectivity, hectic conditions, non-technical operators. I designed and built a mobile-friendly web app (Progressive Web App) that continues working without an internet connection and has since become a core operational tool, with the team using it at every event and regularly asking for new features.
Highlights
- Built offline-first architecture using InstantDB for real-time, multi-user data sync that continues working without connectivity, with service-worker–based caching and background sync for images.
- Integrated Leaflet/React-Leaflet for interactive event maps where operators place, move, and track waste stations using predefined symbols across multiple maps per event.
- Developed a custom backup/restore system via Cloudflare Workers and R2 object storage, with scheduled exports and Terraform-managed retention policies to mitigate risks from a young database platform.
- Automated client-facing report generation using Google Slides and Sheets APIs, preserving the ability for key team members to inspect and customize outputs in familiar formats.
- Implemented cleanup mode with a single-tap-per-station UX redesign based on direct field feedback, dramatically improving usability in hectic outdoor conditions.
- Managed the full infrastructure as code with Terraform and SOPS-encrypted secrets; set up GitHub Actions CI/CD for automated deployment and real-time update notifications.
Technology
- React / TypeScript
- Material UI (MUI)
- Leaflet / React-Leaflet
- InstantDB (offline-first real-time database)
- Cloudflare Workers
- Cloudflare R2 (object storage)
- Google Slides / Sheets API
- Terraform
- SOPS (secret management)
- GitHub Actions
- Chart.js · Formik · Yup