Web-App, React + Supabase · 2026
Hochzeitswebsite
Ein privates Projekt, keine Uni-Aufgabe: eine Website, auf der das Brautpaar den vollen Überblick über alle Gäste an einem Ort hat. Gäste sagen zu oder ab, geben Essenswunsch und Allergien an und tragen bei der Geschenkeliste ein, was sie übernehmen, damit nichts doppelt gekauft wird.
- Rolle
- Privates Projekt, solo: Konzept, Design & Entwicklung
- Methodik
- Nutzerzentrierte Iteration an einem laufenden, echten Projekt
- Projektziel
- Voller Überblick über alle Gäste an einem Ort: Zusagen, Essenswünsche, Allergien, Geschenke.
- Jahr
- 2026
Tools & Stack
- Claude Code
- Google Stitch
- Figma
- React 19
- Tailwind CSS
- Supabase
Idee & Gestaltung
Eine Hochzeit hat viele bewegliche Teile, Gäste will ich nicht mit 10 Links behelligen. Die Website bündelt alles an einem Ort, ruhig und festlich: Burgunderrot auf Creme, Serifen und eine Prise Schreibschrift.
Countdown, Programm und Location mit Karte geben den Gästen alle Infos, bevor sie fragen müssen.
Das Problem: verstreute Informationen
Eine Hochzeitsplanung zerfällt in Kanäle. Zusagen kommen per WhatsApp, Musikwünsche als Sprachnachricht, wer vegan isst, steht in einem Chat von vor drei Wochen, und Allergien nennt niemand, weil nie jemand danach fragt.
Der Bruch liegt nicht beim Einladen, sondern beim Überblick behalten. Genau da setzt die Seite an: eine Struktur, die die Fragen stellt, statt darauf zu warten, dass Gäste von selbst darauf kommen.
Die Lösung für Gäste: ein Formular, das mitdenkt
Das RSVP fragt in einem Durchgang alles ab, was später fehlen würde: Zu- oder Absage, Personenzahl, Essenswunsch als Chips (Fleisch, Vegetarisch, Vegan), ein Freitextfeld für Allergien und Getränkevorlieben zum Ankreuzen.
Essen als feste Auswahl statt Freitext war eine bewusste Entscheidung: auswertbare Antworten statt „irgendwas ohne Fleisch bitte“. Wer die Seite später erneut öffnet, sieht seine eigene Zusage wieder und kann sie ändern, ganz ohne Login oder Passwort.
Die Lösung fürs Brautpaar: ein Blick genügt
Alle Eingaben laufen in einem versteckten Admin-Dashboard zusammen. Ganz oben stehen die Zahlen, die man wirklich braucht: Zusagen, Personen gesamt, wie viele vegetarisch, wie viele vegan.
Darunter eine Tabelle mit Name, Status, Personenzahl, Essen, Allergien und Getränken, dazu eigene Reiter für Musikwünsche, Spielideen, Geschenke und die Galerie. Was sonst zusammengesucht werden müsste, steht an einer Stelle und lässt sich direkt an die Location weitergeben.
Geschenke: nichts doppelt, nichts verraten
Die Geschenke-Seite ist bewusst keine klassische Wunschliste. Jeder Vorschlag trägt nur einen Status, „Verfügbar“ oder „Vergeben“. Wer etwas übernimmt, markiert es, und für alle anderen ist es sichtbar weg.
In der Datenbank steht dabei nur ein Ja/Nein, kein Name. Doppelkäufe sind technisch ausgeschlossen, ohne dass das Brautpaar erfährt, wer was ausgesucht hat, die Überraschung bleibt.
Technik dahinter
Die App ist eine React-19-SPA mit Vite und Tailwind. Alle Gäste-Eingaben liegen in einer Supabase-Postgres-Datenbank mit Row Level Security, Fotos und Videos in Storage-Buckets. Der Admin-Bereich hängt an Supabase Auth und ist über einen versteckten Einstieg erreichbar.
Für die Musikwunsch-Suche läuft ein kleiner Express-Server als Proxy, damit die Spotify-Schlüssel nie im Browser landen. Sonderfälle wie „Absage nach Zusage“ waren von Anfang an mitgedacht, statt sie später nachzurüsten.
