Join egghead, unlock knowledge.

Want more egghead?

This lesson is for members. Join us? Get access to all 3,000+ tutorials + a community with expert developers around the world.

Unlock This Lesson
Become a member
to unlock all features

Level Up!

Access all courses & lessons on egghead today and lock-in your price for life.


    Dispatch Action Types to Reducers

    John LindquistJohn Lindquist
    2 - 6
    5 - 6

    A reducer needs to know what you want it to do whenever it's called. You do this by passing along an action type then the reducer can switch based on the type to achieve the logic you need. This lesson covers dispatching action types to your reducer to update the state based on that type.



    Become a Member to view code

    You must be a Member to view code

    Access all courses and lessons, track your progress, gain confidence and expertise.

    Become a Member
    and unlock code for this lesson




    Currently the way this is set up is you have these magic strings, hour and second, which end up here in Hour and Second. What we want to do is extract those so that they're assigned to constants that you can import.

    We'll start in our reducers. You could actually put these anywhere, but for now since they're closely related to our reducers I'll move them here. I'll say const hour is...all upper-case HOUR, just as a convention, and const second is all upper-case SECOND. We need to export both of those so that we can export them into our app file.

    Then instead of second here, we're going to say second. Just say hour. Then switch over to our app file. We're going to go ahead and import from the reducers. The second and hour. Now we can just use those in here as well. We'll take hour, second. Now when I save and hit Refresh, you can see everything works the same. It's incrementing by seconds and then when I click it's incrementing the hours.