My Tech Stack for Personal Brand Sites

People ask me what I use to build websites. Here's the full stack, why I chose each piece, and what I'd never switch away from.

Next.js 15+ with App Router. This is the foundation. Server components by default, file-based routing, built-in image optimization, and it deploys to Vercel in one command. I've tried Remix, Astro, SvelteKit. They're all fine. Next.js just has the best ecosystem and the fastest path from idea to deployed production site. I'm not trying to evaluate frameworks — I'm trying to ship.

TypeScript. Not optional. I don't care if your side project is small. TypeScript catches bugs before they happen and makes refactoring painless. The 30 seconds you spend adding a type annotation saves you 30 minutes of debugging 'undefined is not a function' at 2 AM.

Tailwind CSS v4. I used to write CSS files. Now I write utility classes inline and I'm 3x faster. People who hate Tailwind usually haven't used it for more than a day. Once you internalize the class names, you're styling at the speed of thought. The new v4 release with CSS-first config is even cleaner.

GSAP for scroll animations. This is non-negotiable. ScrollTrigger is the best scroll animation library that exists. Pin sections, scrub animations, parallax — it handles everything and performs at 60fps. I use it for every entrance animation, every scroll reveal, every timeline sequence.

Framer Motion for UI animations. Modals, page transitions, hover states, list animations. Anything that's tied to React state or user interaction (not scroll) goes through Framer Motion. The key rule: GSAP handles scroll, Framer Motion handles UI. They never touch the same element. Mixing them causes reconciliation bugs that'll waste your entire day.

Three.js + React Three Fiber for 3D. When a site needs that premium, immersive feel — a particle field, a wireframe globe, a 3D product showcase — I pull in R3F. It's React components for Three.js, so it fits naturally into the Next.js architecture. Not every site needs 3D, but when it does, nothing else comes close.

Lenis for smooth scrolling. Two lines of setup and your entire site feels buttery. It's lightweight, performant, and works perfectly with GSAP ScrollTrigger. I install it on every project by default.

Vercel for deployment. Push to main, site is live in 30 seconds. Preview deployments on every branch. Analytics built in. Edge functions if you need them. I've never had a reason to use anything else for frontend projects.

That's it. No state management libraries (React state + URL params handle everything). No CSS-in-JS (Tailwind replaced it). No heavy UI component libraries (I build what I need or pull from 21st.dev). The stack is lean because every piece earns its spot. If something doesn't make me faster, it's out.