Web de demostración de una heladería inventada en Turín. La artesana marca desde el móvil los sabores que hay y los que se han agotado, y el escaparate de la web, dibujado en código cubeta a cubeta, cambia en directo con la hora de la última actualización. Con el catálogo de sabores, los alérgenos, los horarios y un panel que se prueba sin cuenta.
**Gelateria Brina no existe**: es una heladería artesanal inventada en Turín, y la artesana, los sabores, las recetas y las fotos son inventados; la web lo dice en lo alto de cada página. Todo lo demás es real: el escaparate en directo, los horarios, el registro de alérgenos y el panel, construidos como para un negocio real.
**Qué hace**
- **Los sabores de hoy, en directo.** En lugar de una foto está el mostrador, dibujado en SVG por el código: cada cubeta con el color de su sabor y su etiqueta. Cuando un sabor se acaba, su cubeta se vacía en todas las pantallas abiertas en menos de un segundo, y el escaparate indica «Actualizado a las 15:42». - **El panel en el móvil.** La artesana toca interruptores grandes: este sabor está, este no, este se ha agotado. Cada toque se publica al momento y se puede deshacer durante ocho segundos. - **Los alérgenos.** Ingredientes con los alérgenos en negrita, los 14 de la normativa europea, un registro para imprimir en la tienda y ningún filtro «sin…», que parecería una garantía. - **Lo demás.** Sabores de temporada, horarios con el cierre invernal y un «abierto ahora» calculado, un plano dibujado, estadísticas de visitas sin cookies y 13 fotos generadas con la GPU de mi ordenador.
**Quien mira puede probar el panel** sin cuenta: entra como «Invitado», sigue tres cosas para probar y, en el ordenador, ve la web cambiar junto al panel con cada toque. Los cambios se quedan en su navegador, donde corre la misma lógica del servidor sobre una copia de los datos; una prueba automática comprueba, ruta por ruta, que responde como el servidor. Y para que el escaparate no se quede quieto, una jornada de demostración prepara el mostrador a la hora de abrir y agota algunos sabores.
**Lo difícil** es no fingir nunca estar al día. Si hoy nadie ha tocado el mostrador, el escaparate lo dice: «estos son los sabores de anoche». Un sabor agotado sigue agotado hasta que alguien lo vuelve a poner. Y el directo tiene que aguantar en un servidor real: los eventos pasan por nginx sin quedarse retenidos, una señal cada 25 segundos mantiene viva la conexión y, si el directo no se abre, la página pide el estado cada minuto. La página de inicio carga 99 KB de JavaScript y no se mueve mientras carga.
Vue 3 y TypeScript, Fastify y MongoDB, esquemas Zod compartidos; cada cambio pasa por 165 pruebas automáticas y llega a mi servidor con una GitHub Action.
Diseño, desarrollo full-stack y publicación · 2026
Vue.js, Fastify, MongoDB, TypeScript, Z-Image-Turbo