|

Indonesia Disaster Monitoring System

A cloud-based interactive website that provides real-time information about natural disasters in Indonesia using React, Leaflet.js, and Amazon Web Services (AWS). The system is designed to provide easy and quick access to disaster mitigation information for the public and stakeholders.

Overview

This project is designed to visualize real-time natural disaster data using an interactive map equipped with specific icons for each type of disaster. The system leverages AWS cloud technology to ensure scalability and information availability, and is responsively designed to be accessible across various devices.

How to Use

1. Access Website: Open the website through your browser.
2. Explore Map: Use zoom and drag features to explore disaster locations across Indonesia.
3. Click Disaster Icons: Get detailed information such as disaster type, location, time, and severity.
4. Use Filters: Select specific disaster types through buttons on the right side of the screen.
5. View Mode: Switch between light/dark modes via the button in the top right corner.

Display Examples

Interactive Map

Disaster Details

Key Features

• Real-Time Data: Latest disaster information directly from BMKG API.
• Interactive Map: Users can explore disaster locations with zoom, drag, and click icon features for detailed information.
• Disaster Filtering: Select specific disaster types such as earthquakes, floods, or tsunamis.
• Light/Dark Mode: Adjustable display for user comfort.
• Responsive Design: Optimally accessible on desktop, tablet, and mobile devices.

Tech Stack

Installation and Configuration

1. Clone the repository:

   git clone https://github.com/username/project-name.git
   cd project-name

2. Install dependencies:

   npm install

3. Configure .env file: Create a .env file in the project root and enter the following variables:

   VITE_AWS_ACCESS_KEY_ID=your-aws-key-id
   VITE_AWS_SECRET_ACCESS_KEY=your-aws-secret-access-key
   VITE_AWS_REGION=your-aws-region

4. Run local application:

   npm run dev

5. Deploy to Vercel:

   • Connect repository to Vercel account.
   • Set the same environment variables in the project settings on Vercel.
   • Deploy through Vercel dashboard.

Development Plans

1. Adding early warning notification features.
2. Integration with historical data for long-term analysis.
3. Optimization for areas with low internet connectivity.
4. Adding user personalization features.
5. Development of data-based reports for policymakers.

Contributions

Contributions in the form of code, ideas, or suggestions are welcome!

1. Fork this repository.
2. Create a branch for new features.
3. Commit your changes.
4. Push to your branch.
5. Create a Pull Request.

License

This project is protected by the MIT License. Please check the LICENSE file for more information.

Contact

If you have any questions or suggestions, please open a new issue in this repository.