Passing props through many layers ("prop drilling") gets painful. Context (built-in) and Redux Toolkit share state app-wide.
Context (simple, built-in)
const CartContext = createContext();
function CartProvider({ children }) {
const [items, setItems] = useState([]);
const add = (i) => setItems(prev => [...prev, i]);
return <CartContext.Provider value={{ items, add }}>{children}</CartContext.Provider>;
}
// anywhere: const { items, add } = useContext(CartContext);Redux Toolkit (large apps)
Redux Toolkit centralises state in a store with slices and reducers — great for big apps with complex shared state.
Tip: Start with Context for simple global state; adopt Redux Toolkit (or Zustand) when state grows complex.
Summary
Context shares state without prop-drilling for simple cases; Redux Toolkit/Zustand scale to larger, complex apps.