Premium

React Countdown Timer (Start, Pause, Reset)

By FrontendAtlas Editorial · Updated Oct 15, 2026

Challenge summary

Build a React countdown timer with a seconds input and Start, Pause and Reset controls. The clock shows mm:ss, ticks once per second while running, stops at zero with a Done status, and never leaks an interval when it is paused, reset or unmounted.

What you'll practice

  • Render the remaining time as mm:ss in an element with the class value.
  • Render the current status (Ready, Running, Paused, Done) in an element with the class status.
  • Provide Start, Pause and Reset buttons in that order inside .actions.
  • Provide a number input with id duration that sets the countdown length in seconds while the timer is not running.
  • Reset stops ticking and returns the clock to the chosen duration with status Ready.

What Premium unlocks

Premium unlocks the runnable workspace, behavioral checks, implementation walkthrough, and edge-case discussion.

Free related practice

Public interview reports: LeetCode Discuss (April 2020)

Upgrade to FrontendAtlas Premium to unlock this challenge. Already upgraded? Sign in to continue.