This is a personalized birthday website I built for one of my closest friends as a birthday gift.
Instead of buying an expensive gift, I wanted to create something meaningful that reflected our friendship and allowed me to apply the frontend skills I had been learning.
The website follows a mock court case theme inspired by an inside joke between us, creating a fun and memorable experience.
- Next.js
- TypeScript
- Tailwind CSS
- Framer Motion
- Git & GitHub
- Building reusable React/Next.js components
- Structuring layouts correctly
- Debugging component spacing issues
- Turning a personal idea into an interactive user experience
One of the biggest challenges was a layout issue where the page wasn't respecting the spacing I expected.
Initially, I kept adding padding to the , but the problem remained.
After debugging, I realised the padding needed to be applied to the component itself rather than the page container.
This helped me understand how layouts work across nested components in Next.js.