Anelia Wolf – Website
Statische Website für Anelia Wolf (Keynote Speakerin, Trainerin, Coach).
Zwölf Routen in zwei Sprachen: Startseite, drei Leistungsseiten, Impressum und
Datenschutz – deutsch auf /, englisch unter /en/ – plus die 404.
Next.js 16 (App Router) im Static Export, Tailwind v4, GSAP + Lenis, TypeScript. Kein Backend, keine Datenbank, keine Formulare.
Entwickeln und bauen
npm install
npm run dev # http://localhost:3000
npm run build # erzeugt out/
npm run lint
npx tsc --noEmit
next.config.ts setzt output: "export" und trailingSlash: true. Der Build schreibt
den fertigen Ordner out/ – das ist das komplette Deployment: rein statische
Dateien für einen beliebigen Webhoster (Apache, nginx, Uberspace, Netlify, …).
Kein Node-Prozess auf dem Server, kein next start.
Was diese Seite bewusst nicht tut
Diese Regeln sind nicht kosmetisch – die Datenschutzerklärung sagt sie zu:
- keine externen Requests: keine Google Fonts, keine CDNs, keine Videos,
keine Karten, keine Social-Plugins, keine Analytics. Schriften werden über
next/fontzur Build-Zeit selbst gehostet. - kein Storage: kein localStorage, kein sessionStorage, keine Cookies – deshalb auch kein Cookie-Banner.
- kein Kontaktformular, kein Newsletter. Kontakt läuft über
mailto:und Telefon.
Wer eine dieser Zusagen ändert, muss src/content/legal.ts (Ziffer 2, 3 und 6)
mit ändern.
Wo was liegt
| Pfad | Inhalt |
|---|---|
src/app/(de)/ |
deutsche Routen (page.tsx je Seite) und ihr Wurzel-Layout mit <html lang="de"> |
src/app/en/ |
englische Routen und ihr Wurzel-Layout mit <html lang="en"> |
src/app/global-not-found.tsx |
404 für unbekannte Adressen – wird zu out/404.html |
src/components/pages/ |
Der Aufbau jeder Seite, einmal für beide Sprachen |
src/content/en/ |
die englischen Texte, Datei für Datei dieselbe Struktur |
src/lib/i18n.ts |
Pfade beider Sprachen, Sprachumschalter, hreflang |
src/content/*.ts |
Sämtliche Texte. Wer Copy ändert, ändert nur hier – nie im JSX. |
src/lib/site.ts |
Stammdaten (Name, E-Mail, Telefon, LinkedIn), Navigation, Routen, Flags |
src/lib/legal.ts |
Platzhalter-Logik, Build-Guard, LEGAL_TODO / CONTENT_TODO |
src/lib/assets.ts |
Build-Zeit-Prüfung der Drop-in-Dateien (fehlt eine, rendert die dokumentierte Variante B) |
src/components/ |
layout/, motion/ (GSAP-Primitiven), ui/, brand/, home/, services/ |
public/brand/, public/photos/ |
Drop-in-Slots für Logo und Fotos (je eigene README) |
docs/superpowers/ |
Spec und Build-Plan |
Drop-in-Assets
Fehlt eine Datei, bricht nichts – die Seite rendert die dokumentierte Alternative:
| Datei | Fehlt sie, dann … |
|---|---|
public/brand/logo-mark.svg |
typografisches <WolfMark/>-Monogramm statt des echten Logos |
public/brand/logo-full.png |
kein Social-Preview-Bild in den OpenGraph-Daten |
public/photos/anelia-hero.jpg |
Hero ohne Foto (Monogramm trägt die Fläche) |
public/photos/anelia-portrait.jpg |
„Über Anelia“ ohne Foto |
public/photos/anelia-stage.jpg |
Keynotes-Seite ohne Bühnenfoto |
public/speaker-profil.pdf |
Speaker-Profil-Zeile entfällt (zusätzlich flags.showSpeakerPdf) |
Das gelieferte Logo-SVG wird inline eingebettet. Enthält es ein <script>,
bricht der Build ab – dann eine Export-Variante ohne Interaktivität liefern.
Flags (src/lib/site.ts)
| Flag | Bedeutung |
|---|---|
showPlaceholders |
true bis zum Launch: offene Angaben stehen sichtbar als „[…]“ in Gold |
hostOutsideEu |
nur true, wenn Hoster/Office-Anbieter außerhalb EU/EWR sitzen (Drittland-Absatz) |
showFaq, showStimmen, showSpeakerPdf, showSecondTalk, show24hPromise, showIndustry, showTwins |
schalten einzelne Blöcke frei, sobald die Inhalte freigegeben sind |
Vor dem Livegang
LEGAL_TODOundCONTENT_TODOinsrc/lib/legal.tsabarbeiten – Anschrift, USt-IdNr., Hoster, Aufsichtsbehörde, Bildnachweise, Dauer-/Paketangaben.- Erst dann
flags.showPlaceholdersauffalsesetzen. Steht danach irgendwo noch ein „[…]“ in einer Pflichtangabe, bricht der Build mit einer Fundstelle ab – der Flip geht nicht ungelesen live. npm run buildund den Inhalt vonout/hochladen.