Back to Projects
Portfolio
Modern developer portfolio with IDE-inspired design, command palette, terminal emulator, and 6 arcade games
Next.js 16TypeScriptTailwind CSS 4SupabaseFramer MotionVercel
The Problem
Most developer portfolios are boring static pages that fail to showcase technical skills or engage visitors. Recruiters spend seconds on each portfolio before moving on.
The Approach
Built a production-grade portfolio that showcases technical skills while being genuinely engaging:
Interactive Features:
- Command Palette (⌘K) - VS Code/Raycast-inspired instant navigation
- Terminal Emulator - Working terminal with custom commands that query the database
- 6 Arcade Games - Snake, Tetris, Pong, Breakout, Flappy Bird (vanilla Canvas API)
- Phone Mockup - Interactive mobile preview of projects
Design System:
- 4 Color Themes - Dark, Cyber, Dracula, Solarized
- IDE-inspired aesthetic with monospace fonts
- Responsive design for all devices
- Smooth animations with Framer Motion
Full CMS:
- Admin panel at /admin with Supabase Auth
- Manage projects, blog posts, site settings
- Terminal command editor
- Theme customization
- Asset management
Technical Excellence:
- Next.js 16 with App Router and Turbopack
- TypeScript 5 for type safety
- Tailwind CSS 4 for styling
- Supabase for PostgreSQL, Auth, Storage
- PWA-ready with offline support
- 98 Lighthouse score
The Impact
98 Lighthouse score. Sub-1s LCP on 3G. The terminal and games make recruiters actually spend time on the site instead of bouncing. Open-sourced for the community.