Good Morning

Portfolio V2.0

I redesigned and rebuilt my personal portfolio to present work more clearly and interactively, combining performant static pages with small client-side 3D scenes and micro-interactions. The site improves discoverability of projects, prioritizes accessibility and load speed, and provides a modern, responsive experience that highlights design and engineering work.

TYPE

Web App

ROLE

Full-stack Developer

BUILT

Aug 2025

UPDATED

Aug 2025

VISITLive link

SOURCEGitHub

TECH STACK

TypeScript React

React

Next.js

Tailwind CSS

Framer Motion

Three.js

Vercel

Why I Built This

My goal was to create a portfolio that felt like a product: fast, accessible, and memorable. I wanted an environment that lets visitors quickly scan key projects while also providing delightful details—like a 3D planet hero and subtle scroll-based animations—that reflect my approach to front-end craftsmanship.

Highlights

- 3D hero built with Three.js for an engaging first impression - Fast static rendering via Next.js with selective client-side hydration - Utility-first styling with Tailwind CSS and scoped CSS modules for isolated components - Lightweight custom cursor, preloader, and scroll progress indicators for polish

Architecture

Pages are mostly statically generated with Next.js for SEO and speed; heavier visual pieces (3D model, interactive canvas) are lazy-loaded and isolated into client-only components. Styling uses Tailwind for layout and small CSS modules for component-level overrides; animations rely on Framer Motion and requestAnimationFrame-driven optimizations for smoothness.

What I Learned

Balancing visual richness with performance taught me to defer non-critical rendering, optimize 3D assets, and maintain accessibility without sacrificing creativity. I also refined patterns for splitting client-only UIs from server-rendered content to keep TTFB and CLS low.

NextHabitey

Available for new opportunities

LET'S MAKE
IT HAPPEN

I thrive on crafting dynamic web applications and seamless user experiences. Let's turn your vision into reality.

Start a project

Portfolio V2.0

Why I Built This

Highlights

Architecture

What I Learned

LET'S MAKE IT HAPPEN

Portfolio V2.0

Why I Built This

Highlights

Architecture

What I Learned

LET'S MAKE
IT HAPPEN