Live editor

Let's code

Live Editor

function Clock(props) {
  const [date, setDate] = useState(new Date());

  useEffect(() => {
    const timerID = setInterval(() => tick(), 1000);

    return function cleanup() {
      clearInterval(timerID);
    };
  });

  function tick() {
    setDate(new Date());
  }

  return (
    <div>
      <h4>
        Date: {date.toLocaleDateString()},{" "}
        {date.toLocaleDateString(undefined, { weekday: "long" })}
      </h4>
      <h4>
        Time: {date.toLocaleTimeString([], { hour12: false })} · {" "}
        {date.toLocaleTimeString([], {})}
      </h4>
    </div>
  );
}

Result

Loading...