Personal Portfolio
Frontend DeveloperImpact
- Built full-stack portfolio with Next.js 13+ App Router, Tailwind CSS, and dynamic project routing via [slug] pages
- Designed glassmorphism UI with dark theme, custom gradients, and responsive layouts across mobile/tablet/desktop
- Implemented live project timeline component tracking 16+ updates across all projects with date-stamped entries
- Integrated Google Tag Manager analytics and deployed on Cloudflare Pages with optimized static generation
Skills
Project Abstract & Details
A modern, high-performance developer portfolio built with Next.js 13+ App Router and Tailwind CSS. Features a responsive dark-themed design with glassmorphism effects, dynamic project showcases with letterboxed previews, a live project timeline tracking ongoing development, and integrated contact form. Deployed on Cloudflare Pages with Google Tag Manager analytics.
Key Features
Dark Theme Design
Glassmorphism UI with dark theme, custom gradients, and responsive cross-device layout optimization
Dynamic Project Routing
Next.js App Router with [slug]-based dynamic project detail pages generated from static data
Responsive Grid
Letterboxed project previews in a two-column domain-based layout with mobile-first responsive design
Live Timeline
Date-stamped project timeline component tracking 16+ updates with ongoing development entries
Cloudflare Deployment
Optimized static generation deployed on Cloudflare Pages with Google Tag Manager analytics
Sticky Card Layout
Sticky-positioned project cards with scroll-based stacking for engaging visual browsing experience
Architecture
Next.js 15 App Router with static generation (generateStaticParams). Pages: Homepage (client-side Projects component with domain-based two-column layout) + Dynamic [slug] project detail pages. Data flows from static JS module (utils/data/projects-data.js) into React components. Styling via Tailwind CSS with SCSS for custom components. Deployment via Cloudflare Pages with GTM analytics.
Architecture diagram placeholder