How I Built This Portfolio

I wanted a portfolio that felt like me — not a template, not a wall of text, just something fun to scroll through. So I built this from scratch with Next.js, Tailwind, and Framer Motion.

The Stack

Next.js 16 with App Router handles routing and static generation. Tailwind v4 keeps styling fast and consistent. Framer Motion powers the scroll-linked animations — the parallax hero, the growing timeline line, and the card fade-ins. Lenis gives everything that smooth, buttery scroll feel.

The Timeline

The homepage timeline is the centerpiece. Each card animates in as you scroll, with a progress line that grows down the center. I went with a zigzag layout on desktop (cards alternate left and right) and a single column on mobile. Each event type — career, education, personal — gets its own color accent so you can scan quickly.

The Space Theme

I've always loved space aesthetics. The background has multiple star layers with different parallax speeds, plus random shooting stars. A custom rocket SVG cursor replaces the default pointer, and a spotlight glow follows your mouse around the page. It's all CSS and JS — no heavy libraries.

What's Next

I'll keep adding clips and blog posts as I go. The whole thing is open source on GitHub if you want to poke around.