CrisisCompass

Inspiration

Tourists can face emergencies in places where they don’t know the local language, available services, or current risks. CrisisCompass aims to make useful safety information easier to find, even when internet connectivity is weak or intermittent.

What it does

CrisisCompass brings travel safety tools into one app:

• Shows weather information and disaster alerts from connected data sources.
• Displays a safety map with hazard information and nearby listed facilities.
• Helps users estimate a route and review safety guidance.
• Offers profile and emergency reporting features.
• Keeps previously loaded pages and data available for limited offline use. Live features depend on the backend, internet connection, and provider coverage. Offline access is limited to information saved earlier; SOS reports do not dispatch emergency services.

How I built it

The frontend uses React, TypeScript, and Vite, with responsive layouts for mobile and desktop. A FastAPI backend serves the app’s API. Data integrations include Open-Meteo for weather, GDACS for global flood alerts, and OpenStreetMap for map tiles and nearby places. Local storage and a service worker support cached information when connectivity is limited.

Challenges I ran into

• Connecting a Vercel-hosted frontend to a separately deployed backend and configuring the API URL and CORS.
• Handling slow or unavailable providers without crashing the app.
• Making route estimates useful while clearly communicating when current hazard data is unavailable.
• Supporting translation and offline access without implying cached information is always current.
• Fitting navigation, maps, and key actions onto small screens.

Accomplishments that I'm proud of

• Created a mobile-friendly navigation layout with a prominent SOS shortcut.
• Added a searchable map that can display information beyond a single city.
• Improved error handling for empty or non-JSON API responses.
• Added cached translations and offline fallbacks for previously loaded data.
• Made data limitations and route uncertainty clearer to users.

What I learned

I learned that emergency information products need more than a good interface. They need dependable data sources, clear source attribution, careful handling of stale or missing information, and a deployment setup where the frontend and backend can communicate reliably.

What's next for CrisisCompass

• Deploy and connect a reliable production backend.
• Add stronger user authentication and protect personal profile data.
• Integrate additional authoritative Indian alerts, such as relevant IMD and NDMA feeds.
• Expand verified facility coverage and improve route data.
• Add downloadable regional maps and emergency information for deeper offline use.
• Improve Telugu and other Indian-language translations, including for dynamic alerts.

CrisisCompass is a travel safety aid, not an emergency dispatch service. Follow local authority instructions and call 112 in India for immediate emergencies.

Built With

• fastapi
• meteo
• open
• react
• sqlite
• tailwind
• typescript
• vite