[React] 코로나 누적현황 표출

api는 COVID19 API에서 가져옴

내가 필요한 데이터는 Confirmed(확진자수), Active(격리자수), Date(날짜)이다.

import axios from "axios";
import React, { useEffect, useState } from "react";
import { Bar, Line } from "react-chartjs-2";

우선 api를 호출하기위해 axios와
데이터를 차트로 표출해주기위해 react-chartjs-2를 설치하여 임포트

import "./App.css";
import Contents from "./component/Contents";
import Header from "./component/Header";

function App() {
  return (
    <div className="App">
      <Header />
      <Contents />
    </div>
  );
}

export default App;

Header컴포넌트와 Contents 컴포넌트를 만듬

<처음에 썼던 코드>

const fetchEvents = () => {
   const res = axios.get(
     "https://api.covid19api.com/total/dayone/country/kr"
   );

   console.log(res);
};
fetchEvents();

==> 아직 데이터를 다 불러오지 못했는데 변수를 호출했기 때문에 나오는 메시지

<바꾼 코드>

const fetchEvents = async () => {
   const res = await axios.get(
     "https://api.covid19api.com/total/dayone/country/kr"
   );

   makeData(res.data);
   console.log(res);
 };

==> await과 async를 추가

==> 총 427개의 데이터가 표출됨

👉결과

오늘자 확진자수와, 완치자, 사망자수를 나타내 표출할수있도록 할 예정