Portfolio v2
Developer Portfolio
This portfolio website showcases modern web development capabilities with smooth page transitions, interactive UI elements, and a dark-mode design system. Built from the ground up with Next.js App Router and Framer Motion animations.
Tech Stack
Links
Category
DesignSystem Design
Built on Next.js App Router with a component-based architecture. Uses Tailwind CSS for styling, Framer Motion for animations, and follows a modular section-based layout pattern.
01Framework
Next.js App Router providing file-based routing, server components, and optimal performance through static generation.
02Styling
Tailwind CSS 4 for utility-first styling with custom design tokens. Global CSS variables for theme colors and consistent spacing across components.
03Animations
Framer Motion for page transitions, scroll-triggered animations, and interactive UI elements. Reusable animation variants defined in a shared motion library.
04Components
Modular component architecture with clear separation: sections (page-level blocks), UI (reusable primitives), and shared (cross-cutting features).
What it does
Problems solved
Coordinating complex staggered animations without performance degradation
Achieving consistent dark-mode aesthetics across all components and pages
Building a reusable design system from scratch without a component library