UrbanPulse-Hyperlocal-Problem-Solver

Cities lack real-time road hazard tracking. 2.Sol: Citizen reporter with AI dispatch. 3.Tech: React/Vite, Google Drive, Gemini 3.5. 4.Value: Hyperlocal safety syncs for city admins.

Comment

🎨 Inspiration Urban citizens report potholes, blocked drains, and road hazards daily, but these reports get lost in complex bureaucratic queues. At the same time, municipal field teams lack a lightweight dashboard that links field reports with cloud-based office files. We built UrbanPulse to be a hyperlocal road hazard reporting and tracking tool that empowers citizens to upload street-level issues while organizing backend dispatch logs directly inside a Google Drive project workspace.

⚙️ How we built it Frontend: React 19, Vite, Tailwind CSS with dynamic dark/light mode support, and Lucide Icons. Backend: Node.js and Express backend proxying Gemini API requests. Database & Auth: Firebase authentication for secure estimator and worker logins. Integrations: Google Drive API integration to automatically sync local sandbox files and project folders. AI Analysis: Gemini 3.5 Flash to parse road hazard photos, estimate damage severity/percentages, and polish public citizen comments into clean, structured dispatch records. 🚧 Challenges we faced Google API Authentication: Handling OAuth2 flow and file permissions securely while maintaining an offline local sandbox folder for developers who don't have active credentials configured. Structured AI Outputs: Crafting exact prompt guidelines to guarantee Gemini returned clean JSON objects without markdown wrappers, which would otherwise break the parsing layer. Dynamic Mapping: Synchronizing coordinates from reported hazard pins with custom Map templates and dashboard charts in real-time. 📚 What we learned File Stream Handling: Managing raw binary blobs and file buffers from Google Drive in a React app requires clear async state management and skeleton loading UI. AI Data Cleansing: Using LLMs to clean up messy user-reported text (e.g., stripping commas to prevent CSV corruption and limiting to strict character counts) makes crowdsourced data significantly more database-ready.

Built With

  • and
  • and-framer-motion-for-premium-micro-animations.-backend:-node.js-and-express-serving-as-a-secure-api-gateway-proxy-to-shield-api-keys.-ai-engine:-the-@google/genai-sdk-using-gemini-3.5-flash-for-high-speed-structured-analysis-and-schema-adherence
  • automatic
  • bids
  • cache
  • configurations
  • fallback
  • frontend:-react-19
  • gemini-3.1-flash-lite.
  • indexeddb
  • local
  • localstorage
  • management:
  • outbound
  • queue
  • recharts-for-vendor-score-visualization
  • rfis
  • state
  • tailwind-css-for-styling
  • to
  • vite
  • when
  • with
Share this project:

Updates