From the course: Master React 19 and Next.js 16 with Hands-On Projects and Real-World Applications

Unlock this course with a free trial

Join today to access over 25,200 courses taught by industry experts.

Introduction

Introduction

From the course: Master React 19 and Next.js 16 with Hands-On Projects and Real-World Applications

Start my 1-month free trial Buy for my team

Introduction

“

In this session, you will learn React reducers. In order to do that, we will have a look at our To-Do List app and understand why we need a reducer and what a reducer is. So far in our app, we've been managing the tasks state with useState. That works great until your state logic gets more complex. Right now, we're doing a lot. Adding tasks, removing them, editing, toggling, and more. Each of these needs its own function that updates the state. All these setTasks calls are scattered throughout the app, and that makes our logic harder to maintain or reuse. This is where useReducer comes in. It gives us one place to manage all state changes, in a centralized and predictable way. So what is a reducer? A reducer is just a function. It takes two arguments, the current state, which is the list of tasks in our case, and an action, which is an object that describes what to do. The reducer looks at the action type, performs the right logic and returns the new state. Think of it like a smart…

Contents