The Message Component

Just as with all our previous components, we'll first implement the initial set up for the Message component. Make an action, create a reducer to facilitate the action, and check if the message field show up in the Log.

We'll cover the following

We’ve had to build more difficult components.

This one won’t be difficult to build. However, there’s one point to consider.

The Input component will be a controlled component.

Therefore we will be storing the input value in the application state object.

For this, we’ll need a new field called typing in the state object.

Let’s get that in there.

For our considerations, whenever a user types, we will dispatch a SET_TYPING_VALUE action type. Be to sure add this constant in the constants/action-types.js file.

export const SET_TYPING_VALUE = "SET_TYPING_VALUE";

Also, the shape of the dispatched action will look like this:

Get hands-on with 1400+ tech skills courses.