Cannot render date on client side.

[spiral heath]

cannot render date client side (hydration errors)

so i'm making a real time ish clock, ```js
const [date, setDate] = useState(new Date());
useEffect(() => {
setInterval(() => setDate(new Date()), 1000);
}, []);

```js
{date.toLocaleTimeString({
            hour: '2-digit',
            minute: '2-digit',
            second: '2-digit'
          })}

but this just ends up throwing hydration errors

[gloomy bronze]

Wrap it in a useEffect

[spiral heath]

just realised I could've just call toLocaleTimeString inside useEffect

thanks

[spiral heath]

well that doesn't work either

[gloomy bronze]

const [toDisplay, setToDisplay] = useState("loading");
useEffect(() => {
  setToDisplay(date.toLocaleTimeString({
            hour: '2-digit',
            minute: '2-digit',
            second: '2-digit'
          }));
}, []);```

[spiral heath]

oh, so i don't gotta load the time instantly, got it

[gloomy bronze]

Yeah

[spiral heath]

ay that worked, thanks