Creating Actions

Learn about creating functions that create all the actions in our store.

Actions initiate changes to our store state. In this section, we are going to create functions that create all the actions in our store. We will start by understanding all the actions that will be required in our store.

Understanding the actions in the store

The three processes that will interact with the store are as follows:

  • Fetching and rendering the unanswered questions on the home page

  • Fetching and rendering the question being viewed on the question page

  • Searching questions and showing the matches on the search page

Each process comprises the following steps:

  1. When the process starts, the store’s loading state is set to true.

  2. The request to the server is then made.

  3. When the response from the server is received, the data is put into the appropriate place in the store’s state and loading is set to false.

Each process has two state changes. This means that each process requires two actions:

  1. An action representing the start of the process

  2. An action representing the end of the process, which will contain the data from the server request

So, our store will have six actions in total.

Getting unanswered questions

We are going to create the actions in Store.ts. Let’s create the two actions for the process that gets unanswered questions. Perform the following steps:

  1. Let’s start by creating a constant to hold the action type for our first action, which is indicating that unanswered questions are being fetched from the server:

Get hands-on with 1200+ tech skills courses.