Build a batched counter
Coordinate queued state updates without dropping rapid user input.EasyReact Fundamentals
15 min82.4% acceptance
Description
Build a counter with increment, decrement, and add-three actions. The component must use functional state updates so every click is represented, even when React batches updates.
Requirements
The counter initially displays a value of 0.
Activating the Increment button increases the displayed count by one.
Activating the Decrement button decreases the displayed count by one.
Activating the Add three button queues three increments and increases the displayed count by exactly three.
Every counter action is exposed as a keyboard-operable button with an accessible name.
Rapid updates
Input
Click Add three once
Expected output
The count increases from 0 to 3
Explanation
Each update must receive the latest queued state.
Constraints
Use React stateDo not mutate stateAll controls must be keyboard accessible
Hints
Hint 1
Identify which actions depend on the latest queued state rather than the value captured by the event handler.
Hint 2
Use the state setter form that receives the pending value when one action schedules multiple updates.
Hint 3
Keep each increment as its own immutable transition so React can apply the full queue in order.
useStateeventsstate updates