まだAPIで消耗しているの？[Part2]

[Part1の続きです](https://qiita.com/shumatsukishu/items/ae1bb06dd6e1400235bf)

もし<font color="Red">**API**</font>がなんなのかまだわからない人は、前回の[Part1](https://qiita.com/shumatsukishu/items/ae1bb06dd6e1400235bf)に行くことをおすすめします👍

# [Part2]でやること
今回は、APIを叩く際に非常に便利な<font color="Red">**ツール**</font>を２つ紹介します。

まず、確認として、APIを叩く上で絶対に重要なことが、、、
<font color="Red">**①リクエストするURLを正確に作成する**</font>
<font color="Red">**②JSONに対応したモデルを作成する**</font>
→これを補うツールがあるのでそれを紹介します

●対象者：リクエストの書き方がまだわからない人、JSONに対応したモデルを作成することが出来ない人

●どんな言語でも問題ありません。




## Restlet Client

●[Restlet Client](https://restlet.com/modules/client/): REST APIを簡易的にテストするツール
→ 簡単に言うと、<font color="Red">URLをリクエストし、JSONを返す</font>までをテストしてくれます。

**使用用途**
①URLの書き方が正しいのか確かめたい時　→ 合っていたらJSONが返ってくる。
②JSONの構造を知りたい時　→　使用する言語で分析するにはJSONの形を考慮しないといけないため

**セットアップ**
下記の記事を参考にして、クロームにRestlet Clientに取り込みましょう！！！
>https://qiita.com/84zume/items/fac99705c39d2f18ada7

###実際に使用していきます
今回は、YouTubeのAPIを使用していきたいと思います。
まずは、GoogleからYouTubeの<font color="Red">**apiKey**</font>を取得してきましょう👍
(下記の記事を参考にしてください！)
>https://www.d2c-smile.com/201611018039
 
####①まずはプロジェクトを作成しましょう！
<img width="1676" alt="スクリーンショット 2019-04-18 14.51.52.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/302458/71491a0b-4133-523a-b0da-0c7aeffc0e0a.png">

####②使用するURLを作成しましょう
[YouTube Data API(v3)のSearch:list](https://developers.google.com/youtube/v3/docs/search/list?hl=ja)を参照し、URLを作成します。
●メイン
→https://www.googleapis.com/youtube/v3/search
●まずは、apikeyを含ませます
→https://www.googleapis.com/youtube/v3/search?key=あなたのapiKey
●次に必須の条件、[part](https://developers.google.com/youtube/v3/docs/search/list?hl=ja)を含ませます。また、今回はネストされているプロパティをすべて取得するので、
<img width="863" alt="スクリーンショット 2019-04-18 15.45.12.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/302458/b3deccbc-4cfa-5601-52a9-5532fc00f9b8.png">
→ https://www.googleapis.com/youtube/v3/search?key=あなたのapiKey&<font color="Red">**part=snippet**</font>
●最後に検索する内容(q=)を含ませます,今回はHikakinで検索します
<img width="855" alt="スクリーンショット 2019-04-18 22.55.16.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/302458/bf08c515-d347-072f-e0b5-130c5be3c9d7.png">
→　https://www.googleapis.com/youtube/v3/search?key=あなたのapiKey&part=snippet&<font color="Red">**q=Hikakin**</font>

**これでURLは完成です！！！！**

####③Restlet ClientでURLを叩く！
最後に作ったURLを赤で囲った所に入れます
<img width="1678" alt="スクリーンショット 2019-04-18 23.14.12.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/302458/f4f2d9e3-d0cb-24ed-9e3a-ba969202c244.png">

そして、<font color="Blue">**send**</font>ボタンを押します！！！！！
→これが**リクエスト**です！！

そうすると,**JSONでレスポンス**が返ってきます！
<img width="1247" alt="スクリーンショット 2019-04-19 1.35.37.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/302458/b6da8523-14a4-6e8d-2aab-338b60e9a3f4.png">



これで、<font color="Red">**URLの正確性**</font>、<font color="Red">**JSONの構造**</font>が把握できましたね！


ここで取得できた、<font color="Red">**JSON**</font>は次のツールで使用します！！

## QuickType

●[QuickType](https://quicktype.io/): JSONデータから様々なプログラミング言語のモデルを自動生成してくれるツール


**対応言語**
C#
Go
C++
Java
TypeScript
Simple Types
Swift
Elm
Schema

**使用用途**
●JSONデータを自分の使用するプログラミング言語で認識できるモデルを作りたい時

**セットアップ**
こちらから→[QuickType](https://quicktype.io/)
<font color="Red">**登録不要&無料**</font>なので、すぐ利用でき、<font color="Crimson">**TRY NOW**</font>を押すだけです！！！！
<img width="1674" alt="スクリーンショット 2019-04-19 13.21.37.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/302458/2c762e98-a05c-a584-4518-81d2be011664.png">

###実際に使用していきます！
####①使用するプログラミング言語を設定する!
<img width="1675" alt="スクリーンショット 2019-04-19 13.46.11.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/302458/c78b8d57-f7f6-e6da-713c-f81bc1245279.png">

####②Restlet Clientにて、レスポンスのJSONをQuickTypeに取り入れる

●まずは、先程作ったJSONを丸々コピーします！
<img width="1239" alt="スクリーンショット 2019-04-19 18.53.16.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/302458/537d8f28-aef7-949f-f196-3118739a7cbe.png">

●コピーしたJSONを打ち込むと、、、モデルを自動生成してくれます！！！
<img width="1665" alt="スクリーンショット 2019-04-19 19.02.00.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/302458/4d85f19b-9e73-3a19-cb47-57e4ae39ce47.png">

これにて<font color="Red">**無事終了**</font>です！！！

##まとめ
では手順をおさらいします！！

**①Restlet Clientで新規プロジェクトを準備します**
**②次に使いたいサービスのAPIを叩くために必要なURLを作成します**
**③Restlet ClientでURLを叩いてJSONを取得する**
**④QuickTypeで自分のプログラミング言語を設定する**
**⑤JSONより、モデルを作成する**

以上です！！！！！！！！！！！！

## 予告:Part3[YouTube編]
<font color="Red">**※Part3はSwift限定です！！！**</font>

次回より、、、なんと、、、自分のアプリにAPIのデータを取り込んでいきます👍
取り込む際に使うのが、<font color="Red">**モデル**</font>なので全て繋がっているのです！！！！

●得られるモノ：YouTubeのAPIとSwiftを使用したアプリ作成の仕方

●使用する技術：Alamofire,Codable,Struct

SwiftでAPIを叩いたアプリの紹介例が殆どなかったので、参考になるかと思います！！！！！

乞うご期待、、、👍