ARTISTA MODELCAMP 2027 – Buchungswebsite

Deutschsprachige Onepage mit echter Buchungsstrecke: Stripe-Zahlung (einmalig oder in bis zu drei Raten), persistente Bestell- und Gutscheinverwaltung, Kontaktformular für ein Erstgespräch, geschützter Adminbereich mit Zwei-Faktor-Anmeldung, Docker- und RKE2-Deployment.

Stand: technisch vollständig, im Stripe-Testmodus buchbar. Die Seite läuft im Cluster unter https://modelcamp.artistasphotography.de (Namespace artista). Der Live-Verkauf ist serverseitig gesperrt, bis alle Inhalte und Freigaben aus docs/OFFENE-PUNKTE.md im Adminbereich bestätigt sind.

Projektstand

Was gebaut, geprüft und ausgerollt ist und was noch offen ist, steht im Übersichts-Issue #33 „Projektstand und Übersicht“. Aufgaben, die nur der Inhaber erledigen kann (Freigaben, Rechtstexte, Secrets, Rollouts), sammelt #32 „Inhaber-Aufgaben“. Jedes Arbeitspaket hat ein eigenes Issue.

Dokument	Inhalt
docs/ARCHITEKTUR.md	Entscheidungen: Stack, Preisbindung, Ratenzahlung, Kapazität, Webhooks, Kontaktformular, Design
docs/BETRIEB.md	RKE2-Deployment, CI, Secrets, Stripe-Webhooks, E-Mail, Sicherung, Storno/Erstattung
k8s/README.md	Manifeste Schritt für Schritt anwenden, neues Image ausrollen, Fehlersuche
docs/MEDIEN.md	Dateinamen für Logo, Headerbild, Intro-Video, Porträts und Reels; Medien aufbereiten
docs/OFFENE-PUNKTE.md	Noch benötigte Inhalte und Freigaben
docs/TESTS.md	Ausgeführte Tests und verbleibende Einschränkungen

Stack

TypeScript 5.9 (strict) · Next.js 16.3 (App Router, standalone) · React 19.3 · Tailwind CSS 4.3 · Motion 13 · PostgreSQL 18 · Prisma 7.10 (versionierte Migrationen) · Stripe 22 (Checkout + PaymentIntents) · Zod 4 · Better Auth 1.7 (Admin, TOTP) · Nodemailer 10 · Vitest 4 · Playwright 1.63. Versionen sind exakt fixiert, Lockdatei: pnpm-lock.yaml.

Lokal starten

Voraussetzungen: Node.js 22+, pnpm 12. Docker ist optional.

pnpm install
cp .env.example .env            # APP_SECRET, BETTER_AUTH_SECRET setzen, Stripe-Testschlüssel eintragen
pnpm db:dev                     # eingebettetes PostgreSQL (eigenes Terminal)  – oder: docker compose up -d db mailpit
pnpm db:deploy                  # Migrationen anwenden
pnpm db:seed                    # nur Entwicklung: Early Bird simuliert, Test-Anreisetag, Gutschein TEST-STAMMMODEL
pnpm admin:create --email [email protected] --name "Dein Name"
pnpm dev                        # http://localhost:3000, Verwaltung unter /admin

Stripe-Testbuchung mit Webhooks lokal:

stripe listen --forward-to localhost:3000/api/stripe/webhook   # gibt das whsec_… für STRIPE_WEBHOOK_SECRET aus
pnpm worker                                                    # Reservierungen, Raten-Abgleich, E-Mails (im Cluster: CronJob)

Testkarte 4242 4242 4242 4242, für 3-D-Secure-Fälle 4000 0027 6000 3184. E-Mails landen mit MAIL_TRANSPORT=file als .eml in .mail-outbox/ (oder in Mailpit unter http://localhost:8025).

Befehle

Befehl	Zweck
pnpm dev / pnpm build / pnpm start	Entwicklung, Produktionsbuild, Produktionsserver
pnpm typecheck / pnpm lint	Typprüfung, ESLint
pnpm test	Unit- und Integrationstests (startet eine eigene PostgreSQL-Instanz)
pnpm test:e2e	Playwright: Smartphone, Tablet, Desktop, axe-Barrierefreiheit (gegen laufenden Server)
pnpm db:dev	Eingebettetes PostgreSQL für die Entwicklung (Port 54329)
pnpm db:migrate / pnpm db:deploy	Migration erstellen / anwenden
pnpm db:seed	Nur Entwicklung: Early Bird simulieren, Test-Gutschein TEST-STAMMMODEL
pnpm worker	Einmaliger Worker-Lauf
pnpm admin:create	Admin-Konto anlegen (kein Standardpasswort)
pnpm media:optimize <ordner>	Videos und große Bilder vor dem Hochladen aufbereiten (siehe docs/MEDIEN.md)

Bei jedem Push auf main prüft die CI (.gitea/workflows/docker-build.yml) zuerst lint samt pnpm audit, typecheck und test; erst wenn alle drei grün sind, baut sie die beiden Images. Die Playwright-Tests laufen nicht in der CI.

Wo was gepflegt wird

• Texte, Tagesablauf, Team, Reels, FAQ-Grundlagen: src/content/site.ts. Einträge mit confirmed: false gelten als Entwurf.
• Termin, Ort, Zimmerbeschreibung, Veranstalter, Steuerhinweis, Bedingungen, Kapazität, Freigaben: Adminbereich → „Einstellungen und Freigaben“.
• Preise und Preisphasen: fest in src/lib/pricing.ts, weil sie verbindlich vorgegeben sind.
• Gutscheine (Stammmodel-Codes): Adminbereich → „Gutscheine“.
• Feste Bilder: public/images/unterkunft/ (Villa, aus dem Booking.com-Eintrag, Nutzung vom Auftraggeber freigegeben).
• Logo, Headerbild, Porträts, Reels: feste Dateinamen im Medienverzeichnis, werden automatisch erkannt. Liste: docs/MEDIEN.md.
• Widerrufsbelehrung: Adminbereich → Einstellungen, erscheint unter /widerruf.
• Empfänger des Formulars „Erstgespräch“: die Veranstalter-E-Mail aus dem Adminbereich, ersatzweise ADMIN_NOTIFY_EMAIL. Ist keine von beiden gesetzt, lehnt das Formular Anfragen ab.
• Weitere Medien: Dateien ins Medienverzeichnis (MEDIA_DIR) legen und in site.ts als { kind: "image", src: "/media/…" } eintragen.