← Back to projects
Project

Portofolio site

Portofolio site

This is my personal portfolio website, built as a final project to showcase my skills as a frontend developer. The site is built with Next.js 15 using the App Router, TypeScript, and Tailwind CSS, and is fully deployed on Vercel with automatic deployments triggered on every GitHub push.

The content is managed through Sanity CMS, a headless content management system that allows me to add, edit, and remove projects without touching the codebase. Projects are fetched dynamically using GROQ queries and rendered with static generation and revalidation for optimal performance and fast load times.

The portfolio features a hero section, an about section, a services section, and a projects section that displays the three most recent projects on the homepage. A dedicated projects page shows all projects, with the most recent one highlighted as a featured project. Each project has its own detail page with a full description, technologies used, and a project image.

The site also includes a fully functional contact form that sends email notifications directly to my inbox using Nodemailer and a Gmail account. The form includes client-side validation, a loading state, and a success state that is persisted in localStorage so the confirmation message remains visible after a page refresh.

The design is built around a custom design system with consistent color variables, typography using a serif and sans-serif font combination, and smooth hover transitions throughout the interface. The site is fully responsive and optimized for all screen sizes.

Technologies

Next.js 15TypeScriptTailwind CSS Sanity CMSGROQNodemailer VercelHuskyESLint Prettier