Skip to content
hardsenior1 min read #frontend #redux

What are actions, reducers, and the store? ​

Answer ​

An action describes an event, a reducer returns the next state for that action, and the store holds state and notifies subscribers. Application code dispatches actions instead of mutating the store directly.

Context ​

Redux centralizes state transitions as explicit actions reduced into immutable state. Keep reducers pure, derive views with selectors, and isolate I/O in middleware or async workflows.

Example ​

js
const todosSlice = createSlice({
  name: "todos", initialState: [],
  reducers: { added: (state, action) => { state.push(action.payload) } }
})

Redux Toolkit uses Immer, so this reducer syntax produces an immutable update.

Practical considerations ​

  1. Choose the approach from the requirement and constraints, not from habit.
  2. Include validation, error handling, and cleanup where the boundary requires them.
  3. Verify the observable result with focused tests or measurement.

Follow-up prompts ​

  • What failure mode would you expect if this were implemented incorrectly?
  • How would you test this behaviour?
  • What changes when the feature must scale to a larger application or team?

In practice ​

For this hard-level topic, make assumptions explicit, choose the smallest safe implementation, and verify the behavior at the relevant boundary.