Angular + NgxChartsを使って日本国内のコロナ（COVID-19）の感染者数を確認できるサイトを構築しました

Angularでコロナ（COVID-19）の感染者数が確認できるサイトを構築してみました。

とりあえず、日本国内の感染者数、死亡者数、回復者数が分かるようになっています。

下記のサイトにアクセスしてもらえると内容確認できます。

Covid

koichi-ezato.github.io

データ取得APIについて

こちらのサイトのAPIを使用しました。

Ainize | Launchpad for open-source projects

Instantly run and deploy any open-source projects for free

ainize.ai

/jhu-edu/timeseriesというAPIで日本で絞り込んでデータを取得しています。

使用した技術要素

• Angular 9.1.0
• Angular Material 9.2.0
• NgxCharts 13.0.2
• angular-cli-ghpages 0.6.2

Angularのフレームワークを利用し、デザインはAngular Material、グラフにはNgxChartsを使用しています。

今回はGithub Pages上にサイトを公開するためにangular-cli-ghpagesも使用しています。

グラフの書き方や、Github Pagesの利用方法については後日説明していきたいと思います。

最後に

世界的に影響を与えているコロナウィルス（COVID-19）ですが、少しでも皆さんの情報収集の足しになればと思いサイトを構築してみました。サイトの方は順次機能の追加などを行い、より分かりやすいサイトにしていこうと思います。