🔴 LIVE DISASTER ALERT SYSTEM | Flood, Fire & Earthquake Detector with Web Dashboard | IoT Final Year Project

 


 Introduction



Natural disasters such as fires, floods, and earthquakes are among the most devastating events that affect human lives and infrastructure. Early detection and warning systems can drastically reduce casualties and property damage by giving people precious time to respond and evacuate.

As part of our final year project at SLIATE Kandy (Group 09), we designed and built a Smart Disaster Early Warning System using an ESP8266 Wi-Fi microcontroller. The system monitors real-time environmental conditions using multiple sensors and serves a live web dashboard accessible via Wi-Fi — no internet connection required.

This blog post covers everything: hardware components, wiring, libraries, code explanation, and how the full system works.




Project Objectives

  • Detect fire, flooding, and earthquake activity in real time
  • Display live sensor data on a web-based dashboard from any device
  • Sound an alarm buzzer when a danger is detected
  • Operate as a standalone Wi-Fi access point — no router needed
  • Provide instant status updates every second to connected devices

 Features

Feature Description
🔥 Fire Detection Flame sensor detects presence of fire
🌊 Flood Detection Soil moisture sensor detects rising water level
🌍 Earthquake Detection Tilt sensor detects ground vibration/movement
🌡️ Temperature & Humidity DHT11 sensor monitors weather conditions
📡 Live Web Dashboard Real-time data served via built-in web server
🔔 Buzzer Alarm 5-second alarm activates on any danger detected
📶 Standalone Wi-Fi AP No router required — creates its own Wi-Fi network
📱 Mobile Responsive Works on phones, tablets, and PCs

🛒 Hardware Components



# Component Quantity Description
1 ESP8266 NodeMCU 1 Wi-Fi microcontroller (main brain of the system)
2 DHT11 Sensor 1 Measures temperature and humidity
3 Soil Moisture Sensor 1 Used as water/flood level detector
4 Flame Sensor Module 1 Detects presence of fire or flame
5 Tilt Sensor (SW-520D) 1 Detects vibration or tilt (earthquake simulation)
6 Active Buzzer 1 Sounds alarm when danger is detected
7 Breadboard 1 For prototyping connections
8 Jumper Wires Multiple Male-to-male and male-to-female
9 USB Cable (Micro-USB) 1 For powering and programming the ESP8266
10 5V Power Supply or Laptop USB 1 To power the system

 Required Libraries

Install these libraries in the Arduino IDE before uploading the code.

1. ESP8266WiFi

  • Purpose: Enables Wi-Fi functionality on the ESP8266
  • Install: Comes built-in with the ESP8266 board package
  • Board Manager URL: http://arduino.esp8266.com/stable/package_esp8266com_index.json

2. ESP8266WebServer

  • Purpose: Creates an HTTP web server on the ESP8266
  • Install: Included with ESP8266 board package
  • Used for: Serving the HTML dashboard and JSON sensor data

3. DHT Sensor Library

  • Purpose: Reads temperature and humidity from the DHT11 sensor
  • Install: Arduino IDE → Library Manager → Search "DHT sensor library" by Adafruit
  • Also required: Adafruit Unified Sensor library (dependency)

How to Install Libraries in Arduino IDE:

  1. Open Arduino IDE
  2. Go to Sketch → Include Library → Manage Libraries
  3. Search for the library name and click Install
  4. For ESP8266 board support, go to File → Preferences and add the board URL above

 Pin Configuration

Sensor / Component ESP8266 Pin Pin Label Type
DHT11 Data Pin D4 GPIO2 Digital Input
Soil Moisture Sensor A0 ADC0 Analog Input
Flame Sensor D5 GPIO14 Digital Input
Tilt Sensor D6 GPIO12 Digital Input
Buzzer D7 GPIO13 Digital Output

Circuit Wiring Guide

DHT11 Temperature & Humidity Sensor

DHT11 VCC  →  ESP8266 3.3V
DHT11 GND  →  ESP8266 GND
DHT11 DATA →  ESP8266 D4

Soil Moisture Sensor (Flood Detection)

Sensor VCC  →  ESP8266 3.3V or 5V
Sensor GND  →  ESP8266 GND
Sensor AO   →  ESP8266 A0  (Analog Output)
Sensor DO   →  Not connected (we use analog)

Flame Sensor Module

Flame VCC  →  ESP8266 3.3V
Flame GND  →  ESP8266 GND
Flame DO   →  ESP8266 D5  (Digital Output)

⚠️ The flame sensor outputs LOW when fire is detected and HIGH when no fire is present.

Tilt Sensor (SW-520D) – Earthquake Detection

Tilt Pin 1  →  ESP8266 D6
Tilt Pin 2  →  ESP8266 GND

⚠️ The tilt sensor outputs HIGH when tilted/vibrating, LOW when stable. Use the internal pull-up if needed.

Buzzer

Buzzer (+)  →  ESP8266 D7
Buzzer (-)  →  ESP8266 GND

How the Code Works

1. Wi-Fi Access Point Setup

The ESP8266 creates its own Wi-Fi network called "DisasterSystem":

WiFi.softAP(ssid);

Connect any phone or laptop to this Wi-Fi → open a browser → go to 192.168.4.1 to view the dashboard.

 Web Dashboard Features



  • System Status card — Shows SAFE (green) or DANGER (red) in large text
  • Weather card — Live temperature (°C) and humidity (%)
  • Fire Detection card — Shows "SAFE" or "🔥 FIRE DETECTED"
  • Flood Level card — Shows percentage with three states:
    • NORMAL (0–40%) — No flooding
    • ⚠ WATER RISING (40–70%) — Warning level
    • 🌊 FLOOD DETECTED (70–100%) — Critical level
  • Earthquake card — Shows "STABLE" or "🌍 EARTHQUAKE DETECTED"
  • Blinking LIVE MONITORING banner — Always visible at the top

 Sensor Threshold Values

Sensor Safe Threshold Warning Danger
Flame Sensor HIGH (no fire) LOW (fire detected)
Soil Moisture < 40% 40–70% > 70%
Tilt Sensor LOW (stable) HIGH (tilted/vibrating)
Temperature Normal range No threshold set (display only)

How to Upload and Run

Step 1: Setup Arduino IDE

  1. Download and install Arduino IDE
  2. Go to File → Preferences
  3. Add this URL to Additional Board Manager URLs: http://arduino.esp8266.com/stable/package_esp8266com_index.json
  4. Go to Tools → Board → Board Manager → Search ESP8266 → Install

Step 2: Install Libraries

  • Install DHT sensor library by Adafruit
  • Install Adafruit Unified Sensor (required dependency)

Step 3: Select Board & Port

  • Go to Tools → Board → ESP8266 Boards → NodeMCU 1.0 (ESP-12E Module)
  • Select the correct COM port your ESP8266 is connected to

Step 4: Upload Code

  • Paste the full code into Arduino IDE
  • Click the Upload button (→ arrow icon)
  • Wait for "Done uploading" message

Step 5: Connect and View Dashboard

  1. Open Wi-Fi settings on your phone or laptop
  2. Connect to "DisasterSystem" Wi-Fi network
  3. Open any browser and go to: http://192.168.4.1
  4. The live dashboard will load and update every second

Testing the System

Test How to Trigger Expected Result
Fire Test Bring a lighter near the flame sensor "🔥 FIRE DETECTED", buzzer beeps, status → DANGER
Flood Test Dip soil sensor in water "🌊 FLOOD DETECTED (XX%)", status → DANGER
Earthquake Test Tilt or shake the tilt sensor "🌍 EARTHQUAKE DETECTED", status → DANGER
Safe State All sensors in normal condition All green, status → SAFE
Buzzer Auto-Stop Wait 5 seconds after trigger Buzzer stops automatically


 Project Information

Detail Info
Institution SLIATE Kandy
Group Number Group 09
Project Title Smart Disaster Early Warning System
Microcontroller ESP8266 NodeMCU
Programming Language C++ (Arduino Framework)
Communication Wi-Fi (Soft Access Point Mode)
Dashboard HTML + CSS + JavaScript

 Full Source Code

#include <ESP8266WiFi.h>
#include <ESP8266WebServer.h>
#include <DHT.h>


const char* ssid = "DisasterSystem";
ESP8266WebServer server(80);


#define DHTPIN D4
#define DHTTYPE DHT11
DHT dht(DHTPIN, DHTTYPE);


#define SOIL   A0
#define FLAME  D5
#define TILT   D6
#define BUZZER D7


int dryValue = 800;
int wetValue = 400;

float temp, hum;
int soilRaw, soilPercent, flameValue, tiltValue;

bool buzzerActive = false;
unsigned long buzzerStart = 0;

String systemStatus = "SAFE";

const char webpage[] PROGMEM = R"rawliteral(
<!DOCTYPE html>
<html>
<head>
<title>Disaster Monitoring System</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
body{margin:0;font-family:Arial;color:white;text-align:center;
background:url('https://images.unsplash.com/photo-1504384308090-c894fdcc538d') center/cover fixed;}
.overlay{background:rgba(0,0,0,0.75);min-height:100vh;}
.logo{width:80px;margin-top:10px;}
.alert{background:red;padding:10px;animation:blink 1s infinite;}
@keyframes blink{0%{opacity:1;}50%{opacity:0.3;}100%{opacity:1;}}
.container{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:15px;padding:15px;}
.card{background:rgba(255,255,255,0.1);border-radius:15px;padding:15px;}
.status{font-size:28px;font-weight:bold;}
.safe{color:lime;}
.danger{color:red;}
</style>
<script>
setInterval(()=>{
  fetch('/data').then(r=>r.json()).then(d=>{
    let s=document.getElementById("status");
    s.innerHTML=d.status;
    s.className=(d.status=="DANGER")?"status danger":"status safe";
    document.getElementById("temp").innerHTML=d.temp;
    document.getElementById("hum").innerHTML=d.hum;
    document.getElementById("fire").innerHTML=d.fire;
    document.getElementById("flood").innerHTML=d.flood;
    document.getElementById("quake").innerHTML=d.quake;
  });
},1000);
</script>
</head>
<body>
<div class="overlay">
<img class="logo" src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSANM7p1xCiCDCANyqoKRp5C4N9lE15vb3bvA&s">
<h2>SMART DISASTER EARLY WARNING SYSTEM</h2>
<h4>SLIATE KANDY | Group No: 09</h4>
<div class="alert">⚠ LIVE MONITORING ACTIVE - SENSOR NETWORK ONLINE</div>
<div class="container">
<div class="card">SYSTEM STATUS<br><div id="status" class="status">LOADING</div></div>
<div class="card">🌡 WEATHER<br>Temp: <span id="temp"></span> °C<br>Humidity: <span id="hum"></span> %</div>
<div class="card">🔥 FIRE DETECTION<br><div id="fire"></div></div>
<div class="card">🌊 FLOOD LEVEL<br><div id="flood"></div></div>
<div class="card">🌍 EARTHQUAKE<br><div id="quake"></div></div>
</div>
</div>
</body>
</html>
)rawliteral";

void readSensors() {
  temp = dht.readTemperature();
  hum  = dht.readHumidity();
  if (isnan(temp) || isnan(hum)) { temp = 0; hum = 0; }

  soilRaw     = analogRead(SOIL);
  soilPercent = map(soilRaw, dryValue, wetValue, 0, 100);
  soilPercent = constrain(soilPercent, 0, 100);

  flameValue = digitalRead(FLAME);
  tiltValue  = digitalRead(TILT);

  bool fire  = (flameValue == LOW);
  bool flood = (soilPercent > 70);
  bool quake = (tiltValue  == HIGH);

  if (fire || flood || quake) {
    systemStatus = "DANGER";
    if (!buzzerActive) {
      digitalWrite(BUZZER, HIGH);
      buzzerStart  = millis();
      buzzerActive = true;
    }
  } else {
    systemStatus = "SAFE";
  }
}

void handleBuzzer() {
  if (buzzerActive && millis() - buzzerStart >= 5000) {
    digitalWrite(BUZZER, LOW);
    buzzerActive = false;
  }
}

void handleData() {
  readSensors();
  handleBuzzer();

  String fireStatus  = (flameValue == LOW) ? "🔥 FIRE DETECTED" : "SAFE";
  String floodStatus;
  if      (soilPercent > 70) floodStatus = "🌊 FLOOD DETECTED ("  + String(soilPercent) + "%)";
  else if (soilPercent > 40) floodStatus = "⚠ WATER RISING ("    + String(soilPercent) + "%)";
  else                        floodStatus = "NORMAL ("             + String(soilPercent) + "%)";
  String quakeStatus = (tiltValue == HIGH) ? "🌍 EARTHQUAKE DETECTED" : "STABLE";

  String json = "{";
  json += "\"temp\":"   + String(temp)    + ",";
  json += "\"hum\":"    + String(hum)     + ",";
  json += "\"fire\":\""  + fireStatus     + "\",";
  json += "\"flood\":\"" + floodStatus    + "\",";
  json += "\"quake\":\"" + quakeStatus    + "\",";
  json += "\"status\":\"" + systemStatus  + "\"";
  json += "}";

  server.send(200, "application/json", json);
}

void setup() {
  Serial.begin(115200);
  pinMode(FLAME,  INPUT);
  pinMode(TILT,   INPUT);
  pinMode(BUZZER, OUTPUT);
  digitalWrite(BUZZER, LOW);
  dht.begin();
  WiFi.softAP(ssid);
  server.on("/",     [](){ server.send_P(200, "text/html", webpage); });
  server.on("/data", handleData);
  server.begin();
}

void loop() {
  server.handleClient();
}

 Conclusion

This Smart Disaster Early Warning System demonstrates how low-cost microcontrollers and sensors can be combined to create a functional real-time monitoring system. With just an ESP8266 and a handful of sensors, we built a system capable of detecting fire, flooding, and earthquakes — and instantly alerting users through a web dashboard and buzzer alarm.

This project shows the potential of IoT technology in disaster management and could be scaled up for real-world deployment in schools, hospitals, warehouses, or rural areas with minimal cost.


Built with ❤️ by Group 09 — SLIATE Kandy Final Year Project 2025/2026


Comments