はじめに
この記事はプロトアウトスタジオの授業スタート前チェックリストのWebAPI利用編です。
Visual Studio Code(VSCode)やNode.jsを利用しますので、もしまだ基礎編をご覧になられてない場合はまずはそちらから御覧ください。
また、ここではNode.jsのパッケージを利用します。 npmやパッケージについてはパッケージ編を御覧ください。
この記事では、WebAPIというインターネット上のデータをNode.jsのaxiosを利用し取得していきます。
詳細な解説は敢えて省いています。
どれか一つでも厳しそうな場合は事前のサポートを実施しますので、その際にサポートするので一緒にやっていきましょう。
チェックリスト
- 作業フォルダの設定
- QiitaのAPIを利用してみる
- 狙ったデータを取得する
パッとみてこれが出来る人はこの記事を読み飛ばして大丈夫です。
作業フォルダの設定
- qiita-apiという名前のフォルダを作成
- VSCodeでqiita-apiファルダを開く
- VSCode内でターミナルを開く
npm init -y
でnpmの初期設定npm i axios
で今回利用するパッケージaxiosのインストール
QiitaのAPIを利用してみる
繋げる先の情報
QiitaのAPI仕様書
https://qiita.com/api/v2/docs#タグ
タグとは
タグ機能とは関連するキーワードの投稿をまとめ、記事を整理するための機能です。Qiitaでは、「タグ」や「ユーザー」をフォローすることで、興味のある分野の情報を的確に取得することができます。
このタグをAPIで探ることによって、いまの技術の人気や様々な動向を調べることができます。
タグやユーザーをフォローしよう - Qiita:Support
ソースコード
index.js
を作成し、中身は以下のソースコードを書き込む
const axios = require("axios");
async function main() {
let response = await axios.get("https://qiita.com/api/v2/tags/JavaScript");
console.log(response.data);
}
main();
node index.js
コマンドで実行
{ followers_count: 64462,
icon_url:
'https://s3-ap-northeast-1.amazonaws.com/qiita-tag-image/7e67c6a2d1e2fc39283fe28cfd5f065b93bbb15a/medium.jpg?1554725663',
id: 'JavaScript',
items_count: 28736 }
このようなJSONデータが表示されれば成功。
狙ったデータを取得する
- https://qiita.com/api/v2/tags/JavaScript の JavaScript の部分を変えて他のタグのデータを取得する。
- JSONデータを表示するのではなく、
followers_count
の値の64462
のみ表示させる。 参考サイト:https://developer.mozilla.org/ja/docs/Learn/JavaScript/Objects/JSON
おわりに
おつかれさまでした!
これでWebAPIを利用し、様々なデータを取得することができるようになりました。
もし余力があれば他のAPIを探し利用してみましょう。