【JavaScript活用】リベンジしてみた！！→QiitaAPIでバイクが好きがいるか調べてみた


バイクが好きだ！と公言し、Qiita初投稿テーマとして「[【JavaScript活用】QiitaAPIを活用してバイク好きがいるか調べてみた](https://qiita.com/yui-kouy/items/ddcf699b743adedb32db)」を投稿しましたが、「さいごに」に記載したとおり、英語圏ではオートバイを指す言葉は[bike]ではなく<font color="#ff0000"> **[Motorcycle]** </font>なのだということがわかりました。
それならやることはひとつよね～。ということで<font color="#ff0000"> **[Motorcycle]** </font>で<font color="#ff0000">**リベンジ** </font>しますッ:muscle::triumph:

#リベンジ内容:fire::fire::fire:
せっかくのリベンジなので、少しチャレンジングな内容もやってやろうじゃないか！
ということで、前回からの処理条件の追加・変更箇所を赤字として記載したとおりに実行します。
なお、処理の順番も変更していますがわかりにくくなるので赤字にしていません。
<font color="#708090">(条件変えただけでCsv書き出しを追加したくらいしか変わっていないのはご容赦ください:sweat_smile:)</font>

【検索するタグおよびキーワード】
　・<font color="#ff0000"> **[Motorcycle]** </font>
【処理】
　1．タグのフォロワー数をそれぞれ取得
　2．タグが設定された記事数をそれぞれ取得
　3．キーワードが含まれた記事のタイトル、URL、<font color="#ff0000"> **LGTM(＝いいね！）** </font>を10件分を一覧化
　4．<font color="#ff0000"> **Csv書き出し** </font>（キーワードが含まれた記事のタイトル、URL、LGTM(＝いいね！）を100件分）

#環境、言語等
・Visual Studio Code
・Qiita API
・JavaScript
・Node.js


#処理コードおよび処理結果
「タグをフォローしている人の数」「タグを含む記事の数」の処理がエラーが出て、どうにもこうにも動かない。単語を変えてやると問題なく動くのに、[Motorcycle]でやるとエラーが出ます。
もしかして？タグの存在がそもそも存在しないとエラーになるのかな？と思い、エラー回避「try～catch文」を実装することにしました。
Csvへ書き出す処理もチャレンジします！
★参考：[【JavaScript】例外処理try～catch文の使い方](https://qiita.com/kuro_96/items/2a2b11be2a29459ded5c)
★参考：[JSONの基本　データ形式](https://qiita.com/Yu-kiFujiwara/items/c299c2332f3c132680a9)


##タグのフォロー数、タグを含む記事数、キーワード記事10件分
###処理コード

```JavaScript
//定数を各種定義し代入
const axios = require('axios'); 
const accessT = '自分のアクセストークンを指定';
const NameEnglish = 'Motorcycle';

//関数mainを定義
async function main() {
  //★[Motorcycle]タグをフォローしている人の数
  try{
    let response1 = await axios.get('https://qiita.com/api/v2/tags/Motorcycle', {
      headers: {
        'Authorization': `Bearer ` + accessT
      }
    });
    console.log('1[' + NameEnglish + ']タグのフォロワー数:'+ response1.data.followers_count);
    } catch(e) {
    }
  //★[Motorcycle]タグを含む記事の数
  try{
    let response2 = await axios.get('https://qiita.com/api/v2/tags/Motorcycle', {
	    headers: {
        'Authorization': `Bearer ` + accessT
      }
    });
    console.log('2[' + NameEnglish + ']タグを含む記事数:'+ response2.data.items_count); 
  } catch(e) {
  }
  //★[Motorcycle]をキーワードとして含む記事の一覧20件分(Title,URL,LGTM数)
  let response3 = await axios.get('https://qiita.com/api/v2/items?per_page=10&page=1&query='+ NameEnglish, {
    headers: {
      'Authorization': `Bearer ` + accessT
    }
  });
  console.log('| Title | URL | LGTM数 |');
  console.log('|:-|:-|:-:|');
  for (let i = 0; i < response3.data.length; i++) {
    //ログを表示させるのみ
    console.log('|'+ response3.data[i].title +'|'+ response3.data[i].url +'|'+ response3.data[i].likes_count +'|');
  }
}

main();
```
###処理結果
[Motorcycle]タグは存在していないようですね・・・:sob:
エラー回避が作用処理はうまく作動しましたのでよかったです！
そのあとの[Motorcycle]キーワードの一覧もコンソールログ表示もうまく動きました。

####[Motorcycle]タグをフォローしている人の数

```javascript
1[Motorcycle]タグのフォロワー数:0
```
####[Motorcycle]タグを含む記事の数
```javaScript
2[Motorcycle]タグを含む記事数:0
```
####[Motorcycle]をキーワードとして含む記事の一覧10件分(Title、URL、LGTM数)
<details><summary>10件分</summary><div>

| Title | URL | LGTM数 |
|:-|:-|:-:|
|【JavaScript活用】QiitaAPIを活用してバイク好きがいるか調べてみた|https://qiita.com/yui-kouy/items/ddcf699b743adedb32db|3|
|【物体検出】YOLOv5 で動画のモザイク(ぼかし)処理を自動化してみる【動画編集】|https://qiita.com/hkwsdgea_ttt2/items/ba2e5dddc11d84da0428|1| 
|MLP-MixerのすごさをPython Pytorch実装しながら体感してみる。|https://qiita.com/keiji_dl/items/9ce952c8bb121eda94c8|3|
|GCP Video Intelligence: ローカルにある動画ファイルの読込みは、input_uriではなくinput_content引数を使う|https://qiita.com/electronics_diy721/items/bc7992345a07a154c346|0|
|予約サイトの設計|https://qiita.com/touringstay/items/83d8975278e37336b016|0|
|【YOLOv5 ②】Google ColabでYOLOv5とtorch hubを使って物体検出の検出座標を出力する|https://qiita.com/hkwsdgea_ttt2/items/879c91a4bb5f1a0bb513|4|
|Salesforce で Custom Tab を作成するときに指定できる motif タグの選択肢全て|https://qiita.com/itouchitachi/items/7fc0df4ba40a77f52fb5|0|   
|ディープラーニングの活用：コンピュータビジョン (Semantic Segmentation / Object Detection)|https://qiita.com/taichinakabeppu/items/f6838b954d3a8464333f|2|
|【MMDetection】 データセットのカスタマイズ編|https://qiita.com/bellpond/items/84c718608adeeca2a2f0|0|
|OKI AIエッジコンピューター「AE2100」で動く物体検出プログラムを作ろう (1) ―基礎編―|https://qiita.com/TWAT/items/0cbf6286e921f7c5664e|4| 
</div></details>

##Csv書き出し（キーワードが含まれた記事のタイトル、URL、LGTM(＝いいね！）を100件分）
一から書いてみようと思いましたが、やっぱり難しく以下記事を参考にさせていただきました。
前回できなかったCsv書き出しが無事に動いたので、いったんリベンジ完了です:laughing:
★参考：[JavaScriptとQiitaAPIで取得した人気タグ情報をplotlyで散布図表示してみる](https://qiita.com/ranchi1977/items/73f1346cf15798f52444)

###処理コード

```JavaScript
//package require
const axios = require("axios");
const fs = require("fs");
const csvStr = require("csv-stringify/lib/sync");
const csvParse = require('csv-parse/lib/sync');
const NameEnglish = 'Motorcycle';
const accessT = '自分のアクセストークンを指定';

//QiitaAPIでデータ取得・csvに出力
async function getArticle(query) {
    //csvに変換する用list
    let outcsv = [];
   //csvのヘッダー設定
    let columns = ['Title','URL','LGTM'];
    outcsv.push(columns);
    let response
    //リクエストが失敗した時の処理
    response = await axios.get('https://qiita.com/api/v2/items?per_page=100&page=1&query=' + NameEnglish, {
    headers: {
      Authorization: `Bearer ` + accessT,
    }
    }
      ).catch(err => {
      return err.response
    });
    if (response.status != 200) {
        console.log("APIエラーとは・・・？")
    }
    //Csv書き出し準備
    for (let i = 0; i < response.data.length; i++) {
      //listに格納
      let record = [];
      record.push(response.data[i].title,response.data[i].url,response.data[i].likes_count); 
      outcsv.push(record);
    }
    //Csvとして出力
    fs.writeFileSync('./list_'+ NameEnglish +'.csv', csvStr(outcsv));
}
//情報の取得
var query = "node.js";
getArticle(query);
```

###処理結果

Visual Studio Codeで中を開くと、Csv形式になっていました:raised_hands:わーい！（画像上は途中省略しています。）
100件上限にしましたが67件しかないことが判明しました:scream_cat:
![CsvData.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2122199/c6a76334-ad64-d270-809f-af15a053ad63.png)
Explorer上Csvファイルが保存されていることも確認できました。
![Csv.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2122199/386778ae-2a60-2ebb-6b0e-5637c91b0188.png)
Csvファイルを開くと文字化けしておりました。リベンジ完了と書きましたが、文字化け回避リベンジが必要ですね:fire::fire::fire:うおぉぉぉ！！！

#考察
10件分のリスト化されたURL先の文書を見ての考察といたします。
・物体認証AIのディープラーニングの返り値がバイク＝[Motorcycle]となっているので[Motorcycle]がヒットしているだけの記事が多数存在。
・Motorcycleクラスという謎の単語が出てきた。(別途調べようと思います。)
・[Motorcycle]＝バイクが好きだということで投稿している文書は見つからなかった。
・日本語の記事は[Motorcycle]より[バイク]・[bike]をキーワードとして用いることが多いと推測。
・バイクが好きな人はキーワードとして[バイク]を使っていると推測。

#さいごに
日本語としては[Motorcycle]という言葉を文章内に使うことが少ないことがわかりました。
バイクが好きな人はキーワードとしては[バイク]を使っているのかな、と思います。
確かに会話の中で「私はMotorcycleが好き！」とは言わないかも。
今回は単純にCsv書き出しを:fire:<font color="#ff0000">**リベンジ** </font>:fire:しましたが、文字化け回避はリベンジしたい・・・
色々チャレンジしながらステップアップしたいです！
ついでに折り畳みもリベンジできました:stuck_out_tongue_closed_eyes:

#記事の書き方で参考にしたURL
| 記事名(サイト表題) | URL |
|:-|:-|
| Qiitaの投稿で装飾したいときによく使うHTMLタグ |https://qiita.com/7note/items/9c0763d5491e43edb552 |
| 絵文字チートシート | https://www.webfx.com/tools/emoji-cheat-sheet/ |
| WEB色見本 原色大辞典 - HTMLカラーコード | https://www.colordic.org/ |