node.js:jsonserver
差分
この文書の現在のバージョンと選択したバージョンの差分を表示します。
| 両方とも前のリビジョン 前のリビジョン 次のリビジョン | 前のリビジョン | ||
|
node.js:jsonserver [2019/12/05 00:56] ips |
node.js:jsonserver [2019/12/31 08:07] (現在) ips ↷ node:jsonserver から node.js:jsonserver へページを移動しました。 |
||
|---|---|---|---|
| ライン 7: | ライン 7: | ||
| ===== Getting started ===== | ===== Getting started ===== | ||
| + | ==== １．ディレクトリ作成 ==== | ||
| <code bash> | <code bash> | ||
| - | // １．ディレクトリ作成 | ||
| $ mkdir jsonsever | $ mkdir jsonsever | ||
| $ cd jsonserver | $ cd jsonserver | ||
| + | </code> | ||
| - | // ２．グローバルインストール | + | ==== ２．グローバルインストール ==== |
| + | もしグローバルインストールでなければnode_modules/.bin/ にあるモジュールを実行する...面倒です。 | ||
| + | <code bash> | ||
| $ npm install -g json-server | $ npm install -g json-server | ||
| + | </code> | ||
| - | // ３．レスポンス元となるjsonファイル作成 | + | ==== ３．レスポンス元となるjsonファイル作成 ==== |
| - | // /jsonserver/db.json | + | <code bash /jsonserver/db.json> |
| { | { | ||
| "users": [ | "users": [ | ||
| ライン 23: | ライン 26: | ||
| { "id": 2, "name": "hana"} | { "id": 2, "name": "hana"} | ||
| ] | ] | ||
| - | } | + | } |
| + | |||
| + | </code> | ||
| + | |||
| + | ==== ４．routeファイル作成 ==== | ||
| + | <code bash /jsonserver/routes.json> | ||
| + | { | ||
| + | "/users/:id": "/users/?id=:id" | ||
| + | } | ||
| + | </code> | ||
| - | // ４．json-serverを実行する | + | ==== ５．json-serverを実行する ==== |
| - | >json-server --watch db.json | + | <code> |
| + | >json-server --watch db.json --routes routes.json | ||
| - | \{^_^}/ hi! | + | \{^_^}/ hi! |
| Loading db.json | Loading db.json | ||
| + | Loading routes.json | ||
| Done | Done | ||
| Resources | Resources | ||
| http://localhost:3000/users | http://localhost:3000/users | ||
| + | |||
| + | Other routes | ||
| + | /users/:id -> /users/?id=:id | ||
| Home | Home | ||
| ライン 41: | ライン 58: | ||
| Type s + enter at any time to create a snapshot of the database | Type s + enter at any time to create a snapshot of the database | ||
| Watching... | Watching... | ||
| - | | ||
| - | // ５．http://localhost:3000にアクセスするだけ | ||
| </code> | </code> | ||
| - | {{:node:pasted:20191205-001025.png}} | + | === ６．アクセス === |
| - | {{:node:pasted:20191205-001249.png}} | + | <code> |
| + | // http://localhost:3000 | ||
| + | // スタートアップ画面 | ||
| - | ===== Routes ===== | + | Congrats! |
| + | You're successfully running JSON Server | ||
| + | ✧*｡٩(ˊᗜˋ*)و✧*｡ | ||
| + | </code> | ||
| + | |||
| + | <code> | ||
| + | // http://localhost:3000/users | ||
| + | [ | ||
| + | { | ||
| + | "id": 1, | ||
| + | "name": "safa" | ||
| + | }, | ||
| + | { | ||
| + | "id": 2, | ||
| + | "name": "hana" | ||
| + | } | ||
| + | ] | ||
| + | </code> | ||
| + | |||
| + | <code> | ||
| + | // http://localhost:3000/users/2 | ||
| + | // routesで設定しているので /users/?id=2 となる | ||
| + | { | ||
| + | "/users/:id": "/users/?id=:id" | ||
| + | } | ||
| + | |||
| + | </code> | ||
node.js/jsonserver.1575475008.txt.gz · 最終更新: 2019/12/05 00:56 by ips
