Gelateria Brina: die Website einer Eisdiele, die die Sorten des Tages live zeigt

Demo-Website einer erfundenen Eisdiele in Turin. Die Eismacherin markiert auf dem Handy, welche Sorten es gibt und welche aus sind, und die Vitrine der Website, Behälter für Behälter im Code gezeichnet, ändert sich live mit der Uhrzeit der letzten Änderung. Mit Sortenkatalog, Allergenen, Öffnungszeiten und einem Admin-Bereich, den man ohne Konto ausprobiert.

**Die Gelateria Brina gibt es nicht**: Sie ist eine erfundene handwerkliche Eisdiele in Turin, und Eismacherin, Sorten, Rezepte und Fotos sind erfunden; die Website sagt das oben auf jeder Seite. Alles andere ist echt: die Live-Vitrine, die Öffnungszeiten, das Allergenregister und der Admin-Bereich, gebaut wie für ein echtes Geschäft.

**Was sie kann**

- **Die Sorten des Tages, live.** Statt eines Fotos steht da die Theke, vom Code als SVG gezeichnet: jeder Behälter in der Farbe seiner Sorte, mit Namensschild. Ist eine Sorte aus, leert sich ihr Behälter auf allen offenen Bildschirmen in unter einer Sekunde, und die Vitrine zeigt „Aktualisiert um 15:42“. - **Der Admin-Bereich auf dem Handy.** Die Eismacherin tippt auf große Schalter: Diese Sorte gibt es, diese nicht, diese ist aus. Jeder Tipp ist sofort online und lässt sich acht Sekunden lang rückgängig machen. - **Die Allergene.** Zutaten mit fett gedruckten Allergenen, die 14 nach EU-Recht, ein Register zum Ausdrucken für den Laden und keine „ohne …“-Filter, die wie eine Garantie wirken würden. - **Der Rest.** Saisonsorten, Öffnungszeiten mit Winterpause und einem berechneten „Jetzt geöffnet“, ein gezeichneter Lageplan, Besucherstatistiken ohne Cookies und 13 auf der GPU meines Rechners erzeugte Fotos.

**Besucher können den Admin-Bereich ausprobieren**, ohne Konto: Sie melden sich als „Gast“ an, folgen drei Vorschlägen und sehen am Computer neben dem Admin-Bereich, wie sich die Website bei jedem Tipp ändert. Die Änderungen bleiben in ihrem Browser, wo die Logik des Servers mit einer Kopie der Daten läuft, Route für Route von einem automatischen Test geprüft. Und damit die Vitrine nicht stillsteht, bereitet ein Demo-Tag die Theke zur Öffnung vor und lässt ein paar Sorten ausgehen.

**Das Schwierige** ist, nie so zu tun, als wäre alles aktuell. Hat heute niemand die Theke angefasst, sagt die Vitrine das: „Das sind die Sorten von gestern Abend.“ Eine ausverkaufte Sorte bleibt aus, bis jemand sie zurückstellt. Und das Live-Update muss auf einem echten Server halten: Die Ereignisse gehen ungebremst durch nginx, ein Signal alle 25 Sekunden hält die Verbindung offen, und ohne Live-Kanal fragt die Seite jede Minute den Stand ab. Die Startseite lädt 99 KB JavaScript und verschiebt sich beim Laden nicht.

Vue 3 und TypeScript, Fastify und MongoDB, gemeinsame Zod-Schemas; jede Änderung durchläuft 165 automatische Tests und kommt per GitHub Action auf meinen Server.

Konzeption, Full-Stack-Entwicklung und Veröffentlichung · 2026

Vue.js, Fastify, MongoDB, TypeScript, Z-Image-Turbo

Website ansehen

Andrea Coppetta