Sign in
Skip to solution
hardMachine Coding

Build Whack-a-Mole

483 views
01

Understand the problem

Build a whack-a-mole game with score and countdown timer.

ReactGameTimers
02

Attempt it yourself

Sketch your approach before reading the solution — that's what interviews test.

Nudge consolestandby

Stuck? Beam a request up — the console returns a conceptual nudge that guides your logic without spoiling the implementation.

03

Study the solution

Solve in

Building Whack-a-Mole in React

Mental model: Two timers drive the game: one spawn interval that moves the mole to a random hole, and one countdown that ends the round. State is the active hole, the score, the time left, and whether you're playing. Whacking the active hole scores and (optionally) hides the m

Solution ready — 2 min read

Classified // press E to declassify

04

React solution

Complete solutionRun Playground
import React from 'react';
import WhackAMole from './src/WhackAMole';

export default function App() {
  return (
    <div style={{ fontFamily: 'sans-serif', padding: 20 }}>
      <h1>Whack-a-Mole Demo</h1>
      <WhackAMole />
    </div>
  );
}
05

Join the discussion

Discussion (0)

Sign in to join the discussion.

No responses yet. Be the first to share what you think.

Transmission complete // awaiting log

KEEP THE
STREAK ALIVE.

Dossier 80 of 87 decoded in the Frontend Machine Coding track. One more won't hurt.

Back to track