useReducer

🔍 What is useReducer?

useReducer is a React Hook used to manage complex or structured state logic. It’s inspired by Redux but built into React — no external library required.

Think of it as a more organized, scalable version of useState when you're dealing with multiple related state values or action types.

---

🧠 When to Use useReducer

Situation	Use useReducer?
State has multiple sub-values	✅ Yes
Many types of updates needed	✅ Yes
Complex state update logic	✅ Yes
Simple field or counter	❌ Use useState instead

---

📦 Syntax

• state: Current value
• dispatch(action): Function to send an action
• reducerFunction: Logic that handles actions
• initialState: Default state value

---

✅ Example: Counter Using useReducer

---

🧠 Logic Breakdown

• Initial state: { count: 0 }
• Clicking a button dispatches an action (e.g. { type: "INCREMENT" })
• Reducer returns new state
• React re-renders the UI

---

✅ Example: Form with Multiple Fields

---

⚠️ Best Practices

✅ Do	❌ Don’t
Keep reducer pure (no side effects)	Don't call APIs or fetch inside reducer
Use action.type + optional payload	Avoid deeply nested reducer logic
Group related state together	Don't use for overly simple states
Combine with useContext for global use	Don’t repeat reducers in every component

---

🧩 Real-Life Use Cases

Use Case	Why useReducer Works Well
Forms with many fields	One centralized logic for updates
Complex toggles	Combine into one reducer
Game state	Manage scores, levels, status
App-wide global state	Pair with useContext for sharing

---

🧪 Bonus: Action Shape

• type: describes the action
• payload: data needed to update the state

---

📌 Summary Table

Feature	Description
useReducer()	Hook to manage complex or structured state
reducer()	Pure function to update state based on action type
dispatch()	Function to send action and update state
initialState	The default state object or value
Benefit	Clean, scalable, and testable logic

👉 Great next step: Learn how to combine useReducer with useContext for a full app-level state manager.