Как можно подменить ответ бэкенда для локальной разработки, когда бэкенд ещё не готов?

Зачем мокировать бэкенд

Когда бэкенд ещё не готов, фронтенд-разработчику нужно продолжать работу. Мокирование ответов позволяет имитировать поведение сервера, чтобы проверять интерфейс, обрабатывать состояния загрузки и ошибки, не дожидаясь реального API.

Основные подходы

• Mock Service Worker (MSW) — перехватывает запросы на уровне сети и возвращает заданные данные. Работает в браузере и в тестах.
• Локальный сервер-заглушка — простой Node.js или Express сервер, который отдаёт фиксированные JSON-ответы.
• Прокси-инструменты — Charles, Fiddler или mitmproxy позволяют перехватывать запросы и подменять ответы без изменения кода.

Пример с MSW

// mocks/handlers.js
import { rest } from 'msw'

export const handlers = [
  rest.get('/api/user', (req, res, ctx) => {
    return res(
      ctx.status(200),
      ctx.json({ id: 1, name: 'John' })
    )
  })
]

// в браузере подключите worker
import { setupWorker } from 'msw'
const worker = setupWorker(...handlers)
worker.start()

После запуска все запросы к /api/user будут возвращать мок-данные, и фронтенд сможет работать автономно.

Когда применять

Мокирование полезно не только при отсутствии бэкенда, но и для тестирования редких сценариев, например, ошибок сервера или медленных ответов. Это ускоряет разработку и делает её независимой от внешних зависимостей.

Итог: используйте мокирование, чтобы продолжать разработку фронтенда без готового API, а также для стабильных тестов и демонстрации интерфейса.