Refreshing the Site

Published: Jan 4, 2026 · 2 min read By Haris
  • Next.js
  • Tailwind CSS
  • Engineering

A behind-the-scenes look at the technical refresh of my portfolio, featuring Next.js 16, Tailwind 4, and a migration to Content Collections.

It's been a busy few weeks refreshing my portfolio. I wanted to modernize the stack and improve the developer experience while adding some fun visual flair. Here is a breakdown of the key changes I've made since the last major update.

Visual & Fun Updates

One of the most enjoyable additions is the PixelSnow effect. I wanted something that felt dynamic but not overwhelming. It adds a subtle, interactive winter vibe to the site.

I also completely redesigned the Contact Form. It's now powered by Resend, migrating away from the old method of using Gmail app passwords. This change not only improved reliability but also simplified the backend logic significantly. The new form is cleaner, faster, and provides better feedback.

Under the Hood: Infrastructure & Monitoring

Reliability was a big focus for this refresh. I integrated Sentry for real-time error tracking and performance monitoring. This gives me visibility into how the site performs in production and alerts me to any issues before they affect users.

For analytics, I set up Google Tag Manager (GTM). This allows for more flexible tracking implementation without needing to constantly redeploy the codebase for every tag change.

Content Management Migration

Previously, I was using Notion as a CMS. While Notion is great for writing, using it as a headless CMS introduced latency and complexity in the build process.

I've now migrated to Content Collections. This allows me to write posts and projects in MDX directly within the repository. It offers type-safe data access and a much faster build time. I also updated the content structure, adding new projects and refreshing the blog section.

Tech Stack Upgrades

Finally, the core technology stack has been bumped to the bleeding edge:

  • Next.js 16: Leveraging the latest App Router features.
  • React 19: Ready for the future of React.
  • Tailwind CSS 4: Adopting the new engine for better performance and a streamlined configuration.
  • Bun: Switched to Bun for lightning-fast package installation and script execution.

This refresh sets a solid foundation for future content and features.