Frontend developer specializing in React, Next.js, and modern web technologies with 2+ years of UI/UX design experience. I create fast, interactive applications that blend algorithmic problem-solving with thoughtful design. Currently building educational tools and visualization platforms to help developers master data structures and algorithms
Live Demo
A portfolio website is more than just a collection of projects—it's a reflection of your skills, personality, and approach to problem-solving. I built my personal portfolio to showcase not only what I've created, but how I think about design, user experience, and modern web development. This project represents the intersection of my UI/UX design background and frontend engineering expertise.
When designing my portfolio, I focused on three core principles: clarity, performance, and personality. The site needed to communicate who I am and what I do within seconds of landing on the page, while still inviting visitors to explore deeper. Every design decision—from typography choices to spacing and color palette—was intentional and user-focused.
I wanted the portfolio to feel like a natural extension of my design sensibility—clean, minimal, and thoughtfully structured. The interface prioritizes content over decoration, using whitespace strategically to create breathing room and draw attention to key elements like project showcases and technical skills.
Built with modern web technologies, the portfolio emphasizes performance and developer experience:
The architecture leverages Next.js's App Router for improved performance and developer experience. Static generation ensures blazing-fast page loads, while dynamic routes handle project details and blog posts efficiently. Every image is optimized using Next.js Image component, achieving perfect Lighthouse scores across all metrics.
Hero Section: The landing introduces visitors with a clear value proposition—"I'm Sahil, a passionate designer & curious developer." This immediately communicates my dual expertise in design and development, setting expectations for the rest of the portfolio. The hero includes a subtle call-to-action that guides visitors to explore projects or learn more about my background.
Project Showcase: Each project is presented with a compelling visual, concise description, and links to live demos and code repositories. Projects like O-Log Visualizer and the Twitter Clone highlight different aspects of my skillset—algorithm visualization, UI implementation, and full-stack capabilities. The showcase uses card-based layouts with hover effects that reveal additional details without overwhelming the initial view.
About Section: This section tells my story—transitioning from UI/UX design to full-stack development while maintaining a strong focus on user experience. It highlights my background, current focus areas, and what drives my approach to building digital products. The narrative creates a personal connection while establishing credibility and expertise.
Skills and Technologies: A comprehensive but digestible overview of my technical stack, organized by category—frontend frameworks, styling tools, backend technologies, and developer tools. Visual indicators show proficiency levels, helping visitors quickly understand my strengths and areas of expertise.
Contact and Social Links: Clear pathways for reaching out, whether through email, LinkedIn, or GitHub. The contact section is intentionally simple, reducing friction for recruiters and potential collaborators who want to connect.
The portfolio's design system balances professionalism with personality. The color palette uses neutral tones as a foundation, with strategic accent colors that guide attention and create visual interest without overwhelming the content. Typography choices prioritize readability while establishing hierarchy—large, bold headings contrast with clean body text for effortless scanning.
Every component follows consistent spacing rules based on an 8-point grid system, creating visual rhythm and cohesion throughout the site. Interactive elements use subtle animations—button hover states, card elevations, and page transitions—that enhance the experience without feeling gimmicky or distracting from the core content.
Performance was a non-negotiable priority. I implemented several optimization strategies to ensure fast load times and smooth interactions:
These optimizations resulted in a Lighthouse score of 95+ across Performance, Accessibility, Best Practices, and SEO—demonstrating technical excellence that complements the visual design.
The portfolio adapts seamlessly across devices, from large desktop monitors to mobile phones. I employed a mobile-first design strategy, starting with the smallest viewport and progressively enhancing the experience for larger screens. This approach ensures optimal performance on mobile devices while taking advantage of additional screen real estate on desktop.
Layout shifts are handled gracefully—the three-column grid on desktop collapses to a single column on mobile, while maintaining visual hierarchy and readability. Touch targets on mobile are appropriately sized for easy interaction, and navigation adapts to use a hamburger menu when screen space is limited.
Search engine optimization was built into the foundation of the portfolio. Each page includes carefully crafted meta tags, Open Graph images for social sharing, and structured data markup to help search engines understand the content. The semantic HTML structure uses proper heading hierarchy and descriptive alt text for images, improving both accessibility and SEO.
Server-side rendering ensures that search engine crawlers receive fully-rendered HTML, improving indexation and search rankings. The sitemap is automatically generated and submitted to search engines, making it easy for potential employers and collaborators to discover my work through organic search.
A portfolio is never truly finished—it evolves as I grow as a developer and designer. I treat the portfolio as a living project, regularly updating it with new work, refining the design based on user feedback, and incorporating the latest web technologies as they mature.
Future enhancements include adding a blog section for technical writing, implementing dark mode for improved accessibility, adding more detailed case studies with process documentation, and exploring interactive elements that showcase advanced frontend capabilities.
Building this portfolio deepened my understanding of:
This portfolio represents more than technical skills—it demonstrates my ability to think holistically about digital products, balancing aesthetics, performance, usability, and business goals. It's a testament to my commitment to craft and continuous improvement, qualities I bring to every project I work on.
Live Demo