fictional_portfolio
Eine interaktive Seite in reinem Vanilla-JavaScript – mit eigener Physik-Engine für fliegende Raketen, Pacman-Button, animierten Diagrammen und per AJAX nachgeladenen Kapiteln.
Motivation: Als Teil meiner Frontend-Weiterbildung wollte ich schauen, wie gut ich reines HTML+CSS+JavaScript beherrsche und ob ich damit eine interaktive Physik-Engine nachbauen kann.
fictional_portfolio ist eine interaktive Portfolio-Seite in reinem Vanilla
JavaScript – kein Framework, kein Build-Schritt. Der komplette Inhalt des
fiktionalen Portfolios wird zur Laufzeit aus einer JSON-Datei aufgebaut
(assets/data.json, geladen per XMLHttpRequest, inkl. der Überschriften,
Texte und Bilder), und als verspielte Ebene darüber liegt ein kleines
„Raketen”-Spiel als Easter Egg mit eigener Physik-Engine und einem
überschriebenen Rechtsklick-Menü. Sämtliche Inhalte sind fiktive Demo-Daten.
Die einzelnen Bausteine – vom datengetriebenen Rendering über animierte Diagramme und Markdown-Blöcke bis zum physikbasierten Raketen-System – sind in der Galerie unten im Detail beschrieben. Die Struktur der Seite passt sich der Breite des Bildschirms an (Wechsel zwischen Browser am PC oder am Handy).
Die Medien in der Galerie wurden automatisch aus der laufenden Seite aufgenommen (Playwright + ffmpeg), inklusive sichtbarem Mauszeiger und Klick-Visualisierung.
