5 Reducer+ActionCreator
Hi guys, glad to see you again. Today we gonna talk about Reducer. I`m sorry, last time I told you that we would be covering Redux8, but let’s change our plan because it is much easier to begin with reducers. Let’s go.
At first, we are creating a folder for our reducer… We are creating file, without mark up.
Reducer is function, and it gets 2 parameters: action and state. I`m typing initial state and assigning type from API over our function. Ok.
You may ask me a question. What is Action? Action-is the key for cases from our function. And I`m creating switch case inside of function. Our switch case should have action.type. We should understand that action is an object with the ‘type : XXX’ property. It is easy. So many requests, so many cases. For example: if we have get and post requests in API, then we should create two cases. Now, I`m typing one case “XXX” just for fun. Let’s finalize switch, I`m typing default. Ok
Now it`s Action time. But we need to talk about action Creator. Let`s go…
Our function returns object. This object – is action, I want to say, that our function returns action. We need property ‘type’-it`s the key for our door in CASE –look here – the name of our door is “XXX” –and the name of our type is “XXX”. And now we have approached the most misused place in action – if you don’t want to find yourself in an ugly situation, you must use as const.
Ok. Our step number two. Let’s assign type for action creator. We will assign type automatically…Return type assigns type for all our function, but we the type just for the object. And the second command will help us:
This command is ‘type of’.
Now I want to draw your attention to as const. Why we should use it? Because “XXX”, the value of our type should be treated as constant, not as string. Without “as const”, all our keys will be strings, but we need to have different keys.
In future we will have many cases, and many types for actions- we should create a case, the pocket for our types. I`m creating this general type and pasting it in our reducer.
Congratulations! We did it, but unfortunately, we can`t see the result of our work yet. Finally, we should push our project to GitHub, and check how it works in Heroku.
Ok.
You can see my code in GitHub under this video. Subscribe to my channel and invite all your friends. Next time we will covered Redux 8 and create store for our Aplication. Keep in mind, that the man who couldn’t be a programmer has not been born yet
link on gitHub:https://github.com/developeryudintsev...
00:00 hi guys
00:25 reducer
03:40 switch
05:35 ActionCreater
07:25 automatic type
09:55 push our project
11:30 buy gus
08:15 we are pushing our project in GitHub and Hroku
09:59 buy guys
On this page of the site you can watch the video online 5 Reducer+ActionCreator with a duration of hours minute second in good quality, which was uploaded by the user It-Patsan-US 06 July 2022, share the link with friends and acquaintances, this video has already been watched 232 times on youtube and it was liked by 14 viewers. Enjoy your viewing!
