What is the Flux pattern?

React

The short answer

Flux is a pattern for managing data flow in an application. It enforces a strict one-way data flow: Actions describe what happened, the Dispatcher sends actions to Stores, Stores update state and notify Views, and Views render the UI. Redux, Zustand, and other state management libraries are inspired by Flux.

The four parts

1. Actions — plain objects that describe what happened:

const action = {
  type: 'ADD_TODO',
  payload: { text: 'Buy milk' },
};

2. Dispatcher — a central hub that receives actions and sends them to all stores. Every action goes through the dispatcher.

3. Stores — hold the application state and logic. When a store receives an action from the dispatcher, it updates its state and emits a change event.

4. Views — React components that listen to stores and re-render when the data changes.

The flow

User clicks button
    → View creates an Action
    → Dispatcher sends Action to all Stores
    → Store updates its state
    → Store emits change event
    → View re-renders with new data

Data always flows in one direction. Views never update stores directly — they always go through actions.

Why Flux was created

Before Flux, Facebook had problems with their notification system. Data flowed in multiple directions — models updated views, views updated models, models updated other models. This made it very hard to track where a bug came from.

Flux solved this by forcing one-way data flow. When something goes wrong, you trace the action that caused it, find which store handled it, and see how the state changed. The predictability made debugging much easier.

Flux vs Redux

Redux simplified Flux:

FluxRedux
Multiple storesSingle store
Dispatcher is explicitDispatcher is built-in (dispatch function)
Stores are classesReducers are pure functions
Mutable state updatesImmutable state updates

Redux took the core ideas of Flux (one-way flow, actions, stores) and made them simpler and more predictable.

Interview Tip

Most interviewers do not expect you to know the exact Flux API — it is mostly historical. Focus on the concept: one-way data flow with actions, a central dispatcher, stores, and views. Then connect it to Redux (which most developers have used). Saying "Redux is a simplified version of Flux" shows you understand the lineage.

Why interviewers ask this

Flux is the foundation of modern state management in React. Interviewers ask about it to see if you understand why libraries like Redux exist and what problem they solve. Understanding the one-way data flow pattern helps you make better decisions about state management in your own applications.

Table of Contents