Creating a JSON Server
1. Create a folder in the root directory of your project and call it "Data".
2. Within the "Data" folder, create a file and call it my.json
.
3. Copy the following into the newly created my.json
file.
{ "Posts": [{ "userId": 1, "id": 1, "title": "sunt aut facere repellat provident occaecati excepturi optio reprehenderit", "body": "quia et suscipit\nsuscipit recusandae consequuntur expedita et cum\nreprehenderit molestiae ut" }, { "userId": 1, "id": 2, "title": "qui est esse", "body": "est rerum tempore vitae\nsequi sint nihil reprehenderit dolor beatae ea dolores neque " }, { "userId": 1, "id": 3, "title": "ea molestias quasi exercitationem repellat qui ipsa sit aut", "body": "et iusto sed quo iure\nvoluptatem occaecati omnis eligendi aut ad" }, { "userId": 1, "id": 4, "title": "eum et est occaecati", "body": "ullam et saepe reiciendis voluptatem adipisci\nsit amet autem assumenda provident rerum" } ] }
"Posts": is called the top-level key, which you need to define for each "patch" of resources. Depending on it, you can locate/access the JSON data.
By now, the data is there but we still need to create the JSON server
1. In the terminal, use the following command to install the json-server:
>> npm install json-server
2. To run the json-server, use the following command in the terminal:
>> json-server --watch Data/my.json
Note: Data/my.json
should be the right directory where your JSON data is stored. If you use a different directory, .json file name, update accordingly.
If the previous command did not work, try the following one
>> npx json-server --watch
If everything is ok, you should see something like the following:
Resources http://localhost:3000/Posts
Test the resource but copying this URI and pasting it into the address bar of your browser.