Safii

Your voice. A cleaner neighborhood.

Comment

Inspiration

The inspiration for Safii came from observing everyday public spaces — streets, parks, and neighborhoods — where waste and infrastructure issues often go unnoticed or unreported. I wanted to build something that bridges the gap between civic responsibility and technology, giving every citizen a voice in the cleanliness and upkeep of their environment. The idea struck me when one day I saw that the landslide that was caused during the monsoon 2 months ago was not cleaned up yet and when I spoke to my neighbors about it, they mentioned that the municipality must have forgotten about it. That's when I realized there is a gap between the citizens and the government that needs to be bridged.

Seeing how difficult it is to file complaints through government portals (often clunky or inaccessible), I set out to build a platform that is:

  • Simple and intuitive for users
  • Transparent and accountable in tracking progress
  • Useful for both citizens and municipal teams

What it does

Safii is a civic-focused web application designed to empower communities to report, track, and resolve public sanitation and environmental issues. Whether it's waste accumulation, broken drains, illegal dumping, landslides, road repairs or pollution, Safii provides a platform for citizens to raise concerns and for local authorities to take action — transparently and efficiently.

How we built it

I built Safii using Bolt.new, which provided a fast and developer-friendly environment to create full-stack apps. Bolt helped me streamline everything from environment setup to deployment. The stack includes:

  • Frontend: Built with React for a responsive and interactive user experience. I focused on building a mobile-friendly UI using modern CSS techniques (Flexbox, Grid, animations).
  • Backend: Powered by Node.js, managing API routes and business logic.
  • Database: Supabase, which handled authentication, database storage, and file uploads. I leveraged its Postgres core and row-level security to ensure only authorized users can access or modify data.
  • Authentication: Users can report issues with or without logging in, but logged-in users can track their reports and get status updates.
  • Image Uploading: Users can upload images with reports, making it easier for authorities to assess issues visually.
  • Real-time Features: Thanks to Supabase’s support for subscriptions and live updates, Safii is ready for real-time status tracking.

Challenges we ran into

I definitely had a hard time learning about deploying cycles but was able to figure it out thanks to Bolt.

Accomplishments that we're proud of

Building this app in itself is a huge accomplishment to me and knowing that this app will serve people well and bring a positive impact on the community makes it even better.

What we learned

This project taught me a lot — both technically and creatively:

  • Supabase Internals: Managing sessions, authentication flows, and dealing with session refresh edge cases when users switch tabs or go inactive.
  • Browser Lifecycle Management: Handling visibility events, API refetching, and ensuring resilience during inactive tab behavior.
  • UI/UX Thinking: Designing a clean, intuitive interface for users across age groups and devices.
  • Deployment & Versioning: Using Bolt.new allowed me to iterate quickly and push changes without worrying about CI/CD setup.
  • State Management: Deepened my understanding of how to manage loading states, errors, and reactivity in a civic context.
  • Real-world problem solving: Translating abstract problems (e.g. garbage buildup) into tangible, solvable technical features.

What's next for Safii

  • Enhance the map-based reporting system
  • Integrate with municipal dashboards for automated assignment
  • Add gamification (e.g. “top reporters” leaderboard)
  • Push for offline PWA support so people can report issues without a connection

Note

Built With

Share this project:

Updates