Earthquake Explorer is an interactive web application that lets you discover and monitor earthquake events from around the globe using a free API. The app retrieves up-to-date earthquake data—including essential details such as magnitude, location, depth, and time—and showcases the events on a responsive map interface. Built with modern web technologies, Earthquake Explorer ensures a smooth and engaging user experience on any device.
- Responsive Design: Enjoy a seamless experience on desktops, tablets, and mobile devices.
- Free API Integration: Fetch real-time earthquake data using a free API (e.g., the USGS Earthquake API).
- Comprehensive Details: View important details for each earthquake event, including magnitude, location, depth, and occurrence time.
- Interactive Map: Explore earthquake events visually with interactive map integration that plots each event.
- Filtering & Pagination: Easily navigate through earthquake records with filtering options and paginated results.
- Dynamic Modal Display: Click on an event card to open a modal window with detailed information and a zoomed-in map view of the epicenter.
- HTML5
- CSS3
- JavaScript
- Bootstrap 5
- Leaflet.js (or any preferred mapping library for interactive maps)
Earthquake Explorer is designed to run in modern web browsers with no extra dependencies required. For development, a code editor with live preview functionality (such as Visual Studio Code with the Live Server extension) is recommended.
-
Clone the Repository git clone https://github.com/bocaletto-luca/earthquake-explorer.git cd earthquake-explorer
-
Launch the Application
- Open the
index.htmlfile in your preferred web browser. - Alternatively, use a live-reload server through your code editor to preview changes in real time.
- Data Fetching: The application uses JavaScript’s Fetch API to retrieve earthquake data from a free API, such as the USGS Earthquake API, processing the JSON response to generate a list of earthquake events.
- Interactive Mapping: Each earthquake is plotted on an interactive map (using Leaflet.js or a similar tool), allowing users to visually explore the geographical distribution of events.
- Event Details: Clicking on an earthquake card opens a modal window with further details, including a zoomed-in map view and additional metadata like the depth and time of occurrence.
- Pagination & Filtering: The app divides data into manageable pages and provides filtering options (e.g., by magnitude or date) to help you quickly find specific events.
Contributions are welcome! To contribute to Earthquake Explorer, please follow these steps:
- Fork the repository.
- Create a new branch for your feature or fix: