What is the Flux pattern?

Flux is an architecture Facebook published in 2014 for keeping application state predictable: data moves in one direction through four stages, and nothing writes to the store directly.

Action  ->  Dispatcher  ->  Store  ->  View
  ^                                      |
  +--------------------------------------+
            (a user event creates a new action)

• Action — a plain object describing what happened: { type: 'ADD_TODO', text }.
• Dispatcher — a single hub every action passes through.
• Store — holds the state and the logic for updating it. Only the store may change its own data.
• View — reads from the store and renders. It cannot write.

The problem it was invented for

Facebook's unread-message counter kept going wrong, because many components could mutate shared state and there was no way to tell which one had. Flux makes every change pass through one choke point, so state can only move by a named, logged action, and the update order is deterministic.

What you get from it

• Traceability. Every change has a name and an origin. A log of actions is a complete history of how the app reached its current state.
• Time-travel debugging. Replay the actions and you reproduce the bug exactly. This is what Redux DevTools does.
• Testable logic. A reducer is (state, action) => state — a pure function you test with no UI and no mocks.
• Scale. New features add actions and reducers rather than new paths that can mutate old state.

The cost

Boilerplate. Changing one boolean can mean an action type, an action creator, a reducer case, and a selector. That reputation is why the pattern fell out of fashion, and why Redux Toolkit exists — it collapses most of that into one createSlice call.

Flux versus Redux

Redux is the best-known implementation and it simplified the original: one store instead of several, the dispatcher folded into that store, and reducers as pure functions instead of stores with their own update methods.

Where the pattern lives now

You still use Flux thinking constantly, often without the name:

const [state, dispatch] = useReducer(reducer, initial);
dispatch({ type: 'increment' });   // action -> reducer -> state -> view

useReducer is Flux for one component. Zustand and Redux Toolkit are Flux for an app. And the reason to know the pattern is not to build it from scratch — it is that "state changes only through named actions, in one direction" is the idea underneath almost every state tool you will pick up.