Dribbble API を Rubyで利用する

# もくじ
- Dribbbleとは？
- Dribbble APIとは？
- 準備
- 解説
    - 1. RubyからDribbble APIを実行する
    - 2. shotsの情報を1件ずつ取り出せるようにする
    - 3. Shotsの情報から必要な情報だけ取り出す

# Dribbbleとは？
![dribbble03.png](https://qiita-image-store.s3.amazonaws.com/0/141934/a721623e-a38a-2f7e-5700-b9bcc852e8e3.png)

[Dribbble \- Show and tell for designers](https://dribbble.com)

デザイナー向けの招待制SNSです。

# Dribbble APIとは？
![dribbble02.png](https://qiita-image-store.s3.amazonaws.com/0/141934/d02e50ab-ef21-1d19-e6e3-dfdeccb47aa9.png)

[Overview \| Dribbble API](http://developer.dribbble.com/v1/)

Dribbbleが提供している開発者向けAPIです。
このAPIを利用すること投稿された作品(Shots)の情報などが取得できるようになります。

# 準備
Dribbble APIを使う準備についてはこちらの投稿を参考にさせていただきました。

[Dribbble APIの使い方とランダムに画像とってくるやつの作り方 \- Qiita](https://qiita.com/nmta/items/663f40d64ed69b8aff12)

# 解説
RubyからDribbble APIを利用してShotsの情報を取得します。

[Shots \| Dribbble API](http://developer.dribbble.com/v1/shots/)

## サンプルプログラム
![github-card.png](https://qiita-image-store.s3.amazonaws.com/0/141934/66cfd88d-03f3-259c-9c42-0a8916547a1b.png)

解説に利用したプログラムをGitHubで閲覧したい方はこちらからどうぞ。

[Ruby\-Sample\-Dribbble/Qiita at master · NaokiIshimura/Ruby\-Sample\-Dribbble](https://github.com/NaokiIshimura/Ruby-Sample-Dribbble/tree/master/Qiita)

## 1. RubyからDribbble APIを実行する

HTTPリクエストの送信には（私が使い慣れているという理由で）Faradayを利用するのでインストールしておきます。

```shell-session
$ gem install faraday
```

Applicationを登録すると発行される`Client Access Token`を変数`token`に、とリクエストURLを`url`を設定します。

リクエストURLには`sort=recent`という条件を追加してあります。

```ruby:sample1.rb
# tokenを設定する
token = '<Client Access Token>'
# URLを設定する
url = 'https://api.dribbble.com/v1/shots?sort=recent'

# リクエストを送信
require 'faraday'

client = Faraday.new
res = client.get do |req|
  req.url url
  req.headers['Authorization'] = "Bearer #{token}"
end

# レスポンスを表示
puts '>>> STATUS'
p res.status

puts '>>> BODY'
p res.body
```

実行するとレスポンスボディにjson形式の文字列が返却されます。

```shell-session
$ ruby sample1.rb

>>> STATUS
200
>>> BODY
"[\n  {\n    \"id\": 3874819,\n    \"title\": \"The Good Photo Co.\", ...
...
```

DribbbleのRecentでソートしたShotsと比較すると1件目の作品名がjsonでも取得できてることがわかります。

![dribbble01.png](https://qiita-image-store.s3.amazonaws.com/0/141934/e1602a7a-1571-3f85-7513-0d8eddcc0496.png)

## 2. shotsの情報を1件ずつ取り出せるようにする

レスポンスボディを扱いやすくするために、jsonに変換します。

レスポンスボディには複数のjsonオブジェクトが（こんな{},{},{},,,感じに複数）含まれているため、jsonに変換してshotsの情報を1つずつ取り出せるようにします。

```ruby:sample2.rb
# tokenを設定する
token = '<Client Access Token>'
# URLを設定する
url = 'https://api.dribbble.com/v1/shots?sort=recent'

# リクエストを送信
require 'faraday'

client = Faraday.new
res = client.get do |req|
  req.url url
  req.headers['Authorization'] = "Bearer #{token}"
end

# レスポンスを表示
puts '>>> STATUS'
p res.status

# レスポンスボディをパースする
require 'json'

body = JSON.parse res.body

# jsonオブジェクトを1つずつ取り出す、
body.each.with_index(1) do |shots, i|

  # Shotsの情報を表示
  puts ">>> SHOTS:#{i}"
  p shots

end
```

実行すると、Shotsの情報が1件ずつ取り出せるようになります。

```shell-session
$ ruby sample2.rb

>>> STATUS
200
>>> SHOTS:1
{"id"=>3874823, "title"=>"October 14 2017- Daily Vectors", ...
...
>>> SHOTS:12
{"id"=>3874806, "title"=>"Tank Stream App", ...
...
```

## 3. Shotsの情報から必要な情報だけ取り出す

最後にshotsの情報から必要な項目だけを取り出します。
`id`と`hidpi`の情報を取得する場合は以下のようになります。

```ruby:sample3.rb
# tokenを設定する
token = '<Client Access Token>'
# URLを設定する
url = 'https://api.dribbble.com/v1/shots?sort=recent'

# リクエストを送信
require 'faraday'

client = Faraday.new
res = client.get do |req|
  req.url url
  req.headers['Authorization'] = "Bearer #{token}"
end

# レスポンスを表示
puts '>>> STATUS'
p res.status

# レスポンスボディをパースする
require 'json'

body = JSON.parse res.body

# jsonオブジェクトを1つずつ取り出す、
body.each.with_index(1) do |shots, i|

  # Shotsの情報を表示
  puts ">>> SHOTS:#{i}"
  p shots['title']
  p shots['images']['hidpi']

end
```

実行するとshotsの`id`と`hidpi`の情報が取得できます。

```shell-session
$ ruby sample3.rb 

>>> STATUS
200
>>> SHOTS:1
"TIWMUG"
"https://cdn.dribbble.com/users/1186561/screenshots/3874835/tiwmug.png"
>>> SHOTS:2
"Russian Yeti"
"https://cdn.dribbble.com/users/1186561/screenshots/3874834/russian_yeti.png"
...
```