Create countdown timer which takes a timestamp as input
Answered
Blue swimming crab posted this in #help-forum
Blue swimming crabOP
Hi everyone, I'm trying to create a countdown which shows a countdown (
I found this package but it gives me hydration errors when I try to use it. https://www.npmjs.com/package/react-countdown
hh:mm:ss) based on a unix timestamp. I'm using Next.js 13 with the app dir. Is it even possible in a server component? Every example I found uses hooks which are not available on the server. Or should I implement it in a client component?I found this package but it gives me hydration errors when I try to use it. https://www.npmjs.com/package/react-countdown
Answered by DirtyCajunRice | AppDir
No it is not possible. Changing hydrated text requires access to window which is a client concept
3 Replies
Sloth bear
I don’t believe it would be possible in a server component without doing some major workarounds, which probably aren’t worth the effort. Just make it a client component. The difference in performance will be negligible.
@Blue swimming crab Hi everyone, I'm trying to create a countdown which shows a countdown (`hh:mm:ss`) based on a unix timestamp. I'm using Next.js 13 with the app dir. Is it even possible in a server component? Every example I found uses hooks which are not available on the server. Or should I implement it in a client component?
I found this package but it gives me hydration errors when I try to use it. https://www.npmjs.com/package/react-countdown
No it is not possible. Changing hydrated text requires access to window which is a client concept
Answer
Blue swimming crabOP
Thanks, I solved it with a client component now 🙂