Бывают случаи, когда вы создаете программное обеспечение или часть программного обеспечения, которое полагается на сетевые запросы, но ваша внутренняя инфраструктура еще не готова. Что вы обычно делаете?

  1. Создать компонент без сетевых вызовов?
  2. Создать компонент с использованием фиктивных данных?

Хотя 2 лучше, чем 1, они оба в конечном итоге неэффективны и заставляют вас работать вдвое больше.

Знакомство с сервером JSON

Шаг 1. Чтобы настроить сервер JSON, выполните следующую команду:

npm install -g json-server

Шаг 2. Создайте файл db.json с некоторыми данными

{
 “posts”: [
 { “id”: 1, “title”: “learn json-server”, “author”: “Mrinmay Mukherjee” }
 ],
 “comments”: [
 { “id”: 1, “body”: “it's pretty awesome”, “postId”: 1 }
 ],
 “profile”: { “name”: “Mrinmay Mukherjee” }
}

Шаг 3. Запустите сервер JSON

json-server --watch db.json --port 8000

Это запускает локальный сервер на порту 8000 и следит за файлом db.json на предмет любых изменений. В случае каких-либо изменений сервер перезагружается, и изменения автоматически и безопасно сохраняются в db.json

Вот и все. Теперь вы можете начать делать GET, POST, PUT, PATCH или DELETE вызовы на ваш фиктивный сервер и полностью создавать необходимые компоненты, так что единственное, что осталось сделать после того, как серверная инфраструктура будет запущена и запущена, - это заменить URL-адрес localhost. с производственным URL.

Примеры GET и POST:

  1. GET
fetch(‘http://localhost:8000/posts/')
 .then(response => response.json())
 .catch(error => console.error('Error:', error))
 .then(response => console.log('Success:', JSON.stringify(response)));

2. POST

let data = { 
  “id”: 10, 
  “title”: “json-server is not bad. It's great!”, 
  “author”: “Dwight Shrute” 
}

 fetch(‘http://localhost:3000/posts/', {
 method: “POST”,
 headers: {
 “Content-Type”: “application/json”,
 },
 body: JSON.stringify(data),
 })
 .then(response => response.json())
 .catch(error => console.error(‘Error:’, error))
 .then(response => console.log(‘Success:’, JSON.stringify(response)));

JSON Server - исключительная библиотека, и ее утилиты выходят далеко за рамки того, что было упомянуто в этой статье. Я призываю всех прочитать их документацию.

Удачного дня. Ваше здоровье!