A showcase of my software engineering capabilities.
A full-stack personal portfolio application designed to showcase software engineering projects, technical skills, and professional experience. Built with a focus on high performance and an immersive user experience, the website features advanced 3D visualizations, smooth scroll animations, and a seamless integrated booking system to facilitate direct communication with potential clients or recruiters.
I wanted to build an experience that serves as living proof of my skills integrating complex 3D rendering with a robust infrastructure was the core constraint that drove my technical decisions.
Every dependency from GSAP for smooth animations to Docker for reproducible deployments was deliberately chosen to balance frontend immersion with production-grade server reliability.
The application follows a decoupled pattern where the frontend handles intensive WebGL rendering, while the Dockerized infrastructure layer ensures secure, isolated delivery.
Nuxt 4 and Vue 3 managing UI components, dynamic routing, and server-side rendering for optimal SEO.
Three.js and GSAP isolated in specific client-only components to prevent SSR hydration mismatches.
Docker Compose orchestrating Node.js containers alongside a Traefik reverse proxy handling automated Let's Encrypt TLS challenges.
Client state is scoped strictly using Vue's Composition API primitives (ref, reactive), avoiding bloated global stores for better performance.
Implemented a dedicated rendering pipeline using Three.js to construct an interactive globe that maps technical skills directly onto user interactions.
Designed a zero-touch SSL and reverse proxy routing architecture capable of handling container reloads.
The Cal.com integration acts as a primary interaction backend layer, embedded directly via namespace-isolated script injection to keep the main Vue thread free from intensive initial processing overhead until triggered.
Traded simple static hosting for a Node.js runtime to gain Server-Side Rendering (SSR). This drastically improved initial load times and overall SEO metadata generation capabilities. The downside of maintaining server environments was vastly offset by the performance gains.
Chose to manage my own server instance using complete Docker deployment flows over easier Vercel deployments to explicitly demonstrate deep DevOps skills and fundamental infrastructure awareness.
Discovered that Single Page Applications (SPAs) require meticulous explicit disposal of all Three.js geometries, specific materials, and raw textures precisely upon component unmounting to completely block severe browser tab memory leaks.
Learned to rigorously separate generic server-renderable HTML elements from dynamic browser-only WebGL UI canvases to prevent deeply complex tracking mismatches during Vue element hydration rendering.
MAKE IT WORK. MAKE IT RIGHT. MAKE IT FAST. — Kent Beck
