Persönliche Website

Übersicht

Eine mehrsprachige persönliche Website (EN/DE/FR (WIP)/IT (WIP)), die sowohl als Vorstellung als auch als lebendiger Überblick über die Arbeit dahinter konzipiert ist. React 19 und TypeScript bilden das Frontend, während Bun das Build Tooling, die Tests und die typisierte Content Pipeline ausführt.

Das Ziel war eine ruhige und direkte User Experience: Von einer prägnanten Startseite gelangen Besucher zu Projekten, beruflichem Werdegang, Interessen und den eingesetzten Technologien, ohne den Zusammenhang zwischen Person und Arbeitsweise zu verlieren.

Inhalte ohne CMS

Manuell gepflegte Markdown- und YAML-Dateien bleiben die massgebliche Quelle. Ein eigener Compiler validiert jedes Dokument, verbindet es mit sprachunabhängigen Manifestdaten und erzeugt einen typisierten Browser-Katalog. So lassen sich Projektgeschichten einfach bearbeiten, während fehlende Metadaten, veraltete Übersetzungen und ungültige Beziehungen bereits vor dem Deployment erkannt werden.

Dasselbe System unterstützt vier Sprachen, lokalisierte SEO-Metadaten, alternative Sprachlinks und wiederverwendbare Detailseitenmuster – ganz ohne CMS eines Drittanbieters.

Für Erkundung gestaltet

Die Website verbindet verschiedene Ansichten zu einer gemeinsamen Nutzererfahrung, statt jede Seite als isoliertes Ziel zu behandeln. Vorschauen auf der Startseite führen zu ausgewählten Projekten und Karrierestationen, Projektdetailseiten verknüpfen ihre Geschichten mit den eingesetzten Technologien und der Tech Stack lässt sich anhand der tatsächlichen Nutzungshistorie durchsuchen, filtern und sortieren.

Bewegung verleiht diesen Übergängen Rhythmus. Gleichzeitig bleibt der Inhalt gut lesbar, und prefers-reduced-motion wird respektiert, wenn Besucher Animationen deaktivieren.

Deployment und AWS-Infrastruktur

Jede öffentliche Route und Sprachversion wird als statisches HTML vorgerendert. Das ermöglicht schnelle erste Ladezeiten, zuverlässige Vorschauen beim Teilen und nutzbare Inhalte, noch bevor JavaScript vollständig geladen ist. AWS CDK verwaltet die Produktionsinfrastruktur: Route 53 und ACM übernehmen DNS und TLS, CloudFront liefert die Website aus einem privaten, verschlüsselten und versionierten S3 Origin aus und eine CloudFront Function übernimmt die Weiterleitung zur kanonischen Domain sowie Clean URL Rewrites.

Version Tags starten einen GitHub Actions Workflow, der die Website validiert und baut, über OIDC eine nach Least Privilege beschränkte AWS Deployment Role übernimmt, Assets mit passenden Cache-Regeln nach S3 überträgt, CloudFront invalidiert und das Live Deployment verifiziert. In GitHub werden keine dauerhaften AWS-Zugangsdaten gespeichert.

Das Kontaktformular ist der einzige serverseitige Pfad. CloudFront leitet /api/contact an eine gedrosselte API Gateway HTTP API und eine ARM Lambda Function weiter. Sie validiert die Anfrage und stellt die Nachricht über SES zu, ohne deren Inhalt zu speichern. CloudWatch Alarms und SNS Notifications überwachen Fehler in API und Lambda; Access Logs werden nur zeitlich begrenzt aufbewahrt.

Das responsive Layout wird für Desktop- und Smartphone-Ansichten getestet. Assets durchlaufen die Build Pipeline von Bun, sodass dieselbe Quelle lokale Entwicklung und Produktionsausgabe unterstützt.

Auf Weiterentwicklung ausgelegt

Das Projekt umfasst Unit Tests für Inhaltsbeziehungen und UI-Verhalten, TypeScript-Prüfungen an Modulgrenzen, Aktualitätsprüfungen für Übersetzungen und eine automatisierte Content-Kompilierung. Semantische Navigation, sichtbare Fokuszustände, Unterstützung für reduzierte Bewegung, lokalisierte Labels und einwilligungsbasierte Analytics werden als Teil des Produkts behandelt – nicht als nachträgliche Politur.

Diese Grundlage macht die Website zu einem dauerhaften System: Neue Arbeiten lassen sich als strukturierte Inhalte ergänzen, während gemeinsame Seitenmuster, Accessibility und Deployment konsistent bleiben.