This is a Covid-19 Tracking app that displays dynamic information on the daily cases, recoveries, and deaths of all countries in the world.
I built this project because I wanted to build something with relevance and use to people in the world right now.
This project has a minimal design with data that is displayed in numbers, graphs, and visually on the map. The map has popups to showcase country info once you click on a country. It also has a dark mode toggle for anyone who prefers a darker background.
useEffect(() => {
fetch('https://disease.sh/v3/covid-19/all')
.then(response => response.json())
.then(data => {
setCountryInfo(data)
})
}, []);
useEffect(() => {
const getCountriesData = async () => {
await fetch ("https://disease.sh/v3/covid-19/countries")
.then((response) => response.json())
.then((data) => {
const countries = data.map((country) => ({
name: country.country,
value: country.countryInfo.iso2,
}));
const sortedData = sortData(data);
setTableData(sortedData);
setMapCountries(data);
setCountries(countries);
});
};
getCountriesData();
}, []);
Clone to your local machine
https://github.com/ardissam0/COVID-19_TRACKER-APP.git
Setup
$ npm i
$ npm start
https://corona.lmao.ninja/docs/
Reach out to me on social media if you have any questions!