Command Palette

Search for a command to run...

Hectal
Phase 14: TypeScript with React
TypeScript · Exercise 2 of 6 PreviousNext
Intermediate

A counter reducer with typed actions

Make Action a discriminated union with four members: increment, decrement, reset and add, where only add carries an amount: number. Then write the reducer with a switch and finish it with default: return assertNever(action);.

The checks use the ids #inc (+1), #dec (-1), #add (+10), #reset and #count. The buttons are already in the starter; add the #dec button yourself.

What Check tests

  1. Your code has no type errors
  2. An unknown action type is rejected
  3. An add action without an amount is rejected
  4. A valid add action is accepted
  5. The reducer ends with assertNever(action)
  6. The buttons change #count: +1, +10, -1, then reset

Stuck? One hint at a time

The solution unlocks after your first Check. Try first: that is where the learning happens.

Runs in your browser. Your code is saved here.

Your page

Press Run to see the page.

Console

Nothing logged yet.