Real-Time Air Quality & Health Alert Dashboard is a web application designed to monitor real-time air quality data and provide instant health alerts. The platform empowers users to stay informed about air pollution levels in their vicinity and take timely protective measures.
Team Name: 404 Brain Not Found
Air pollution is a growing public health concern, especially in urban areas. Pollutants like PM2.5, PM10, and NO₂ can cause severe health issues. However, people often lack real-time information about air quality, leaving them unaware of potential risks and unable to take necessary precautions.
Our project aims to develop a responsive web app that:
- 📍 Displays real-time pollutant levels (PM2.5, PM10, NO₂, etc.) on an interactive map using public APIs like WAQI.
- 📲 Ensures mobile responsiveness for easy access, allowing users to check air quality on the go.
The goal is to bridge the gap between raw data and public action, helping people make informed health decisions.
- React.js
- React Leaflet for map integration
- MUI
- Python with Flask to handle API requests and proxy data
- Flask-CORS for cross-origin support
- Geopy for geolocation processing
- WAQI for providing free air quality data.
- OpenStreetMap and Leaflet for interactive mapping.
Our app stands out by merging real-time air quality data with personalized health recommendations. Unlike static dashboards, our platform actively:
⚠️ Notifies users of health risks base on location entered or selected and pollutant thresholds.- 📊 Empowers individuals — especially those with respiratory issues — to make safer, smarter choices.
- Clone the repository:
git clone <repository-url>
- Navigate to the project directory:
cd <project-folder>
- Install dependencies:
npm install
- Install React Leaflet for map integration:
npm install react-leaflet
- Start the frontend server:
npm start
- Install required Python packages:
pip install flask flask-cors geopy
- Start the backend server:
python app.py
Once both frontend and backend servers are running, open your browser and go to:
- Frontend:
http://localhost:3000
- Backend:
http://localhost:5000
-
View Real-Time Air Quality:
Open the Website and check the interactive map to view pollutant levels like PM2.5, PM10, and NO₂. -
Receive Health Alerts:
Get instant Health Alerts based on the pollution levels -
Multiple Views:
Toggle between the map view and a detailed pollutant data dashboard. -
Mobile Access:
The website is fully responsive — check air quality anywhere, anytime.
- WAQI for providing free air quality data.
- React.js and Flask for powering our frontend and backend.
- OpenStreetMap and Leaflet for interactive mapping.
- Our Team — 404 Brain Not Found — for the collaborative effort!
Made with ❤️ by 404 Brain Not Found.
Stay safe. Breathe clean. 🌿