And before we recap how you use reducer works I would want to set up my actions as variables and you're
probably wondering well what's the use for that.
Well let's take a look at the example where I am adding to a cart but since it is a string it is very
easy for me to mess up.
I could say Add To Cart number is going to add the extra t..
Now what happens right now within the reducer.
What type I'm looking for.
Well I believe the type that I was looking for was had to cart correct but within the cart.
In fact I'm passing in the action with a type of add to cart with duties.
Now what do you think is my functionality going to work or not.
So I'm going to go to details.
I'm gonna try to add it to the cart and notice how I navigate there but I haven't added the item and
I can clearly see that.
Now just to test it out let's go with this guy.
Let's try to add it to the cart and the item is not there.
Now what the item is not there because the times do not match.
So we have one type within the cart context and then within a reducer we're looking for completely different
string and in order to avoid this type of bug.
The common convention is setting up our actions as variables and the way it's gonna work.
We're going to have our actions j ust file and again the reason why I would want to set this up in a
separate file because you technically could set everything up here but you're gonna have to export it
and imported within the juicer anyway.
And also the same how we could set up producer within our cart context while just going to populate
Of course this file and that's going to be harder for you to manage.
That's the reason why again common convention is setting up your actions and your action type in a separate
file.
So I'm gonna go with export and then we're gonna go with all the actions that we have.
So we have one for remove and the variables we set equal to a string.
So we go here with the remote.
And in this case if let's say within the cart I'm going to import it some goat import and then of course
I'm looking for my actions file and from the actions I'm looking for a more variable from and then it's
coming from actions.
So in this case if let's say I access the wrong variable if I say not remove but I don't know removes
you can see right away that JavaScript or react is going to complain or it's gonna say well you don't
have this variable.
So what are you trying to access.
So instead this way we can always check whether we are getting the proper one.
And of course in this case it says import I think I messed it up a bit where import remove should be
on top.
And once I do that everything works like I said the same thing we're gonna have to do within reducer.
So we have our juicer function then we're gonna copy and paste and instead of using the string we're
going to use our remove variable again that variable is gonna hold the same string but is easier to
fix it if it is in one place.
And now I'm just gonna copy and paste all the actions that we have.
We have increased decrease we have add to cart and clear cart.
So we're gonna go with increase increase that is of course gonna be equal to our string increase and
then we have decrease.
So maybe I'm gonna go to variables here meaning two cursors we're gonna go with decrease the crease.
Now I messed up here a bit bear with me and of course I had it in the wrong place.
So let me add here destroying then and we're gonna have add to cart.
So again let me select two cursors let me remove and I'm gonna go add and then underscore to guard again
this is just a preference you can definitely write it as one name.
And then lastly we also have same for Clear card.
So let me use two cursors Let's delete it and let's go with Clear card and now of course within the
reducer as well as the card we need to import them.
So the same how we access remove we need to have the increase and not increase sir.
Sorry it's not an increase certs increase and then also we have decrease then add to cart.
And lastly we also have declare card Clear card and then I'm gonna change all my string values to my
variables one by one we're going to go with increase design we're going to go with decrease of course
add to cart and Clear card and cars.
And then lastly we have clear cars and the same thing we need to do right now within the car.
So instead of just getting the remove I'm going to copy and paste since both of them are sitting within
the same file.
I'm sorry same folder and I'm just gonna speed things up a bit.
We're going to copy and paste and then again we're looking for instead of increase we're looking for
a variable increase variable then the same is gonna work for remove.
And you already get the point then we have decrease.
And lastly again we have increase.
And then add to cart.
So we increase and then add cart add to cart and then somewhere in the bottom we have clear cart.
So we're going to go with clear cart.
I think I'm going to delete the actual old functionality just so it doesn't take up space and the next
video again we're going to repeat why and how we used user juicer.