TomorrowGrid

Inspiration

Future cities won't run on top-down systems alone. When floods hit, heat waves strike, or infrastructure fails, the people on the ground see it first. We built TomorrowGrid for FutureHacks 2026 because fewer than 20% of residents use official 311 apps—yet hazards show up in neighborhoods within minutes. Tomorrow's cities need a decentralized intelligence layer that listens to citizens and prioritizes responses automatically.

What it does

TomorrowGrid is a web platform where residents report urban hazards — flooding, heat zones, safety issues, accessibility barriers, air quality problems, and infrastructure damage.

• Live Hazard Map — citizen reports appear instantly on an interactive map
• Priority Scoring Engine — ranks issues by hazard type + community confirmations
• Real Weather Dashboard — live heat index powered by Open-Meteo
• Future City Simulator — model how green roofs, solar, bike lanes, and smart sensors improve city resilience by 2035

How we built it

We used Next.js 16 with TypeScript and the App Router, Tailwind CSS for a clean, light UI, React Leaflet with OpenStreetMap for the map, and the free Open-Meteo API for live weather data. The priority scoring algorithm is transparent and explainable — not a black box. For the hackathon demo, reports persist in the browser so judges can interact with the full flow immediately.

Challenges we ran into

• Leaflet + Next.js — required dynamic imports to avoid SSR issues with the map
• **Hydration errors—fixed by client-only rendering for browser storage and suppressHydrationWarning on the root layout
• Vercel deployment — a duplicate GitHub project caused a 404 on the production domain; resolved by removing the duplicate project and redeploying with a full build
• Tight deadline — focused on the highest-impact flow: report → map → prioritize → simulate future impact

Accomplishments that we're proud of

• Fully deployed, interactive demo judges can test live
• Real-time weather integration for urban heat monitoring
• Explainable priority scoring tied to real civic use cases
• Future City Simulator that directly answers the "city of tomorrow" theme

What we learned

Civic tech isn't just about building apps — it's about bridging the gap between how fast problems appear in communities and how slowly traditional city systems respond. Urban resilience works best when every citizen becomes a sensor.

What's next for TomorrowGrid

• Backend database + municipal admin dashboard
• AI-powered report deduplication and clustering
• Integration with official 311 APIs
• Mobile app with offline-first reporting

Built With

• api
• css
• leaflet.js
• lucide
• next.js
• node.js
• open-meteo
• openstreetmap
• react
• tailwind
• typescript
• vercel