Skip to main content
WebCompleted

DisasterSense AI

An early-warning system that calculates automatic disaster risk levels from real-time, location-based weather data.

  • React
  • React Router
  • TypeScript
  • Vite
  • Leaflet
  • Zustand
DisasterSense AI homepage with a risk-check button and feature summary

Overview

DisasterSense AI is a web-based early-warning system that helps Indonesian communities prepare for natural disasters by analyzing real-time weather data and automatically calculating disaster risk levels based on the user's location.

Problem

Existing disaster warning systems are often too technical for the general public to understand, disaster education is scattered across disconnected sources, and many solutions require installing an extra app when fast browser-based access matters most during an emergency.

Solution

The app automatically detects the user's location (GPS or manual input with reverse geocoding), monitors real-time weather data (rainfall, wind speed, humidity, temperature), then automatically calculates risk into three levels Safe, Alert, Danger shown on an interactive map with color-coded location markers.

Features

  • Automatic location detection via GPS or manual input with reverse geocoding
  • Real-time weather monitoring (rainfall, wind speed, humidity, temperature)
  • Automatic risk calculation with three levels: Safe, Alert, Danger
  • Interactive risk map with color-coded location markers
  • Disaster education covering multiple types of natural disasters in Indonesia
  • Alert notification system with historical tracking

Tech Stack

React and TypeScript were chosen to build a reactive, type-safe interface, with Vite as the build tool for fast iteration. Zustand handles lightweight state management (location, weather data, alert history) without excess boilerplate. Leaflet (via React Leaflet) renders the interactive risk map. Weather data comes from Open-Meteo and geocoding from Nominatim/ OpenStreetMap, both key-free public APIs, in line with the backend-free approach.

Challenges

Designing sensible risk-calculation thresholds from raw weather data, and handling the case where location permission is denied with a smooth manual input fallback.

What I Learned

This project reinforced the value of minimal state management (Zustand) over heavier solutions, and how to structure threshold-based risk classification logic that stays transparent and easy to explain to non-technical users.

Result

DisasterSense AI delivers location-based disaster risk estimates directly from the browser with no installation, covering education for multiple types of natural disasters in Indonesia.

Gallery

Risk dashboard with status, current weather data, and action recommendationsInteractive risk map with location markers color-coded by danger levelDisaster education page with guidance for multiple types of natural disastersNotifications page with alert history and browser notification settingsDisasterSense AI About page with project goals and the technologies used

Links

Related Projects

  • NearBy Balikpapan homepage with SME search and featured business cards
    WebIn Progress

    NearBy Balikpapan

    A location-based directory for discovering nearby small and medium enterprises in Balikpapan.

    • vue
    • vue-router
    • typescript
    • vite
  • WinterRa homepage with a snow-themed title and 3D particle effects
    WebCompleted

    WinterRa

    An interactive year-end holiday platform with a 3D experience, budget calculator, and packing checklist.

    • vue
    • vue-router
    • vite
    • tailwind
  • SafeRoute homepage showing the local risk panel and real-time weather status
    WebCompleted

    SafeRoute

    A disaster preparedness platform with an interactive risk map, real-time weather, and evacuation routing.

    • vue
    • vue-router
    • vite
    • pinia

© 2026 Christian Imanuel Admojo