Devolver los empleos en JSON

En esta clase damos un paso más allá de las respuestas de texto y empezamos a devolver datos reales desde nuestra API.

Hasta ahora hemos trabajado con rutas simples que devolvían texto plano o HTML básico. Ahora vamos a aprender a devolver una lista de empleos en formato JSON, que es el estándar universal para la comunicación entre aplicaciones modernas (como un frontend en React y un backend en Express).

Punto de partida

Partimos de un servidor básico con Express que ya está configurado para escuchar peticiones:

import express from 'express'const app = express()const PORT = process.env.PORT ?? 1234app.listen(PORT, () => {  console.log(`Servidor levantado en http://localhost:${PORT}`)})

Simulando los datos de empleos

Para este ejemplo, en lugar de conectar una base de datos real (que veremos más adelante), vamos a definir un array de objetos en memoria. Esto nos permite prototipar nuestra API rápidamente.

const jobs = [  {    id: 1,    title: 'Frontend Developer',    company: 'DevJobs',    location: 'Remote'  },  {    id: 2,    title: 'Backend Developer',    company: 'DevJobs',    location: 'Barcelona'  }]

Creando la ruta para devolver JSON

Para enviar una respuesta en formato JSON, Express nos proporciona el método res.json(). Vamos a crear el endpoint /jobs:

app.get('/jobs', (req, res) => {  // El método .json() se encarga de todo por nosotros  return res.json(jobs)})

¿Qué hace res.json() por debajo?

Cuando llamas a este método, Express realiza automáticamente varias tareas que antes hacíamos a mano:

1. Serialización: Convierte el objeto o array de JavaScript a una cadena de texto JSON válida (JSON.stringify).
2. Cabeceras: Configura el encabezado Content-Type: application/json; charset=utf-8.
3. Finalización: Envía los datos y cierra la conexión automáticamente.

Probando el endpoint

Si abres tu navegador o una herramienta como Postman y accedes a:

http://localhost:1234/jobs

Recibirás una respuesta estructurada como esta:

[  {    "id": 1,    "title": "Frontend Developer",    "company": "DevJobs",    "location": "Remote"  },  {    "id": 2,    "title": "Backend Developer",    "company": "DevJobs",    "location": "Barcelona"  }]

Ventajas de este enfoque

Al usar Express para devolver JSON conseguimos:

• Código más limpio: No hay rastro de res.setHeader ni res.end.
• Menos errores: Es más difícil olvidar configurar las cabeceras correctamente.
• Estandarización: Nuestra API está lista para ser consumida por cualquier cliente (web, móvil, etc.).

Lo que hemos hecho

• ✅ Aprendimos a usar res.json() para enviar datos estructurados.
• ✅ Entendimos que Express gestiona automáticamente las cabeceras Content-Type.
• ✅ Vimos cómo simular una fuente de datos usando arrays en memoria.
• ✅ Comprobamos lo sencillo que es crear un endpoint funcional en pocos segundos.

En la siguiente clase aprenderemos cómo utilizar los parámetros dinámicos que vimos anteriormente para filtrar y buscar empleos específicos dentro de nuestra lista.