In the last section we finished up all of our different reducers So we now have three action creators
and three reducers something that's really important to note at this point in time is that we have not
made a single reference to the redux library whatsoever.
So the vast amount of code that we're going to write with redox is going to be just normal code normal
functions normal arrays and objects that you and I write only at very small very specific points in
time are we going to even think about referencing the redux library directly now that we've put all
of our action creators and reducers together.
We're going to wire them all together into a single object called a store a store in redux is essentially
the assembly of a collection of different reducers and action creators.
So at the bottom of this file I'm going to take the redux library remember that we already added redux
into this code penned project a little bit ago.
So if you do a console log of redux you'll see that we've got the redux library right here.
We're going to pull off two specific functions from the library called create store and combine reducers
and that's going to come from redux.
So now to wire together all of our reducers we're going to use this combined reducers function.
I'll tell you exactly what that thing is doing in just a minute.
So I'm going to say Konst or deps So this is essentially the combination of all of our different departments
or all of our different reducers put together and that's going to be the result of calling combined
reducers and passing in an object with a couple of different key value properties to this object we're
going to pass in each of our different reducers.
So I'm going to say accounting is accounting claims history is claims whoops is claims history and our
policies is our policies.
Now each of these variables right here are the names of our different reducers that we just put together.
So there's policies accounting and claims history now that we've combined all of our producers together.
We're going to use the other function from redux called create store.
So underneath that I'll say Khan's story is create store and I'll pass in our department's.
And now we have this magical store object.
The store object represents our entire redux application.
It contains references to all of our different reducers and to all of our state produced by those reducers
are all the data produced by those producers as well.
The store object has a couple of different functions on it that are going to be very useful for what
we're trying to do.
One of the functions on here is the dispatch function this dispatch function right here is just like
that original form receiver that we had spoken about.
So we want to pass the dispatch function an action when we sent send it in action which is just like
our form.
The Dispatch is going to make a copy of it and then send it off to each of the different producers inside
our application.
Just as in the analogy we had said that the form must pass to a former receiver in the form receiver
put it on a copier and then passed copies of that form to each of the different departments.
So in order to call dispatch we first have to pass in an action that is created by an action creator.
So let's first create an action by calling an action creator and then we can pass the action off to
dispatch.
All right so before stored dispatch I'm going to say Konst action is let's try to create a policy I'll
say create policy.
And remember any time that we called it create policy action creator right here we have to pass in a
name and an amount to pay to the company to get a policy.
So as the first argument I'll pass in a name of Alex and an amount of money of 20.
So if I wanted to I could do a console log of action and I should see the action object.
There it is right there I've got my type and my payload.
So I'm going to take that action and pass it to store dispatch.
And now it looks like nothing at all happened.
But you can actually use another method on the store object to get a better idea of how we just changed
all the data inside of our application.
Remember when we take storm dispatch and pass that the action that action will be forwarded off to each
producer.
And so as soon as we called sort of dispatch each of our different reduce or functions or departments
He essentially ran and process that action or that form.
So now if I do a store get States get state is a function that's going to essentially get our entire
assembled repository of data for our company just as we said we before we're going to have this kind
of a central repository.
So the Kogut state we get access to that big gigantic glob of information
now I need to make sure they actually do a console log because that is just a plain object.
That's better.
All right so after it runs we're going to see the state of our application printout.
So you'll see that we've got here of accounting.
So that's how much money we have in our company.
And then we've got policies which is the array that has the name of everyone who has signed up for a
policy with our company.
That's pretty much it.
So now we can call all of her different action creators past the action that gets returned to store
dispatch and that's going to incrementally modify exactly how the state of our company looks.
That is all contained inside of the store.
Let's try doing a couple of quick examples here.
I'm going to refactor this store of dispatch and instead just pass the result of Culin create policy
directly to it.
So I got to put create policy in here and I'll enter in Alex and 20 and now I do not need to create
the action ahead of time.
OK.
So that's going to create a new policy for Alex.
I'll now try to create a new policy for Jim and let's say Jim has to pay $30 and maybe how about I don't
know.
Well say Bob has to pay $40.
So we've now created three policies and we've paid in a total of 20 30 and 40 to our company.
So 20 plus 30 plus 40 plus the default of 100 that our company initially had is 190.
So we see the results over here we have a counting of 190 and then we have policies created for Alex
Jim and Bob.
Now if we wanted to we could have one of our different people tried to create a claim so I could say
Stuart dispatch create claim and we'll say that Alex wants to create a claim for about $120.
So now when we do our get States we'll see that we've now deducted $120 smart company.
So we're now down to $70.
Alex still has a policy as he did before and now we can see that we also have a claim history object
here to reflect the fact that Alex just tried to withdraw a hundred dollars.
The number is right there are $120 excuse me and the name of the person who withdrew that was Alex.
So we can say that maybe Jim gets in a accidence well so it could do a story about dispatch create claim
for Jim and maybe Jim Saxton it wasn't so bad.
So he only needs about $50.
And so now we'll know.
So we have $50 less than we had before and we now have two different claims inside there.
And then finally let's test out the last action we'll do our last action creator which was policy
so I'll do a delete policy and pass in Bob because Bob realized he never made a claim and he doesn't
really need any insurance at all.
And so now when we see the results of our console log we see that only Alex and Jim now have a policy
and we still have all the same claim history and accounting stuff that we had before.
OK.
So that's it.
That is redux in action.
Now let's take a pause right here.
When we come back the next video I'm going to point out some very distinct things that I want you to
notice about the code that we just wrote right here and this is going to help you understand why we
use redux inside reactor application and why it's so widely used in industry.
So quick pause and I'll see you in just a minute.