Blog

Your dream job? Lets Git IT.
Interactive technical interview preparation platform designed for modern developers.

XGitHub

Platform

  • Categories

Resources

  • Blog
  • About the app
  • FAQ
  • Feedback

Legal

  • Privacy Policy
  • Terms of Service

© 2025 LetsGit.IT. All rights reserved.

LetsGit.IT/Categories/Next.js
Next.jshard

What causes a hydration mismatch in React/Next.js and how do you fix it?

Tags
#hydration#ssr#react#bug
Back to categoryPractice quiz

Answer

It happens when the server-rendered HTML differs from the client’s first render (e.g., `Math.random()`, `Date.now()`, `window` branches, locale formatting). Fix by making initial render deterministic or moving client-only values to `useEffect`/client components.

Related questions

Next.js
Theme toggle hydration mismatch: what causes it and how do you avoid it?
#nextjs#react#hydration
Next.js
Static vs dynamic rendering — how do you force a route to be dynamic and why?
#ssr#dynamic#cache
Next.js
SSR vs SSG vs ISR — what’s the difference in Next.js?
#ssr#ssg
#isr
Next.js
What does the `'use client'` directive do?
#use-client#client-component#react
Next.js
SSR vs SSG?
#nextjs#rendering#ssr