Introduction to Managing State in Stimulus Code

Managing state in Stimulus code

As we’ve been building our sample concert application in this course, we’ve spent a lot of time worrying about managing state. By managing state, I mean the set of values the front end needs in order to draw the correct information to the screen and properly manage user interaction. So far, our Stimulus page manages state by writing and reading values directly from the DOM, while our React page passes state variables up and down the component tree to ensure that all the components are working off of the same data.

As our front-end interactions become more complex, we need more complicated structures to handle access to the data. In this part of the course, I’m going to introduce a common JavaScript pattern for dealing with state called a reducer. First, we’ll explore the general pattern in our Stimulus page, then I’ll show you some core React hooks that ...