O'Reilly logo

Progressive Web Apps with React by Scott Domes

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Creating a message

As in our LoginContainer, we need to store the value of our textarea in state as it changes.

We used the state of the LoginContainer to store that value. Let's do the same with ChatContainer.

You may be wondering, after the preceding discussion: why don't we just keep all our state in App? Some will argue for that approach, to keep everything in one place; however, this will bloat our App component and require us to pass multiple props between components. It's better to keep state as high as necessary, and no higher; the new message in the chat input will only be relevant to App when it's done and submitted, not before that.

Let's get that set up.

Add this to the ChatContainer.js:

state = { newMessage: '' };

Also, add a ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required