Persönliches Portfolio
Die Website, die Sie gerade betrachten. Ein mehrsprachiges Portfolio mit Dark/Light Mode, animierten Timelines, Projekt-Fallstudien und einem eigenen Übersetzungssystem — ohne externe Bibliotheken.
Eigenes mehrsprachiges System ohne externe Abhängigkeiten
Dark/Light Mode mit animierten Übergängen
Editoriale Projektseiten mit Initialen und Zitaten
Statisch generiert für schnelle Ladezeiten auf Vercel Hobby
Dieses Portfolio ist selbst ein Projekt, das ich von Grund auf entworfen und gebaut habe. Das Ziel war eine Website, die sich professionell und hochwertig anfühlt, während sie technisch sauber ist — keine aufgeblähten Komponentenbibliotheken, keine unnötigen Abhängigkeiten und volle Kontrolle über jedes Detail.
Die Website ist mehrsprachig mit einem eigenen Übersetzungssystem basierend auf dynamischen Segmenten des Next.js App Routers. Keine externen Übersetzungsbibliotheken — nur TypeScript-Wörterbücher, eine Middleware zur Browserspracherkennung und ein Sprachumschalter. Alle Seiten werden zur Build-Zeit für jede unterstützte Sprache statisch generiert, was schnelle Ladezeiten auf Vercels kostenlosem Tier ermöglicht.
Das Design verwendet ein Dark/Light-Mode-System mit sorgfältig ausgewählten Farbpaletten für beide Themes.
Animationen sind gezielt und subtil: eine Framer-Motion-gesteuerte Timeline, die sich beim Scrollen füllt, CSS-animierte Lichtpulse entlang dekorativer Kurven und sanfte Einblendungen für Inhaltsabschnitte.
Projektseiten sind vollständige Fallstudien mit editorialen Layouts — Initialen, Zitate, fixierte Seitenleisten — gestaltet, um sich wie Zeitschriftenartikel zu lesen statt wie generische Portfolio-Karten. Das Tech-Icon-Raster verwendet offizielle Simple-Icons-SVGs für authentische Markendarstellung.
Die gesamte Website ist mit Next.js 16, TypeScript und Tailwind CSS v4 gebaut, deployed auf Vercel. Kein CMS, keine Datenbank, keine Laufzeitabhängigkeiten über React und Framer Motion hinaus. Die Codebasis ist sauber genug, dass das Hinzufügen eines neuen Projekts oder einer Sprache lediglich das Ergänzen von Einträgen in einer TypeScript-Datei erfordert.
Etwas Ähnliches gesucht?
Lassen Sie uns darüber sprechen, was ich für Ihr Unternehmen bauen kann.
Kontakt aufnehmen