Antes de empezar. El cliente web de Servidor ya realiza peticiones al backend y maneja sus respuestas. Hoy integrarás y publicarás ambas piezas con sus versiones identificadas.
Se explica
25 minutos · explicación y demostración
Servidor 33–34 explica fetch, CORS y las operaciones desde el navegador. Esa implementación se reutiliza aquí. Intermodular se ocupa de que el cliente se despliegue, apunte al entorno correcto y se pruebe contra una versión identificada del backend.
El portfolio puede enlazar a la aplicación; no necesita contener otra copia del CRUD. El cliente y el backend pueden tener repositorios distintos, pero forman el mismo producto. Si el cliente vive junto al backend, conservad esa estructura y configurad las rutas de los workflows sin mover archivos para este taller.
Una operación de red puede estar cargando, terminar correctamente o fallar; una lista vacía es un resultado correcto. La revisión debe comprobar estados observables, además del aspecto de la pantalla.
Se trabaja
140 minutos · trabajo guiado sobre el producto compartido
Bloque A · Localizar el cliente existente
Abre el cliente utilizado en Servidor 33–34 y ejecuta el comando de arranque de su README. Identifica el archivo que define la base URL y la función que realiza las peticiones. Si solo existe la página de diagnóstico, utiliza esa página como punto de partida y registra la limitación, sin crear una segunda implementación.
Bloque B · Preparar los entornos
Declara las URL local y pública en la configuración prevista por el cliente. Comprueba el origen completo del navegador, incluido esquema y puerto. Reutiliza la configuración CORS del backend de Servidor: actualiza sus orígenes en lugar de añadir otra clase que entre en contradicción con la anterior.
Bloque C · Ejecutar un recorrido completo
Prepara un registro con nombre reconocible. Desde el cliente crea, consulta, modifica y borra ese registro; utiliza el id devuelto. Comprueba también entrada inválida y lista vacía. En Red observa el estado HTTP, el cuerpo y, al crear, Location. Si un paso falla, repítelo con la colección para separar contrato, configuración y presentación.
Bloque D · Llevar las dos piezas a revisión
Abre la PR con las URL de prueba y los SHA de cliente y backend. La persona revisora repite el recorrido y una navegación con teclado. Modificar también forma parte del CRUD mínimo; no queda como ampliación opcional. La evaluación de la implementación del servidor usa los criterios de Servidor.
Bloque E · Publicar y enlazar
Después de las comprobaciones, despliega por el flujo habitual y repite un recorrido breve contra la URL pública. Actualiza la ficha del portfolio para enlazar la aplicación y documenta qué dos versiones se probaron juntas. Conserva las evidencias en las comprobaciones de la sesión.
Cierre
15 minutos · comprobación del resultado
Al terminar la sesión: Cliente y API funcionan juntos en el entorno publicado, con configuración y versiones identificadas. Has comprobado carga, resultado correcto y error, y puedes explicar las diferencias respecto a local.