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

[civic gull]

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.

[sleek current]

Post created!

🔎 This post has been indexed in our web forum and will be seen by search engines so other users can find it outside Discord

      🕵️ Your user profile is private by default and won't be visible to users outside Discord, if you want to be visible in the web forum you can add the "Public Profile" role in <id:customize>

      ✅ You can mark a message as the answer for your post with `Right click -> Apps -> Mark Solution`
      (if you don't see the option, try refreshing Discord with Ctrl + R)

[astral bane]

yeah i need some specific code here – give us a minimal reproduction repository

[civic gull]

https://github.com/109105116/school-forum/tree/master

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

[astral bane]

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

[civic gull]

is that too blurry

[astral bane]

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

[civic gull]

ty

[civic gull]

how do you usually manage user info and other state

it seems pretty slow

it has to re-render every reload

[astral bane]

i don't use firebase