Behind the Pixel
Explore the architecture, design decisions, and the powerful admin dashboard that powers this portfolio.
Overview
Detailed stats and quick actions.
Quick Actions
Recent Messages
Optimize Everything
Fast. Accessible. SEO Optimized.
I believe that web performance is user experience. This site is built to be extremely fast, accessible to everyone, and optimized for search engines.
Performance
Accessibility
Best Practices
SEO
Built with Modern Tech
This website utilizes the latest web technologies to ensure performance, SEO, and a great user experience.
Next.js 16
The React Framework for production.
TypeScript
Type-safe code for better scalability.
Tailwind CSS
Utility-first CSS framework for rapid UI.
Supabase
Open source Firebase alternative.
Framer Motion
Production-ready animation library.
Vercel
Develop. Preview. Ship.
Design & Planning
The journey started with a focus on minimalism and usability. Using Figma, I drafted the core layouts with a "Content-First" approach. The goal was to create a clean aesthetic that puts the work in the spotlight while maintaining a unique personality through micro-interactions.
Development
Built with scalability in mind using Next.js 16 (App Router). I utilized TypeScript for robust type-safety and Tailwind CSS for rapid styling. The architecture is modular, separating UI components from business logic, ensuring the codebase remains maintainable as features grow.
The Admin Panel
To manage content dynamically without code changes, I built a custom Admin Dashboard. Protected by Supabase Auth, it allows me to CRUD projects, write blog posts in a rich-text editor, and manage incoming messages in real-time.