Corona Tracker
A real-time worldwide COVID-19 tracking dashboard, built using React.js and Material UI, that presents detailed statistics on coronavirus cases, recoveries, and deaths via live APIs. Features an interactive map visualization, enabling users to explore case data by country, using open-source mapping libraries. The project showcases API integration, dynamic data visualization, and modern UI design.
Next JS
frontend
Material UI
Project Overview
Tech Stack :
React JS, API, HTML, CSS
Type :
Frontend
Duration :
5 days
Deployment :
Netlify
System Architecture
The COVID-19 Tracker is a React.js-based web application that uses Material UI for its responsive interface and a map library for interactive visual data presentation. It fetches real-time COVID-19 data from multiple external APIs, dynamically updating statistics such as cases, recoveries, and deaths worldwide. The system's architecture consists of a frontend UI layer that handles rendering and user interaction, an API layer that manages data retrieval and updates, and a map visualization component that spatially displays case data across countries. Together, these layers form a modular, real-time dashboard that combines clear design with live data for user-friendly pandemic tracking.
fig: Covid Tracker
Workflow Demo
Key Features
Categorized Cases
Shows categorized data of coronavirus cases, recovered cases, and death cases for clarity and quick understanding.
Country-wise Case List
Provides a detailed list of infected individuals by country to track national-level impacts.
Monthly Data Charts
Visualizes monthly trends and patterns through charts, offering insights into the pandemic's progression over time.
Map View in Circles
Displays COVID-19 case densities visually on an interactive map using circles sized by the number of cases.