====== State Management with Redux ======

Redux helps manage state in larger applications.

<code>
npm install redux react-redux @reduxjs/toolkit
</code>

Example Redux setup:

<code>
import { createSlice, configureStore } from '@reduxjs/toolkit';
import { Provider, useDispatch, useSelector } from 'react-redux';

const counterSlice = createSlice({
  name: 'counter',
  initialState: { value: 0 },
  reducers: {
    increment: (state) => { state.value += 1; },
  },
});
const store = configureStore({ reducer: { counter: counterSlice.reducer } });

function Counter() {
  const dispatch = useDispatch();
  const count = useSelector(state => state.counter.value);
  return (
    <div>
      <p>{count}</p>
      <button onClick={() => dispatch(counterSlice.actions.increment())}>Increment</button>
    </div>
  );
}
export default function App() {
  return (
    <Provider store={store}>
      <Counter />
    </Provider>
  );
}
</code>