DEV Community

Cover image for Cómo crear una API REST falsa en minutos con JSONPlaceholder
Roobia
Roobia

Posted on • Originally published at apidog.com

Cómo crear una API REST falsa en minutos con JSONPlaceholder

Estás construyendo un frontend, pero el backend no está listo. Necesitas una API REST que devuelva JSON realista ahora mismo, con GET, POST, PUT y DELETE funcionando, para seguir implementando sin bloquearte.

Prueba Apidog hoy

Para eso sirve json-server: apuntas la herramienta a un archivo JSON y obtienes una API REST funcional en segundos, sin escribir backend. JSONPlaceholder cubre el caso aún más rápido: una API falsa alojada que puedes consumir sin instalar nada. En esta guía verás cómo usar ambas opciones, sus límites y cuándo pasar a un mock basado en esquemas en Apidog.

Para una visión general sobre este enfoque, consulta qué es una API mock. Aquí nos centraremos en las dos herramientas que muchos desarrolladores prueban primero.

¿Qué es json-server?

json-server es una herramienta npm de código abierto que convierte un archivo JSON plano en una API REST. Defines tus recursos en un archivo db.json, ejecutas un comando y obtienes rutas CRUD estándar respaldadas por ese archivo.

Las operaciones de escritura modifican el archivo, así que los datos persisten entre solicitudes mientras usas el servidor local.

Es útil para:

  • Prototipos rápidos.
  • Desarrollo frontend antes de que exista el backend.
  • Demos internas.
  • Pruebas manuales o automatizadas simples.
  • Simular recursos REST sin base de datos.

El proyecto está disponible en GitHub.

Instalar y ejecutar json-server

Instala el paquete desde npm:

npm install json-server
Enter fullscreen mode Exit fullscreen mode

Crea un archivo db.json en tu proyecto:

{
  "posts": [
    { "id": "1", "title": "First post", "views": 100 },
    { "id": "2", "title": "Second post", "views": 250 }
  ],
  "comments": [
    { "id": "1", "text": "Nice work", "postId": "1" }
  ],
  "profile": {
    "name": "apidog"
  }
}
Enter fullscreen mode Exit fullscreen mode

Reglas básicas:

  • Las claves de array de nivel superior se convierten en colecciones.
  • Los objetos de nivel superior se convierten en recursos únicos.
  • Cada objeto debería tener un id para poder accederlo por ruta.

Inicia el servidor:

npx json-server db.json
Enter fullscreen mode Exit fullscreen mode

Por defecto estará disponible en:

http://localhost:3000
Enter fullscreen mode Exit fullscreen mode

Ya puedes consumir la API desde tu frontend:

curl http://localhost:3000/posts
Enter fullscreen mode Exit fullscreen mode

Nota sobre versiones: en json-server v1 ya no se usa la antigua bandera --watch. El comando actual es npx json-server db.json. En tutoriales antiguos de la línea 0.x todavía puedes ver json-server --watch db.json.

Rutas REST generadas automáticamente

Con el db.json anterior, json-server crea rutas CRUD sin configuración extra.

Para la colección posts:

GET    /posts
GET    /posts/:id
POST   /posts
PUT    /posts/:id
PATCH  /posts/:id
DELETE /posts/:id
Enter fullscreen mode Exit fullscreen mode

Ejemplos:

curl http://localhost:3000/posts/1
Enter fullscreen mode Exit fullscreen mode
curl -X POST http://localhost:3000/posts \
  -H "Content-Type: application/json" \
  -d '{ "id": "3", "title": "Third post", "views": 10 }'
Enter fullscreen mode Exit fullscreen mode
curl -X PATCH http://localhost:3000/posts/3 \
  -H "Content-Type: application/json" \
  -d '{ "views": 42 }'
Enter fullscreen mode Exit fullscreen mode
curl -X DELETE http://localhost:3000/posts/3
Enter fullscreen mode Exit fullscreen mode

Para el objeto profile:

GET   /profile
PUT   /profile
PATCH /profile
Enter fullscreen mode Exit fullscreen mode

Ejemplo:

curl -X PATCH http://localhost:3000/profile \
  -H "Content-Type: application/json" \
  -d '{ "name": "frontend-team" }'
Enter fullscreen mode Exit fullscreen mode

Filtrar, ordenar y paginar datos

json-server también incluye consultas útiles para prototipos.

GET /posts?views:gt=100
GET /posts?views:lte=50
GET /posts?_sort=-views
GET /posts?_page=1&_per_page=25
GET /posts?_embed=comments
Enter fullscreen mode Exit fullscreen mode

Ejemplos con curl:

curl "http://localhost:3000/posts?views:gt=100"
Enter fullscreen mode Exit fullscreen mode
curl "http://localhost:3000/posts?_sort=-views"
Enter fullscreen mode Exit fullscreen mode
curl "http://localhost:3000/posts?_page=1&_per_page=25"
Enter fullscreen mode Exit fullscreen mode

Operadores disponibles:

  • lt
  • lte
  • gt
  • gte
  • eq
  • ne
  • in
  • contains
  • startsWith
  • endsWith

Para una API creada desde un archivo plano, es suficiente para desbloquear muchas tareas de frontend.

JSONPlaceholder: una API falsa sin configuración

Si no quieres instalar nada, puedes usar JSONPlaceholder. Es una API REST falsa gratuita alojada en jsonplaceholder.typicode.com.

Ejemplo:

curl https://jsonplaceholder.typicode.com/posts/1
Enter fullscreen mode Exit fullscreen mode

Respuesta:

{
  "userId": 1,
  "id": 1,
  "title": "sunt aut facere repellat provident",
  "body": "quia et suscipit..."
}
Enter fullscreen mode Exit fullscreen mode

Incluye seis recursos predefinidos:

  • /posts — 100 elementos.
  • /comments — 500 elementos.
  • /albums — 100 elementos.
  • /photos — 5000 elementos.
  • /todos — 200 elementos.
  • /users — 10 elementos.

También acepta POST, PUT, PATCH y DELETE, pero con una limitación importante: las escrituras son simuladas.

Por ejemplo:

curl -X POST https://jsonplaceholder.typicode.com/posts \
  -H "Content-Type: application/json" \
  -d '{ "title": "Nuevo post", "body": "Contenido", "userId": 1 }'
Enter fullscreen mode Exit fullscreen mode

Recibirás una respuesta realista, pero el recurso no se guardará. Si vuelves a consultar la colección, el nuevo post no existirá.

JSONPlaceholder funciona bien para:

  • Ejemplos rápidos.
  • Demos.
  • Tutoriales.
  • Probar llamadas HTTP.
  • Conectar una UI a datos predecibles.

No funciona como backend real ni como mock con estado.

json-server vs JSONPlaceholder

json-server JSONPlaceholder
Configuración Instalar paquete npm, escribir db.json Ninguna, solo llamar a la URL
Ejecución Localmente, tu máquina Alojado, público
Datos personalizados Sí, tus propios recursos No, recursos fijos
Las escrituras persisten Sí, en db.json No, simuladas
Mejor para Prototipos con tus propias formas Demostraciones rápidas y aprendizaje

Usa JSONPlaceholder si solo necesitas datos ahora y no te importa su estructura exacta.

Usa json-server si necesitas:

  • Recursos propios.
  • Rutas con nombres parecidos a tu API real.
  • Escrituras persistentes durante el desarrollo.
  • Más control sobre la forma del JSON.

Dónde estas herramientas se quedan cortas

json-server y JSONPlaceholder resuelven bien un problema: servir JSON rápidamente. Pero empiezan a limitarte cuando el proyecto deja de ser un prototipo individual.

Limitaciones habituales:

  • Sin validación real. No imponen un esquema. Puedes guardar una cadena donde tu API real esperaría un número.
  • Sin datos dinámicos o inteligentes. Las respuestas salen del archivo o del dataset fijo. No hay generación automática de emails, fechas, precios o IDs realistas por solicitud.
  • Entorno local o fijo. json-server vive en tu máquina. Un compañero o una tarea de CI no pueden acceder a localhost:3000. JSONPlaceholder es público, pero no lo puedes personalizar.
  • Riesgo de desviarse del contrato. Los datos mock viven separados de tu especificación OpenAPI, así que pueden quedar obsoletos.
  • Estado limitado. JSONPlaceholder no guarda escrituras, por lo que no sirve para flujos como carrito, onboarding o pasos encadenados.

Si ya superaste un archivo plano, revisa estos recursos:

Cuándo pasar a un servidor de mock real

Un mock basado en esquemas resuelve las limitaciones anteriores. Ahí es donde Apidog puede reemplazar a json-server.

Con Apidog puedes trabajar así:

  • Mock dirigido por esquema. Defines un endpoint o importas tu especificación OpenAPI. El mock se genera desde la misma definición del contrato.
  • Datos inteligentes y dinámicos. Apidog interpreta nombres y tipos de campo para devolver valores realistas, como emails válidos para email, fechas para createdAt o números para price.
  • Reglas por campo. Puedes ajustar la salida con reglas tipo Faker cuando necesites valores específicos.
  • URL compartida en la nube. El mock queda disponible para frontend, QA, backend y CI sin depender de localhost.
  • Sin instalar Node por proyecto. No necesitas mantener un db.json ni levantar un proceso local para cada mock.

Para profundizar en datos realistas, consulta:

Simular la misma API en Apidog

Flujo recomendado:

  1. Descarga Apidog y crea o abre un proyecto.
  2. Añade un endpoint, por ejemplo GET /posts.
  3. Define el esquema de respuesta o importa una especificación OpenAPI existente.
  4. Usa la URL de mock generada por Apidog.
  5. Ajusta reglas de mock por campo si necesitas valores concretos.
  6. Comparte la URL con tu equipo o úsala en pruebas automatizadas y CI.

Ejemplo de esquema conceptual para GET /posts:

{
  "posts": [
    {
      "id": "string",
      "title": "string",
      "views": "number",
      "createdAt": "string"
    }
  ]
}
Enter fullscreen mode Exit fullscreen mode

En lugar de mantener manualmente cada fila en db.json, el mock puede devolver valores coherentes con el contrato.

Así mantienes la velocidad de “API en minutos” de json-server, pero con validación, generación dinámica y una URL accesible para todo el equipo.

Preguntas frecuentes

¿json-server es gratuito?

Sí. Es de código abierto y de uso gratuito. JSONPlaceholder también es gratuito.

¿json-server persiste los datos?

Sí. POST, PUT, PATCH y DELETE escriben de nuevo en tu db.json, por lo que los cambios persisten mientras trabajas con ese archivo. JSONPlaceholder simula las escrituras y no guarda nada.

¿Puedo usar json-server en producción?

No. Está pensado para prototipos, desarrollo y pruebas. No ofrece validación real, autenticación ni una estrategia de escalabilidad para producción.

¿Cuál es la diferencia entre json-server y un servidor de mock como Apidog?

json-server sirve un archivo JSON como API REST. Apidog simula endpoints desde tu esquema de API, devuelve datos dinámicos realistas y expone una URL compartida en la nube.

Para más contexto, revisa qué es una API mock y el resumen de herramientas de mock REST.

¿Cómo obtengo datos falsos realistas en lugar de filas estáticas?

Usa un generador de datos. Un generador de datos de prueba crea registros variados y realistas. El mock de Apidog puede hacerlo automáticamente desde tu esquema.

En resumen

json-server convierte un archivo JSON en una API REST funcional con un solo comando. JSONPlaceholder te da una API falsa alojada sin configuración. Ambas opciones son útiles para desbloquear desarrollo frontend rápido.

Cuando necesites validación de esquemas, datos dinámicos, una URL compartida y un mock alineado con tu contrato real, un archivo plano deja de ser suficiente. En ese punto, el servidor de mock de Apidog toma el relevo.

Descarga Apidog, importa tu especificación y empieza a consumir un mock consistente desde la primera solicitud.

Top comments (0)