Skip to content

[Vue3+TS] OpenAPI를 활용해 Covid19 데이터를 받아와 전세계, 국가별 현황을 보여주는 코로나19 대시보드입니다.

Notifications You must be signed in to change notification settings

sunyoungoh/covid19-board

Repository files navigation

Covid19-Board

OpenAPI를 활용해 Covid19 데이터를 받아와 전세계, 국가별 현황을 보여주는 대시보드입니다. 반응형 웹사이트로 PC, 태블릿, 모바일에서 이용할 수 있습니다.



✨ Live Demo (Responsive Web)

https://sunyoungoh.github.io/covid19-board/
오픈 API 중단으로 더 이상 데이터를 받아올 수 없습니다 😢



🪄 Tech Stack

  • Vue3
  • TypeScript
  • Vuex
  • Chart.js



🎬 Function

1. Sort By Confirmed, Deaths, Recovered

확진자, 사망자, 회복자별로 국가별 랭킹 오름차순, 내림차순 정렬 기능

2. Click Contry

국가 클릭

3. Sort By Date (Contry Chart Table)

차트 표 날짜 순서 오름차순, 내림차순 정렬

4. Chart.js Function

Chart.js 기능

5. Change Table Date Range

Chart.js 표 기간 변경

6. Search Contry

국가 검색


🎨 Design

1. Responsive

  • PC -> Tablet -> Mobile

  • Mobile -> Tablet -> PC

2. Theme

  • Light <-> Dark
  • Local Storage에 상태값 저장




⚙️ OpenAPI

https://api.covid19api.com/

About

[Vue3+TS] OpenAPI를 활용해 Covid19 데이터를 받아와 전세계, 국가별 현황을 보여주는 코로나19 대시보드입니다.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published