Action Creators, Payload, and the Subscribe Pattern

Hands-on practice for this lecture. Write the code, see it run, understand the pattern.

1

Exercise 1 of 2

Fix the Silent Typo

Deposit $100 — balance never changes, no error. There is a typo in the action creator type string. Find it, introduce constants, and fix the silent bug.

Task

Click Deposit $100. The balance does not change. No error in the console either — the action dispatches silently and hits the default case.

Open App.js, find the typo in the action creator, then fix it using constants so the same string is shared between the creator and the reducer.

  1. Spot the typo in deposit()
  2. Define const DEPOSIT = 'DEPOSIT' and const WITHDRAW = 'WITHDRAW'
  3. Use the constants in both action creators and reducer case labels
Loading editor…
2

Exercise 2 of 2

Build Action Creators — Quiz Score Tracker

Live editor: write action type constants, action creator functions, and a subscribe callback for a quiz score tracker. Three steps, one working Redux app.

Task — three steps

  1. Define ANSWER_CORRECT and ANSWER_WRONG as action type constants
  2. Write answerCorrect(points) and answerWrong(points) action creators
  3. Call store.subscribe() before the dispatches to log the score after each change

The dispatches below use your action creators. The UI should show score=25, correct=2, wrong=1.

Loading editor…
Re-read the lectureAll lectures →
Practice: Action Creators, Payload, and the Subscribe Pattern — Interactive Exercises | Durgesh Rai