JavaScript
JSON

JSON Server - 簡単にAPIのモックを作成

More than 3 years have passed since last update.

Apiの実装がまだ終わっていないので、フロントの作業が進まない、、

そんな時にJSON Serverを使って、ローカル環境にAPIのモックアップを作ることができました。


インストール

npm install -g json-server

以上です。


JSONデータを用意

保存場所はデスクトップでもどこでも大丈夫です。

db.jsonといった名前でJSONファイルを保存してください。

{

   // ルーティングのためのキーが必要
"list": [
{
"id": 1
"name": "yamada"
"gender": "M"
},
{
"id": 2
"name": "satou"
"gender": "W"
},
{
"id": 3
"name": "tanaka"
"gender": "M"
}
]
}


Json-serverを起動

db.jsonを使って、Json-serverを起動します。

$ json-server --watch db.json

\{^_^}/ hi!

Loading db.json
Done

Resources
http://localhost:3000/list

Home
http://localhost:3000

Type s + enter at any time to create a snapshot of the database

Watching...

あとはhttp://localhost:3000/listにアクセスするだけで良いようです。

curl http://localhost:3000/list

[
{
"id": 1
"name": "yamada"
"gender": "M"
},
{
"id": 2
"name": "satou"
"gender": "W"
},
~
]


POST形式でリクエストする

POST形式でリクエストすると、db.jsonに送信したデータが保存できます。

curl -X POST http://localhost:3000/list -d name=fugafuga

{
"name": "fugafuga",
"id": 4
}

これで、"name": "fugafuga" なレコードが追加されます。

GruntやGulpを使わずとも簡単にAPIのモックを作ることができました。routesを設定すれば、もう少し色々できそう。気軽にモックを作成したい時に使っていきたいと思います。


参考