How I Built My Developer Portfolio with Next.js, Prisma & GSAP

Harshit Bhuju, a developer from Banepa, Nepal, is currently pursuing a BTech in Artificial Intelligence at Kathmandu University. He recently created his personal developer portfolio using Next.js, TypeScript, Prisma, Supabase, GSAP, and Tailwind CSS. The portfolio can be viewed at this link: https://www.harshitbhuju.com.np

For the project, Harshit selected a tech stack that included Next.js for the application framework, React and TypeScript for frontend development, Tailwind CSS for styling, PostgreSQL and Supabase for the database, Prisma as the ORM, GSAP and ScrollTrigger for animations, Lenis for smooth scrolling, and Resend for contact form emails.

One of the main challenges faced during the project was integrating animations without compromising the site's performance. Harshit addressed this by ensuring that important content was available immediately, rather than relying on animations to render it. Additionally, he synchronized Lenis with GSAP's ticker to maintain smooth scrolling and proper synchronization of scroll-triggered animations. This was achieved by linking the `scroll` event with `ScrollTrigger.update` and adding GSAP's ticker to the Lenis RAF function.

Harshit learned that seamlessly incorporating animations and performance optimization is essential for creating an impressive, accessible, and SEO-friendly portfolio. He continues to expand his skills in frontend development, full-stack development, and AI/ML, and plans to share his ongoing learning journey. For more information, visit his portfolio at https://www.harshitbhuju.com.np, check out his GitHub profile at https://github.com/Harshit-Bhuju, or connect with him on LinkedIn at https://www.linkedin.com/in/harshit-bhuju/.