json-serverの復習

最近SPAと触れ合っているのですが、フロントエンド実装中に連携APIサーバーが（お金的に）用意（出来なく）しきれなくて、ダミーAPIを作成して開発しています。

そこで使うJSON Server について備忘をば。

#JSON ServerはダミーAPIツール
JSON ServerはCreate、Read、Update、Deleteといったデータ連携の基本的な操作であるCRUD機能がある。

#JSON Serverのインストール

npm install --save-dev json-server

#初期データの作成
インストール完了後、db.json というファイル名で以下のようなJSONファイルを作成、pacakage.jsonと同じ階層に配置する。

{"todos":
  [
    {"id":1,"todo":"ID-1のTODO","completed":false},
    {"id":2,"todo":"ID-2のTODO","completed":true}
  ]
}

#JSON Serverの起動

npx json-server --watch db.json

JSON Serverが立ち上がるとコンソールに以下の出力がある。

  \{^_^}/ hi!

  Loading db.json
  Done

  Resources
  http://localhost:3000/todos

  Home
  http://localhost:3000

  ・・・・・
  ・・・・・
  ・・・・・
  ・・・・・

※db.jsonに既にresourceを作成済みなので、resourcesが表示される
#動作確認

##Create
POSTでTODOを追加してみる。

terminalからcurlで実行

curl --request POST --header "Content-Type: application/json" --data '{"todo":"IDxxxのTODO","completed":false}' "http://localhost:3000/todos/"

http://localhost:3000/todos にアクセスすると現在のデータがわかる。

idを指定していないのでおそらく、「IDが自動附番」されているはず。
id指定して入れることも可能。（それがいいかどうかはちょっとわからぬ）

##Read
http://localhost:3000/todos アクセスすると以下のようなJSONが出力されるのが確認できる。

{"todo":"IDxxxのTODO","completed":false,"id":1}]

##Update
UpdateするときはPUT
PUTで更新したいレコードのidをURLに付け、更新したい内容を指定
※該当IDの内容を全部送る

curl --request POST --header "Content-Type: application/json" --data '{"todo":"IDxxxのTODOを変更","completed":true}' "http://localhost:3000/todos/1"

##Delete
削除したいレコードのidをURLに付けDELETEメソッドを実行。

curl --request POST "http://localhost:3000/todos/1"

#もうちょい高度に
db.jsonファイルの中身を以下の様にしてみる。

{
  "todos": [
    { "id": 1, "todo": "TODO-1", "completed": "false" }
  ],
  "description": [
    { "id": 1, "text": "comment"}
  ],
  "user": { "name": "shihou22" }
}

※ルート直下のkey項目がそのままResource urlとなる

http://localhost:3000/todos
http://localhost:3000/description
http://localhost:3000/user