We have already defined the action creator functions earlier, in src/App.js. We can now copy them from our App component, making sure that we adjust the type property in order to use the action type constants, instead of a static string.

Let's define the synchronous action creators now:

1. Create a new src/actions.js file.
2. Import all action types, which we are going to need to create our actions:

import {
    ADD_TODO, TOGGLE_TODO, REMOVE_TODO, FILTER_TODOS
} from './actionTypes'

3. Now, we can define and export our action creator functions:

export function addTodo (title) {
    return { type: ADD_TODO, title }
}

export function toggleTodo (id) {
    return { type: TOGGLE_TODO, id }
}

export function removeTodo (id) {
    return { type: REMOVE_TODO, id }
}

export function filterTodos (filter) {
    return { type: FILTER_TODOS, filter }
}

As we can see, synchronous action creators simply create and return action objects.