Интерфейс «Мимика»
Я разработал интерфейс для второй версии Мимика — инструмента веб-разработчика для имитации ответов сервера:
![Интерфейс «Мимика»](/mimic/i/mimic-ui-preview@2x.png?1492589545)
Веб-приложения состоят из фронтенда (того, что работает у пользователя в браузере) и бэкенда (того, что происходит на сервере). Эти части разрабатывают с разной скоростью. Если при создании браузерной части сервер недоступен, разработчик обычно сильно ограничен. Но с Мимиком можно быстро настроить поддельные ответы сервера — «моки» — и продолжать разработку, как если бы сервер был доступен.
Быстрая настройка моков
Допустим, разработчик работает над сохранением заметок в блоге. Когда текст отправляется на сервер, Мимик видит отправленный запрос и показывает его в статусбаре браузера:
![Интерфейс «Мимика»](/mimic/i/mimic-sent@2x.png?1489660088)
Но серверная часть ещё не сделана, поэтому приходит ошибка:
![Интерфейс «Мимика»](/mimic/i/mimic-404@2x.png?1489660149)
Разработчик кликает по запросу и указывает тот ответ сервера, которого он ждёт:
![Интерфейс «Мимика»](/mimic/i/mimic-qe@2x.png?1489660154)
Теперь когда страница сделает этот запрос, Мимик его перехватит и вернёт поддельный ответ, настроенный разработчиком. Такой ответ отображается синим:
![Интерфейс «Мимика»](/mimic/i/mimic-mocked@2x.png?1489660101)
Детальная настройка моков
Часто нужно настроить более сложный ответ, чем просто строчка текста. В зависимости от того, что вы разрабатываете или тестируете, может понадобиться настроить заголовки ХТТП, добавить задержку или даже отправить в ответ файл. Для этого есть детальная настройка моков:
![Интерфейс «Мимика»](/mimic/i/mimic-ui-binary@2x.png?1492589545)
Слева — полный список созданных моков, где их можно включать и выключать по одному или группами. Это нужно для проработки разных сценариев, когда интерфейс создаётся для поддержки разных видов ответа сервера.
Кнопка записи позволяет записать настоящие ответы сервера, а потом использовать их в качестве моков, когда сервер недоступен.
Есть много способов управлять большим списком моков, включая копирование и вставку:
![Интерфейс «Мимика»](/mimic/i/mimic-ui-menu@2x.png?1492590439)
Использование лога
Сложное приложение может отправлять много запросов на сервер. Тогда поймать нужный в статусбаре трудно. Поэтому в Мимике есть лог:
![Интерфейс «Мимика»](/mimic/i/mimic-ui-log@2x.png?1489660253)
Работает поиск и фильтры (в том числе и в списке моков):
![Интерфейс «Мимика»](/mimic/i/mimic-ui-search@2x.png?1489660275)
Экспорт и импорт
Конфигурацию моков можно сохранить или загрузить, чтобы передать коллеге:
![“Mimic” user interface](/mimic/i/mimic-ui-settings@2x.png?1489660288)
С клиентом мы полностью переосмыслили работу Мимика. Благодаря быстрой настройке моков, Мимиком очень легко начать пользоваться для простых задач. А продвинутые функции, такие как редактор заголовков, маски, группировка, фильтры, экспорт и импорт делают Мимик мощным инструментом для продвинутых разработчиков. Новый интерфейс опирается на привычки и выглядит как стандартная функция браузерных инструментов разработки.
Дизайн Ильи Бирмана
Разработчики Мааян Гликсер и Илья Гельман