Next.jsTailwind CSSFramer MotionTypeScript
Developer Portfolio
Built with Next.js 15, Tailwind CSS v4, and Framer Motion. Smooth scroll animations, a custom hero section, and fully responsive dark-mode design.
D
The Challenge
Creating subtle, purposeful animations without sacrificing performance or accessibility.
The Solution
Used Framer Motion's layout animations and viewport-triggered variants for scroll-based reveals with prefers-reduced-motion support.
Key Outcomes
- 100 Lighthouse performance score
- Fully accessible with ARIA landmarks
- < 3s load on 3G with Next.js image optimization
- Zero layout shift (CLS = 0)