Redux Fundamentals (feat. React)

Connecting Increment & Decrement

Steve Kinney

Steve Kinney

Redux Fundamentals (feat. React)

Check out a free preview of the full Redux Fundamentals (feat. React) course

The "Connecting Increment & Decrement" Lesson is part of the full, Redux Fundamentals (feat. React) course featured in this preview video. Here's what you'd learn in this lesson:

Steve walks through connecting the increment and decrement buttons to the Redux store and discusses various situations where Redux store may not be necessary.


Transcript from the "Connecting Increment & Decrement" Lesson

>> So it's pretty straightforward right? Just get a little bit of muscle memory on this, we have our different action creators. We are dispatching each of them. Could we bind all the action creators we can take a look at some of those things. Let's get it in place we can say unclick.

And here we're just gonna dispatch Increment And gotta make sure we import it. And here we'll dispatch decrement. And let's go make sure that all works because we get too far ahead of ourselves. Increment, we can decrement. And again, you can kinda see everything. You can jump to any previous state as well in the tools.

And we can reset it, [INAUDIBLE] stuck in one place now, but I can move down here as well. And then command and decrement. Okay, so we've gotta wire it up. This is, again, we've got a kinda core piece of this. This does not mean that everything has to go into Redux state.

One of the ways I like to think about it is we use the word state as a very broad term, right? There is the state the things you're getting back from the API okay. If you're managing a context database or to dues list or something like that. There's dos, and stuff along those lines.

As I think about that is what I call model state. Then you have things like, is that accordion open or close, right? What is currently in that form? Do those need to go into Redux? What do you think? Thumbs up or thumbs down? Should I put those things in?

I see a thumbs down. All right, generally speaking is thumbs down. I see just indecisive thumb, right? I saw a sideways,Oh, now it moved down. I think it went with the wisdom of the crowds in that case. Generally speaking, I think that is a femoral state, right? A lot of times you can still use component state for those kinds of states.

You don't have to listen team, we use Redux now, everything has to go into Redux. I think all of the kind of business logic state, you probably wanna put in Redux, but that kind of view layer state. Is this open or close? Is it expanded or not? Whats the draft field in that form, right?

Those kind of things can actually stay in component state. The rest of your application, doesn't necessarily need to know anything about what's going on there. Now when they submit that form, we might dispatch an action and store the result in state. Right, that might change some things. But as they're actually just typing or anything along those lines.

You don't necessarily need to run through this entire process, that can stay inside of the component.

Learn Straight from the Experts Who Shape the Modern Web

  • In-depth Courses
  • Industry Leading Experts
  • Learning Paths
  • Live Interactive Workshops
Get Unlimited Access Now