Mock API generator (JSON)

Desenvolver um frontend antes da API estar pronta é um dos desafios mais comuns no desenvolvimento moderno. A solução clássica é criar um mock: um endpoint falso que retorna dados fictícios com estrutura verossímil para que o time de front-end possa avançar em paralelo com o back-end. Antes de ferramentas de geração automática, esse processo era manual e tedioso — alguém precisava sentar e escrever arrays de objetos JSON a mão, inventando nomes, IDs, datas e outros campos de modo a parecer realista o suficiente para desenvolver contra. JSON Placeholder foi um pioneiro nessa ideia, mas tem estrutura fixa. Esta ferramenta gera payloads com três temas — animais, pessoas e produtos — com metadados de contagem e timestamp, cobrindo boa parte dos cenários de prototipação.

Mocks de API têm um papel importante além da prototipação: testes de integração e unitários de frontend dependem de dados previsíveis e controlados. Quando você testa um componente React que renderiza uma lista de produtos, prefere receber dados de uma API real (que pode estar fora do ar, lenta ou com dados inconsistentes) ou de um mock local com estrutura garantida? A resposta óbvia é o mock. Ferramentas como MSW (Mock Service Worker) se tornaram padrão no ecossistema React exatamente por isso: permitem interceptar chamadas fetch no navegador e responder com payloads controlados, sem depender de servidor real.

Uma payload com estrutura consistente — todos os itens com os mesmos campos, tipos corretos, sem nulos inesperados — é essencial para desenvolvimento de frontend confiável. No mundo real, APIs costumam retornar dados sujos: campos opcionais às vezes presentes, às vezes ausentes; tipos misturados (números como strings, booleans como 0 ou 1); arrays que ora têm um item ora são vazios. Trabalhar com um mock de boa qualidade primeiro ensina o componente a lidar com a estrutura esperada, e depois você adiciona os casos de edge — ao contrário de descobrir esses casos no ambiente de staging às 23h de uma sexta-feira.

Esta ferramenta gera um array JSON com metadados de tema, contagem e timestamp na chave `meta`, e os itens em `items`. O JSON gerado pode ser usado diretamente como response fixture em Jest ou Vitest, servido por um servidor mock local com `json-server`, ou colado como resposta de exemplo em ferramentas de documentação como Swagger UI e Postman. Para cenários mais complexos com schemas personalizados e relações entre entidades, ferramentas como Faker.js (no ecossistema Node) ou a ferramenta irmã de Faker SQL Insert deste site cobrem casos mais avançados.

Developing a frontend before the API is ready is one of the most common challenges in modern development. The classic solution is creating a mock: a fake endpoint returning plausible fake data so the front-end team can move forward in parallel with the back-end. Before automatic generation tools, this was a manual, tedious process — someone had to sit down and hand-write JSON object arrays, inventing names, IDs, dates, and other fields realistic enough to develop against. JSON Placeholder pioneered this idea but has a fixed schema. This tool generates payloads with three themes — animals, people, and products — with count and timestamp metadata, covering a broad range of prototyping scenarios.

API mocks play an important role beyond prototyping: front-end integration and unit tests depend on predictable, controlled data. When you test a React component rendering a product list, do you prefer to receive data from a real API (which might be down, slow, or returning inconsistent data) or from a local mock with guaranteed structure? The obvious answer is the mock. Tools like MSW (Mock Service Worker) have become standard in the React ecosystem for exactly this reason: they intercept fetch calls in the browser and respond with controlled payloads, without depending on a real server.

A payload with consistent structure — every item with the same fields, correct types, no unexpected nulls — is essential for reliable front-end development. In the real world, APIs often return messy data: optional fields sometimes present, sometimes absent; mixed types (numbers as strings, booleans as 0 or 1); arrays that sometimes have one item and sometimes are empty. Working with a high-quality mock first teaches the component to handle the expected structure, and then you add edge cases — instead of discovering those cases in staging at 11 PM on a Friday.

This tool generates a JSON array with theme, count, and timestamp metadata under `meta`, and the actual items under `items`. The generated JSON can be used directly as a fixture in Jest or Vitest, served by a local mock server with `json-server`, or pasted as a sample response in documentation tools like Swagger UI and Postman. For more complex scenarios with custom schemas and entity relationships, tools like Faker.js (in the Node ecosystem) or this site's Faker SQL Insert tool cover more advanced cases.

Desarrollar un frontend antes de que la API esté lista es uno de los desafíos más comunes en el desarrollo moderno. La solución clásica es crear un mock: un endpoint falso que devuelve datos ficticios con estructura verosímil para que el equipo de front-end pueda avanzar en paralelo con el back-end. Antes de las herramientas de generación automática, este proceso era manual y tedioso — alguien tenía que sentarse a escribir a mano arrays de objetos JSON, inventando nombres, IDs, fechas y otros campos con suficiente realismo para poder desarrollar contra ellos. JSON Placeholder fue pionero en esta idea, pero tiene estructura fija. Esta herramienta genera payloads con tres temas — animales, personas y productos — con metadatos de conteo y timestamp, cubriendo una amplia gama de escenarios de prototipado.

Los mocks de API tienen un papel importante más allá del prototipado: los tests de integración y unitarios de frontend dependen de datos predecibles y controlados. Cuando pruebas un componente React que renderiza una lista de productos, ¿prefieres recibir datos de una API real (que puede estar caída, lenta o devolviendo datos inconsistentes) o de un mock local con estructura garantizada? La respuesta obvia es el mock. Herramientas como MSW (Mock Service Worker) se han convertido en estándar en el ecosistema React exactamente por esto: interceptan llamadas fetch en el navegador y responden con payloads controlados, sin depender de un servidor real.

Un payload con estructura consistente — todos los ítems con los mismos campos, tipos correctos, sin nulos inesperados — es esencial para un desarrollo frontend confiable. En el mundo real, las APIs suelen devolver datos sucios: campos opcionales a veces presentes, a veces ausentes; tipos mezclados (números como strings, booleanos como 0 o 1); arrays que a veces tienen un elemento y a veces están vacíos. Trabajar primero con un mock de buena calidad enseña al componente a manejar la estructura esperada, y después añades los casos límite — en lugar de descubrir esos casos en staging a las 23h de un viernes.

Esta herramienta genera un array JSON con metadatos de tema, conteo y timestamp en la clave `meta`, y los ítems en `items`. El JSON generado puede usarse directamente como fixture en Jest o Vitest, servirse con un servidor mock local usando `json-server`, o pegarse como respuesta de ejemplo en herramientas de documentación como Swagger UI y Postman. Para escenarios más complejos con esquemas personalizados y relaciones entre entidades, herramientas como Faker.js (en el ecosistema Node) o la herramienta hermana de Faker SQL Insert de este sitio cubren casos más avanzados.