Creating our first reducer

As we saw in Chapter 1, Why Redux? An Introduction to Redux Architecture, in the How does Redux work? section, our logic must be introduced inside a reducer function. Let's identify exactly what the main objective of our application is so we can come up with actions that suit those objectives – we need our application to do the following:

• Add a task.
• Remove a to-do task.
• Toggle tasks to show as completed.
• Clear completed tasks.

We will look at each of these points in detail now.

Adding a task

Adding a task to our store means pushing a new task to our todos array. This is important so that we know what code we must introduce inside our reducer.

Firstly, we can agree on the schema that will contain our tasks. This definition will be used throughout the application, so remember that our tasks will always include an ID, a title, and a completed check:

{
  "id": id,
  "title...