Skip to content

Release v3.0.0 - Next.js 16 & React 19 Upgrade

Choose a tag to compare

View all tags
@rlajous rlajous released this 03 Dec 02:53
· 31 commits to main since this release
v3.0.0
c5aac2b

Released: December 2, 2025

⚠️ BREAKING CHANGES

This is a major version release with significant framework upgrades and architectural changes:

  • Next.js 14.1.4 → 16.0.6: Turbopack is now stable and the default bundler
  • React 18.2.0 → 19.2.0: Latest React with new features and improved performance
  • Async Params API: All dynamic routes now use the new async params pattern
  • Node.js Requirements: Minimum Node.js version is now 20.9.0

Migration Notes:

  • If you're running this locally, ensure Node.js ≥20.9.0 and npm ≥10.0.0
  • The site is fully compatible and deployed - no action needed for visitors
  • All breaking changes have been resolved in this release

🎉 What's New

  • Next.js 16 with Turbopack: Upgraded to the latest Next.js version with stable Turbopack bundler for 5-10x faster builds
  • React 19: Upgraded to React 19.2.0 with improved performance and new features
  • Async Params Migration: All dynamic routes (projects, experience, education, talks) migrated to Next.js 16's async params pattern
  • Enhanced Email System: Migrated to Resend v6 with React Email components for better email rendering

💅 Code Improvements

  • Zod Validation: Added Zod schema validation to contact API route for type-safe form submissions
  • Type Safety: Improved TypeScript types across all dynamic routes with proper async/await patterns
  • Code Cleanup: Removed unused subject field from ContactSchema
  • Hydration Fix: Resolved React 19 hydration mismatch with theme provider

🔧 Maintenance

  • Engine Requirements: Added Node.js (≥20.9.0) and npm (≥10.0.0) version requirements to package.json
  • ESLint Plugin: Added eslint-plugin-react-hooks v6.0.0 for React 19 compatibility
  • TypeScript: Updated to TypeScript 5.9.3
  • ESLint: Updated to ESLint 9 with improved linting capabilities

📦 Dependencies

Major Updates:

  • next: 14.1.4 → 16.0.6
  • react: 18.2.0 → 19.2.0
  • react-dom: 18.2.0 → 19.2.0
  • resend: 5.x → 6.5.2
  • zod: 3.x → 4.1.13
  • typescript: 5.4.3 → 5.9.3
  • eslint: 8.x → 9.x

New Dependencies:

  • @react-email/components: ^1.0.1
  • @react-email/render: ^2.0.0
  • eslint-plugin-react-hooks: ^6.0.0

Component Updates:

  • All Radix UI components updated to React 19 compatible versions
  • @radix-ui/react-avatar: ^1.1.6
  • @radix-ui/react-dialog: ^1.1.15
  • @radix-ui/react-dropdown-menu: ^2.1.11
  • @radix-ui/react-label: ^2.1.5
  • @radix-ui/react-navigation-menu: ^1.2.14
  • @radix-ui/react-slot: ^1.2.4
  • @radix-ui/react-tabs: ^1.1.5
  • @radix-ui/react-toast: ^1.2.10

🚀 Deployment

This release was automatically deployed via Vercel:

📁 Files Changed

13 files changed across the application:

API Routes:

  • app/api/contact/route.ts - Added Zod validation

Dynamic Routes (Async Params Migration):

  • app/projects/[slug]/page.tsx
  • app/experience/[slug]/page.tsx
  • app/education/[slug]/page.tsx
  • app/talks/[slug]/page.tsx

Layout & Theme:

  • app/layout.tsx - Added suppressHydrationWarning
  • components/theme-provider.tsx - Updated import path

Email Templates:

  • components/emails-templates/ContactEmailTemplate.tsx - Migrated to React Email

Assets:

  • app/favicon.ico - Deleted (replaced with PNG)
  • app/icon.png - Added (Turbopack compatible format)

Configuration:

  • package.json - Dependencies and engine requirements
  • package-lock.json - Dependency lock file
  • tsconfig.json - TypeScript configuration

🔍 Technical Details

Dynamic Route Migration:
All dynamic routes now use the new async params API required by Next.js 16:

// Before (Next.js 14)
export default function Page({ params }: { params: { slug: string } }) {
  const project = findProject(params.slug);
}

// After (Next.js 16)
export default async function Page({ params }: { params: Promise<{ slug: string }> }) {
  const { slug } = await params;
  const project = findProject(slug);
}

Email System Migration:
Migrated from basic HTML rendering to React Email components for better compatibility with Resend v6:

// Now using @react-email/components
import { Html, Body, Container, Heading, Text } from "@react-email/components";

Full Changelog: v2.2.1...v3.0.0

Assets 2
Loading