🍺既存のRailsアプリにJSONを返すAPIを実装してみる

# 既存のRailsアプリにJSONを返すAPIを追加する

## Gem
jbuilderというjsonをいい感じにrubyで書けるGemを使用する。
jbuilderの使い方は以下の記事がわかりやすかった。
[Railsのjbuilderの書き方と便利なイディオムやメソッド](https://qiita.com/ryouzi/items/06cb0d4aa7b6527b3645)

```:Gemfile
gem 'jbuilder', '~> 2.5'
```
bundle installを入力して、gemをインストール

## ルーティング
```ruby:config/routes.rb

  namespace :api, { format: 'json' } do
    namespace :v1 do # バージョン1を表している
      resources :users
    end
  end

```
```
$ rails routes
           api_v1_users GET    /api/v1/users(.:format)                       api/v1/users#index {:format=>/json/}
                        POST   /api/v1/users(.:format)                       api/v1/users#create {:format=>/json/}
        new_api_v1_user GET    /api/v1/users/new(.:format)                   api/v1/users#new {:format=>/json/}
       edit_api_v1_user GET    /api/v1/users/:id/edit(.:format)              api/v1/users#edit {:format=>/json/}
            api_v1_user GET    /api/v1/users/:id(.:format)                   api/v1/users#show {:format=>/json/}
                        PATCH  /api/v1/users/:id(.:format)                   api/v1/users#update {:format=>/json/}
                        PUT    /api/v1/users/:id(.:format)                   api/v1/users#update {:format=>/json/}
                        DELETE /api/v1/users/:id(.:format)                   api/v1/users#destroy {:format=>/json/}
```
namespaceを用いることで、普通のコントローラーとAPI用のコントローラーで分けている。

```ruby:/app/controller/api/v1/users_controller.rb
class Api::V1::UsersController < ApplicationController

  def index
    @users = User.all
  end

  def show
    @user = User.find(params[:id])
  end

end
```


```ruby:/app/view/api/v1/users/index.json.jbuilder
json.array! @users, :name, :age, :gender, :area_id, :home_gelaende, :image, :self_introduction, :comment_count

```

```ruby:/app/view/api/v1/users/show.json.jbuilder
json.user_data do
  json.user @user, :name, :age, :gender, :area_id, :home_gelaende, :image, :self_introduction, :comment_count
  json.comments do
    json.array! @user.comments, :park_id, :body, :like_count
  end
end
```

ほぼテストデータのようなものしかないが、ターミナルでリクエストを投げると以下のようになる。

```Bash
$ curl http://localhost:3000/api/v1/users  
[{"name":"Teruchika Matsubayashi","age":21,"gender":"male","area_id":1,"home_gelaende":null,"image":{"url":null,"thumb":{"url":null}},"self_introduction":null,"comment_count":5},{"name":"Kento Okui","age":22,"gender":"male","area_id":2,"home_gelaende":null,"image":{"url":null,"thumb":{"url":null}},"self_introduction":null,"comment_count":4},{"name":"Shogo Uenishi","age":23,"gender":"female","area_id":3,"home_gelaende":null,"image":{"url":null,"thumb":{"url":null}},"self_introduction":null,"comment_count":4},{"name":"Yuta Okuno","age":24,"gender":"female","area_id":4,"home_gelaende":null,"image":{"url":null,"thumb":{"url":null}},"self_introduction":null,"comment_count":4},{"name":"Kotaro Adachi","age":21,"gender":"male","area_id":5,"home_gelaende":"aaa","image":{"url":"/uploads/user/image/5/20180405184255.jpg","thumb":{"url":"/uploads/user/image/5/thumb_20180405184255.jpg"}},"self_introduction":"aaa","comment_count":1},{"name":"井上 未来","age":20,"gender":"male","area_id":1,"home_gelaende":null,"image":{"url":null,"thumb":{"url":null}},"self_introduction":null,"comment_count":0},{"name":"井上 玲奈","age":20,"gender":"male","area_id":1,"home_gelaende":null,"image":{"url":null,"thumb":{"url":null}},"self_introduction":null,"comment_count":0},{"name":"松井 悠","age":20,"gender":"male","area_id":1,"home_gelaende":null,"image":{"url":null,"thumb":{"url":null}},"self_introduction":null,"comment_count":0},{"name":"小野 凛","age":20,"gender":"male","area_id":1,"home_gelaende":null,"image":{"url":null,"thumb":{"url":null}},"self_introduction":null,"comment_count":0},{"name":"松本 優","age":20,"gender":"male","area_id":1,"home_gelaende":null,"image":{"url":null,"thumb":{"url":null}},"self_introduction":null,"comment_count":0},{"name":"木村 綾乃","age":20,"gender":"male","area_id":1,"home_gelaende":null,"image":{"url":null,"thumb":{"url":null}},"self_introduction":null,"comment_count":0},{"name":"松井 七海","age":20,"gender":"male","area_id":1,"home_gelaende":null,"image":{"url":null,"thumb":{"url":null}},"self_introduction":null,"comment_count":0},{"name":"高田 颯","age":20,"gender":"male","area_id":1,"home_gelaende":null,"image":{"url":null,"thumb":{"url":null}},"self_introduction":null,"comment_count":0},{"name":"佐々木 茜","age":20,"gender":"male","area_id":1,"home_gelaende":null,"image":{"url":null,"thumb":{"url":null}},"self_introduction":null,"comment_count":0},{"name":"石川 一輝","age":20,"gender":"male","area_id":1,"home_gelaende":null,"image":{"url":null,"thumb":{"url":null}},"self_introduction":null,"comment_count":0},{"name":"近藤 空","age":20,"gender":"male","area_id":1,"home_gelaende":null,"image":{"url":null,"thumb":{"url":null}},"self_introduction":null,"comment_count":0},{"name":"西村 拓海","age":20,"gender":"male","area_id":1,"home_gelaende":null,"image":{"url":null,"thumb":{"url":null}},"self_introduction":null,"comment_count":0},{"name":"石井 陸","age":20,"gender":"male","area_id":1,"home_gelaende":null,"image":{"url":null,"thumb":{"url":null}},"self_introduction":null,"comment_count":0},{"name":"福田 大輝","age":20,"gender":"male","area_id":1,"home_gelaende":null,"image":{"url":null,"thumb":{"url":null}},"self_introduction":null,"comment_count":0}]
```

JSONが返ってきた。めでたい。