Skip to content
Назад в блог

От ручных фикстур до Data Mocker в браузере

3 мин. чтения
От ручных фикстур до Data Mocker в браузере

В разработке есть задачи, которые нельзя автоматизировать целиком — но можно свести к двум кликам. Подготовка тестовых данных — одна из них.

От ручных фикстур к Faker.js

Долгое время единственным способом получить тестовые данные было написать их руками. Десять JSON-объектов с выдуманными именами, адресами и телефонами — это рутина, которую нельзя делегировать, но можно автоматизировать.

В 2012 году Марак Скуайрс (Marak Squires) опубликовал Faker.js — библиотеку, которая генерирует реалистичные данные: имена, адреса, номера телефонов, email, текст и многое другое. Библиотека быстро стала стандартом де-факто — её порты появились для PHP (FakerPHP), Python (Faker), Ruby (Faker) и других языков.

Идея проста: вместо того чтобы придумывать «Иван Петров, [email protected], +7 123 456-78-90» руками, вы говорите генератору: «дай мне 50 пользователей с именем, email и телефоном» — и получаете готовый массив.

У Faker.js есть довольно драматичная предыстория. В январе 2022 года Скуайрс, недовольный тем, что компании используют его бесплатный труд, ничего не платя взамен, намеренно выпустил испорченную версию faker.js (а заодно и своего другого популярного пакета colors.js), которая сломала тысячи зависимых проектов — включая инструменты на базе AWS CDK. npm откатил вредоносные версии, но собственный пакет Скуайрса после этого фактически оказался заброшен. Сообщество форкнуло последнюю чистую версию под именем @faker-js/faker — именно этот форк активно поддерживается и используется сегодня; оригинальный пакет faker на npm теперь помечен как deprecated.

Data Mocker: конструктор схемы в браузере

Faker.js — мощный инструмент, но для разовой задачи устанавливать библиотеку и писать скрипт — избыточно. Data Mocker решает ту же проблему без установки:

18 типов полей

ТипЧто генерирует
Primary KeyАвтоинкрементные ID (1, 2, 3…) с настройкой стартового значения
NameСлучайные полные имена (имя + фамилия)
EmailРеалистичные email из случайного имени + домена
UUIDУникальные идентификаторы (v4)
PhoneНомера телефонов
Avatar URLURL-адреса заглушек для аватаров
ISO DateСлучайные даты за последние 2 года
PriceСлучайные десятичные цены (0–1000)
NumberЦелые числа с настраиваемым количеством знаков (например, 3 для 100–999, 1-4 для 1–9999)
BooleanСлучайный true/false
Text / LoremLorem ipsum — настраиваемые абзацы (3p) или диапазон символов (100-500)
CityСлучайные названия городов из пула 40 городов
CountryСлучайные названия стран из пула 40 стран
CompanyСлучайные названия компаний (Acme Corp, Stark Industries и др.)
URLСлучайные URL со схемой, доменом и путём
IPv4Случайные IP-адреса
EnumСлучайный выбор из ваших значений через запятую (например, active, inactive, pending)
CustomСвой текст, который вы вводите сами

Управление схемами

  • Автосохранение — текущая схема сохраняется в localStorage при каждом изменении. Перезагрузите страницу — всё на месте.
  • Сохранение / Загрузка — сохраняйте именованные схемы для повторного использования. Нажали Save, ввели имя — готово. Load показывает список сохранённых схем.
  • Обновление — сохранение с существующим именем перезаписывает схему. Кнопка автоматически меняется на «Update».
  • Сброс — одно нажатие восстанавливает дефолтную схему.
  • Экспорт / Импорт — скачайте схему как JSON-файл или загрузите схему из файла. Делитесь схемами с командой.

Вывод

  • Количество строк от 1 до 200 — через контрол со ступенчатым шагом
  • Переключение между JSON и CSV
  • Копирование в буфер обмена или скачивание файла
  • Предпросмотр обновляется в реальном времени при редактировании схемы

Быстрый старт: откройте инструмент → нажмите «Add field» несколько раз → выберите типы (Name, Email, UUID) → задайте 10 строк → скопируйте JSON — готовый набор тестовых данных для вашего компонента.

Похожие инструменты

Частые вопросы

Зачем нужен генератор тестовых данных?

При разработке фронтенда или тестировании API нужны реалистичные данные — пользователи, заказы, товары. Вбивать их руками долго и скучно. Генератор мок-данных создаёт набор записей по заданной схеме за секунду.

Что такое Faker.js?

Faker.js — библиотека для генерации фейковых данных, созданная Мараком Скуайрсом (Marak Squires) в 2012 году. Она умеет генерировать имена, адреса, телефоны, email, текст и многое другое на десятках языков. Оригинальный пакет больше не поддерживается — в январе 2022 года Скуайрс намеренно саботировал собственный faker.js в знак протеста, и сегодня самая популярная и активно поддерживаемая версия в экосистеме JavaScript — это форк сообщества @faker-js/faker.

Data Mocker отправляет мои данные на сервер?

Нет. Data Mocker полностью работает в браузере. Все данные генерируются на месте, ничего не отправляется на сервер.

Чем Data Mocker отличается от Faker.js?

Faker.js — это библиотека для Node.js, которую нужно устанавливать и подключать. Data Mocker — это готовая веб-страница: открыл, настроил схему, скопировал JSON или CSV. Не требует установки, подходит для разовой генерации.

Можно ли сохранять и переиспользовать схемы?

Да. Data Mocker автоматически сохраняет текущую схему в localStorage. Также можно сохранять именованные схемы, загружать их позже, сбрасывать на дефолты или экспортировать/импортировать схемы как JSON-файлы.

Автор

Fullstack Engineer

В коммерческой разработке с 2011 года — больше 15 лет. Автор двух SaaS-продуктов: TeleGo.io и LingvoHabit.com. Статьи здесь выросли из реальной клиентской и продуктовой работы.

Подробнее об автореНаписать в Telegram

Похожие статьи

GZIP VS BROTLI
GZIP VS BROTLI · '26

Как патенты на LZW привели к gzip, а веб к Brotli

История gzip, DEFLATE и Brotli, устройство двух форматов сжатия и практический выбор между размером результата, скоростью кодирования и совместимостью.

#GZip vs Brotli #история сжатия данных #Jean-loup Gailly #Brotli Google #Deflate алгоритм #LZ77 Huffman
5 мин. чтения
ФОРМАТИРОВАНИЕ RTL ТЕКСТА
ФОРМАТИРОВАНИЕ RTL ТЕКСТА · '26

Почему иврит и английский меняются местами

Как Unicode BiDi отображает иврит и арабский вместе с латиницей и кириллицей и когда использовать isolates, LRM или RLM.

#Форматирование RTL текста #Иврит и английский #Unicode BiDi controls #LRM и RLM #LRI RLI PDI #Смешанное направление текста
3 мин. чтения
СЖАТИЕ ИЗОБРАЖЕНИЙ
СЖАТИЕ ИЗОБРАЖЕНИЙ · '26

Оптимизация SVG, экспорт кода и сжатие изображений

Оптимизируйте и трансформируйте SVG, экспортируйте React, React Native, Vue, PNG или Data URI и сжимайте растровые изображения локально в браузере.

#сжатие изображений #WebP формат #оптимизация SVG #PNG vs JPEG #AVIF #SVGO
4 мин. чтения