Original subtitles

We are dispatching an action here

and that action has a type of increment.

Typically when using Redux,

the goal is to do different things inside of the reducer

for different actions.

And that's why you get the action as a second argument here.

You get the current state and then the action

that was dispatched that caused this reducer to run.

And therefore in the reducer,

we can of course, look into this action.

We can check if the action.type

is equal to increment for example.

And if that's the case, then let's say,

I wanna return this increment that counter.

Otherwise, if a different action

like the default initialization action was dispatched,

I wanna return the unchanged state let's say,

and then we'll also change the value

we have in our state here

because now for the initialization,

we will not increment the counter

but return the unchanged default state.

And then for the increment action,

we will return the updated counter.

So with this little change made

if we execute this file again, we now have counter one here

because for the initialization, it's no longer incremented.

And that we can, of course, also dispatch other actions,

we could dispatch an action of type, decrement.

So with an identifier of detriment,

then we just need to add the appropriate code here.

If action.type equals decrement,

and then just return our new state object

where counter is set

to the state.counter minus one, like this.

If we do this and save doesn't run our file again,

we have counter one counter zero as outputs.

This first output is coming from our subscription

after the increment action

and then we change the state again

hence the subscription triggers again

and to therefore we now see counter zero

because we decrease the counter here.

That's how Redux works.

Now there is a bit more to it and more things you can do

but that is the heart of Redux and of how it works.

Obviously, we're not using it with React here

but that is how Redux works no matter how you use it.

And it indeed isn't a library restricted to React,

you can use Redux in any JavaScript project.

There even are implementations

for other programming languages as well.

But of course here we are going to use it with React though.

And therefore in the next lecture,

let's now explore how we would use Redux

in a React application.