Back to Home

Engineering Portfolio V3

A narrative-driven, high-performance portfolio featuring a custom CRT transition, 3D globe visualization, and robust Docker orchestration.

Next.jsTypeScriptFramer MotionTailwind CSSDockerCobe

Engineering Portfolio V3

This portfolio is not just a collection of links; it is a demonstration of engineering rigor applied to frontend architecture and developer experience.

Technical Highlights

  • Narrative UX Transitions: Developed a custom "CRT Flash" transition system using Framer Motion that handles state-locked navigation between "Work" (Dark/Zinc) and "Life" (Light/Cream) sections.
  • Interactive Visuals: Integrated a high-performance 3D canvas globe using the Cobe library, optimized for 60 FPS on high-DPI displays with intelligent sample-rate management.
  • Static Content Pipeline: Engineered a robust MDX processing layer that extracts metadata and architectural diagrams from flat files, providing a headless CMS experience with zero runtime overhead.
  • DevOps & Portability: Crafted a surgical Docker deployment strategy featuring multi-stage builds and an automated local shell script that handles port conflicts and Docker Desktop initialization.

Core Features

  • 🎭 The "Work/Life" Split: A visual and narrative dichotomy enforced through global theme transitions and independent layout groups.
  • 📺 CRT Animation: A signature transition effect that simulates a hardware monitor flash, bridging the gap between terminal-based content and visual imagery.
  • 🌍 Global Reach: A performant globe visualization highlighting personal history and project impact.
  • 🐳 One-Click Deploy: Hardened local deployment scripts ensuring any developer can spin up the environment without manual configuration.