Sikau

Advanced JavaScript · Day 27 · about 40 min

Capstone: A tiny state store

Reducers, subscribers and undo — like Redux.

Put it all together

Big apps keep their data in a store: one place holding the state, changed only by actions, telling anyone interested when it changes. You'll build one in about 25 lines, using closures, pure reducers, Sets and immutability — with undo for free.

The shape

const store = createStore(reducer, initialState);

const stop = store.subscribe((state) => render(state));
store.dispatch({ type: "add", item: "momo" });
store.getState();
store.undo();
stop();

The rest of this lesson

  • How a store fits togetherexplain
  • Why big apps do thisexplain
  • Inside dispatchorder
  • Course skill → store partmatch
  • Build createStorechallenge
  • Badge quizquiz
  • Advanced JavaScript complete!recap

Continue this lesson free — run real code in your browser

Continue with Google

See all 27 lessons of Advanced JavaScript