A modular and scalable portfolio that showcases my growth as a front-end developer. Built with the Next.js, Tailwind, and Contentful, the site highlights key projects, my professional journey, and a fully customized resume, all while following a refined UI inspired by modern design systems.
I handled the entire development and design of the site — from setting up CMS content models in Contentful to building reusable UI components with Tailwind. I focused on achieving visual consistency, accessible interactions, dynamic data handling, and a scalable structure.
This is my main portfolio site — built from scratch as a long-term foundation to document my skills, experience, and personal evolution as a developer. Every section is structured to be flexible and reusable, and all content is dynamically pulled from Contentful. The design is intentionally clean, color-balanced, and optimized to be both expressive and professional.
Stack:
The user journey of my portfolio website guides visitors through a smooth and engaging experience — starting with clear CTA buttons and recent project highlights on the homepage, supported by an intuitive navigation menu. As users move into the portfolio section, they’re met with detailed project showcases that include technical insights and interactive elements, making it easy to explore more work. The journey continues through the "About Me" and "Journey" pages, where I share personal stories and career milestones to foster a deeper connection. Each section offers a clear window into my skills, growth, and perspective as a developer. The experience wraps up with a dedicated contact page, making it effortless for visitors to reach out.
Projects, timeline entries (Journey), and resume sections are fully managed via Contentful, allowing for dynamic updates without touching the code and making it easy to update and expand.
Every component, from <ProjectCard /> to <ExperienceItem />, is intentionally designed for flexibility with minimal props, clean structure, and clear separation of concerns. This approach supports easier testing, consistent reusability across the site, and long-term scalability, making the codebase simpler to maintain and extend as the project grows.
This portfolio acts like a digital scrapbook — a place where I document and evolve my professional and creative journey. Dedicated pages to share not only technical milestones, but also personal reflections and creative evolution.
Challenge
Content like projects, resume, and timeline entries previously required code changes to update. This made maintaining and scaling the site inconvenient and error-prone. JSON files were used to store structured data, but they lacked flexibility and dynamic control.
Solution
Integrated Contentful as a headless CMS to manage content externally. Built flat content models with optional JSON fields for flexible nested data. This allowed non-code content updates and opened the door for richer dynamic rendering without modifying source files.
Challenge
The initial version of the portfolio relied on manually written CSS and static JSX structure. While it achieved the desired layout and design, it made the codebase rigid and difficult to maintain or reuse. There was no scalable way to extend UI patterns across the site.
Solution
Converted custom CSS into Tailwind utility classes and refactored static JSX into reusable, self-contained components like ProjectCard, Avatar, and Button. This made the codebase easier to scale, visually consistent, and much simpler to update or expand in the future.
Challenge
The earlier version of the portfolio was built with plain React, which lacked native routing, layout support, and SEO capabilities. As the site grew, managing routes, page metadata, and shared layouts became repetitive and harder to scale.
Solution
Migrated the codebase to Next.js 15 using the App Router for file-based routing, nested layouts, and improved scalability. Implemented dynamic routes for project and resume pages, added structured metadata for SEO, and leveraged server components where appropriate to optimize performance and page structure.
Planning to add a private dashboard (e.g., using Plausible or Vercel Analytics) to track page interest, clicks on projects, and common navigation paths. This will help understand how visitors interact with the site and which content gets the most traction.
Feel free to reach out with any questions, feedback, or collaboration ideas related to my portfolio. You can get in touch through the contact page or connect via the social links in the footer.