Docker×ReDoc×Prismで快適なAPI開発環境を構築する

はじめに

まずは今回の登場人物の紹介から。

• ReDoc
  • https://github.com/Redocly/redoc
  • OpenAPIをかっこいい見た目で表示できる
• Prism
  • https://github.com/stoplightio/prism
  • APIのモックサーバーを作ることができる

ReDocでかっこいいAPI仕様書を作って、Prismで仕様書に定義した値を返すAPIのモックサーバーを立てよう！
というのが、今回の記事の内容です。

事前準備

Dockerの環境構築を完了させておいてください。
また、OpenAPIの記述方法については、本記事では扱わないので、事前に学習しておいてください。

docker-compose.yml

以下のように記述する。

docker-compose.yml

version: '3.9'
services:
  doc:
    image: redocly/redoc
    volumes:
      - ./api:/usr/share/nginx/html/api
    environment:
      SPEC_URL: api/swagger.yml
    ports:
      - 8080:80
  mock:
    image: stoplight/prism
    volumes:
      - ./api:/api
    command: >
      mock -h 0.0.0.0 /api/swagger.yml
    ports:
      - 4010:4010

APIの仕様を定義する

OpenAPIを開発するときのディレクトリ構成のやり方は色々あると思いますが、今回は以下のような構成にしてみました。
サンプルを用意したので、詳しくはこちらをご覧ください。

root/
　├ docker-compose.yml
　└ api/
　　├ specification.yml
　　├ common/
　　│　└ models/
　　├ user/
　　│　├ paths/
　　│　└ models/
　　└ book/
　　　　├ paths/
　　　　└ models/

起動する

$ docker-compose up

APIの仕様を確認する

http://0.0.0.0:8080 にアクセスする。
見た目はこんな感じ。とってもかっこいい。

APIのモックを叩く

http://0.0.0.0:4010 でモックサーバーが立ち上がっている。

# 例: ユーザー一覧を取得する
$ curl -X GET -H "Content-Type: application/json" 'http://0.0.0.0:4010/v1/users'

最後に

SwaggerとReDocのどちらを使うかは好みの問題だけど、個人的にはReDocを推したい。
途中にも書きましたが、サンプルを用意しましたので、よかったらご覧ください。