QasimTalkin / Interactive-COVID-19-Data-ReactJS

An interactive COVID-19 visualizer (coronavirus) of countries around the world based on the most recent cases.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

COVID-Global-Visulaizer

An interactive COVID-19 visualizer (coronavirus) of countries around the world based on the most recent cases.

React JS (Hooks-Material-UI-Charts-js)

API used : Covid19 Mathdro Api

Setup: run npm i && npm start

Dependencies npm install --save axios react-chartjs-2 react-countup classnames

PROJECT STRUCTURE

Components

  • CARDS (Covid numbers as Cards npm install --save @material-ui/core)
    • Cards.jsx
    • Cards.module.css
  • CHARTS
    • Charts.jsx
    • Charts.module.cs
  • COUNTRY
    • Country.jsx
    • Country.module.cs

API

  • index.js
    • axios (fetching covid API)
    import axios from 'axios';
    
    const url = 'https//covid19.mathdro.id/api';
    • Main data to user from API
    • CONFIRMED
    • RECOVERED
    • DEATHS
    • LASTUPDATE

About

An interactive COVID-19 visualizer (coronavirus) of countries around the world based on the most recent cases.


Languages

Language:JavaScript 92.8%Language:HTML 7.2%Language:CSS 0.0%