💻

json-serverで簡単モックサーバ

2020/12/08に公開

はじめに

以前にREST API作成に役立つSwaggerを紹介しました。

参考：VSCodeでSwaggerViewerを導入する

あれはあれで便利なのですが、APIを作成する先の行程にある「ドキュメント作成」まで見据えた作りになっているので「ちょっとモックを立てたいだけなんだよなぁ」といった場合には大仰すぎるかもしれません。

そんな場合に便利なjson-serverというライブラリについて記事にしたいと思います。

json-serverとは

参考：npm | json-server

json-serverはnodeベースのライブラリで、JSONからREST APIのモックサーバを立てることができます。
巷では30秒でノーコーディングでサーバを立てられるなんて触れ込みで紹介されてたりします。

インストール

yarn add json-server

使用方法

使用方法は簡単で、JSONを作成するだけです。

サンプルデータの作成

サンプルとなるJSONを作成していきます。
今回は下記のようなJSONを用意しました。

hoge.json

{
  "hoge": [
    {
      "id": 0,
      "value": "HOGE"
    },
    {
      "id": 1,
      "value": "FUGA"
    },
    {
      "id": 2,
      "value": "PIYO"
    }
  ]
}

起動

下記コマンドでJSONを指定して起動します。

npx json-server --watch hoge.json

するとlocalhost:3000でサーバが立ち上がります。

json-server1

さらにlocalhost:3000/hogeにアクセスしてみると・・・

json-server2

先ほどのhoge.jsonで指定した内容が表示されます。
localhost:3000/hoge/{id}で別個のデータを取得できますし、POSTすることでデータの追加も行うことができます。

まとめ

今回はjson-serverのインストールと使い方について紹介しました。
確かにJSONを作るだけでモックの立ち上げまでできたので、クライアントサイドとちょっとした導通を検証したい場合には非常に役立つと感じました。

正式に仕様を固めていく場合には前述のSwaggerの方が役立つと思うので、そのあたりは使い分けかなと思います。