Next.js Discord

Discord Forum

Text content does not match server-rendered HTML. (probably a very beginner problem)

Unanswered
Red-legged Kittiwake posted this in #help-forum
Open in Discord
Red-legged KittiwakeOP
When I load the page localhost:3000/home, it sometimes throws these two errors. I'm not sure what's causing it, but generally, the more code I comment out, the less frequent it happens. What could be some reasons it's happening? If you would like some specific code, please tell me.

19 Replies

i am a beginner who has no idea what he's doing
please tell me if you see any bad practices or suboptimal approaches
i accidentally made a new master branch
sry, ill fix that later
@joulev can you open the browser console and screenshot for me the error messages there? they do have more info than these shortened messages and can potentially help a lot
Red-legged KittiwakeOP
is that too blurry
the issue is because this line https://github.com/109105116/school-forum/blob/0df5d79058aa71583315db57bdde99fc32f75d30/src/components/Sidebar.tsx#L93 user?.photoURL is null on the server but populated with correct data on the client
the reason idk... i dont use react-firebase-hooks
but you can add suppressHydrationWarning to the img element to disable the error
if the current behaviour (excluding the error) is good enough for you
Red-legged KittiwakeOP
ty
@joulev the reason idk... i dont use `react-firebase-hooks`
Red-legged KittiwakeOP
how do you usually manage user info and other state
it seems pretty slow
Red-legged KittiwakeOP
it has to re-render every reload
i don't use firebase
next-auth or supabase or clerk or similar auth providers provide quite good developer experience and user experience