How to create a countdown timer in React?

To create a countdown timer in React, we use the react-countdown package.

To install it, we run

npm i react-countdown

Then we write

import React from "react";
import ReactDOM from "react-dom";
import Countdown from "react-countdown";

const Completionist = () => <span>You are good to go!</span>;

ReactDOM.render(
  <Countdown date={new Date("2022-09-26T10:05:29.896Z").getTime()}>
    <Completionist />
  </Countdown>,
  document.getElementById("root")
);

to add the Countdown component to start the count down from the date prop value.

We render Completionist if the count down timer is finished.