Redux principles and data flow

Model answer. Redux is a library for predictable global state. Three principles:

1. Single source of truth: the whole app's shared state lives in one store object.
2. State is read-only: the only way to change it is to dispatch an action, a plain object describing what happened ({ type: 'cart/itemAdded', payload: item }).
3. Changes are made by pure reducers: (state, action) => newState, without mutating the old state.

Data flow (one-way):

UI event → dispatch(action) → [middleware] → reducer(s) compute new state → store saves it
        → subscribed components whose selected data changed re-render

With Redux Toolkit (the recommended way today):

const cartSlice = createSlice({
  name: 'cart',
  initialState: { items: [] },
  reducers: { itemAdded(state, action) { state.items.push(action.payload); } },   // Immer makes this immutable
});
// in a component
const count = useSelector(s => s.cart.items.length);
const dispatch = useDispatch();
dispatch(cartSlice.actions.itemAdded(product));

Worth adding when much state is shared across distant parts of the app, updates are complex, or you want time-travel debugging and a strict pattern for a large team. For small apps, local state plus context is enough, and server data (fetching and caching) is usually better handled by a library like RTK Query or TanStack Query.