2
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

世界中のコロナのデータをグラフで見れるWebアプリを作成し、それによりAPIの見え方が変わったときの話

Last updated at Posted at 2020-10-03

#初めに
皆さんはプログラミングの学習や個人開発をどのように楽しんでいるでしょうか?
この記事では、自分があるAPIを使って作ったWebアプリの紹介とそこで使用したAPIを通して自分が感じたことについて扱っていきます。

#自分が作成したWebアプリ
Corona Report Made by a Failure
トップ画面はこんな感じです。
CRMF.jpg
ちなみにこのWebアプリのGithubのリポジトリはこちらです。もしこのWebアプリの機能について気になるのであれば、見てみて下さい。
https://github.com/santooooooo/CRMF

##作成に用いたツールたち

  • プログラム言語
    • TypeScript(3.9.3) ⇒Javascriptより後から見返した時の理解が楽そうだから
  • フレームワーク
    • Vue.js(2.6.11) ⇒今学んでいるから。
  • API
    • covid19api ⇒導入理由は無料で簡単に利用できるから。内容は後に記載。
  • その他
  • Chart.js(2.9.3) ⇒簡単に棒グラフや折れ線グラフなどのグラフがアニメーション付きで作成できるから。

##機能

  • 世界全体のコロナの一日の新規感染者数、新規死者数、新規回復者数とこれまでの感染者数、死者数、回復者数がわかる。
  • 一日の新規感染者数、新規死者数、新規回復者数とこれまでの感染者数、死者数、回復者数のそれぞれの分野ごとでの上位10か国の名前とその数がわかる。
  • 世界各国の一日の新規感染者数、新規死者数、新規回復者数とこれまでの感染者数、死者数、回復者数がわかる。
  • ユーザーが設定した期間の間の世界各国の一日ごとの新規感染者数、死者数、回復者数、コロナにかかっている状態が続いている人の数を折れ線グラフで見ることができる。
    CRMF-chart.png

##こだわり
ユーザーが好きに期間を設定し、その期間のデータをグラフで表示できるように実装しました。また、今回使用したAPIはコロナについてのいろいろな側面のデータを提供してくれていたので、それらを余すことなくユーザーへ伝えられるようなデータの表示を心掛けました。

#使用したAPIについて
##APIの概要
今回使用したAPIはCOVID19 APIというもので、Kyle Redelinghuysさんという方が今年の3月(本人のTwitterより)に作られたもので、現在もその方が運営しているAPIです。このAPIでできることは、主に世界各国の感染者数、死者数、回復者数の一日当たりの数又はそれらの現在まで累計値を取得することですが、料金プランによっては一つの国の100万人当たりの感染者数や10万人あたりの感染者率なんかも取得することができます。
このAPIは無料で使用できますが、それだとたびたびデータが送られてこない場合があるので、お試しで触る場合は無料のバージョンを使い、本格的に使用する場合は有料の物を使うことを個人的にはお勧めします。(料金プランは月$10$30$100から選べます。)
$10を使っての感想なのですが、このAPIのデータの正確性はあまり高くないと思っています。運営側もデータの誤りやコード上のバグを頑張って修正しているようですが、データの中には値があまりにもおかしいものもあったりするので、他のデータと見比べながら使用することをお勧めします。

##このAPIに触れる中で感じたこと
このAPIの質問、バグの修正等のリクエストはslackのチャンネルを通して行っているのですが、(いろいろな事情があり、Githubでこれらのことは行っていないそうです。)それらの中にshowcaseというチャンネルがあります。そのチャンネルでは、みんながこのAPIを使ったアプリケーションを発表しあい、また他の人からの反応をもらうことができます。

自分が実際にこのチャンネルで自分のWebアプリを発表しているところ
CRMFQiita.png
(自分が発表したWebアプリに対してGoodをもらった。たかだか一つであるが、自分が作成したものに対して人から反応をもらえる機会の少ない自分にとっては貴重なもの。)

このAPIに触れて良かったと感じていることは、ただバックエンドの作成をせず手軽にWebアプリが作成できただけではなく、このチャンネルのように自分が作成したものに対し他の人から反応をもらえる場所と機会を得ることができたということです。日々の学習では他人からの反応をなかなか得にくいので、他の方から反応がもらえた時はうれしく感じると共に今後の学習に向けての意欲が湧きました。

#終わりに
今まで自分はAPIに対してただ便利な機能を提供してくれるものとしか見ていませんでしたが、このAPIを通して、APIは便利な機能を提供してくれるだけではなく自分のプログラミングに対するモチベーションを大いに上げてくれるものでもあるということを体感することができました。
今後も様々な人が提供してくれているAPIを使ってどんどん個人開発をしていこうと思います。

2
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?