Redux was used because the drilingwas very inconvenient.
was implemented to reduce the duplication of OOO_REQUEST, OOO_SUCCESS, ... in transport in Redux.
Redux is a state management tool. This is because the motivation to use is inconvenient when the driling.
When you need user infomation in Root component and CompN-M component, if you don't use Redux, you have to pass user information from Root to CompN-M.
However, if you sue Redux, you don't need that. You just use the state stored in the store by connecting it to CompN-M.
For the above reasons, I came to use Redux and summarized the problems I encountered and how to solve them.
When creating Action and Reducer, It's annoying to type one more letter.
When I first created, , they were as follows.
The number of lines of code has been greatly reduced. The example is applied to only one action and reducer, but there may be many actions and reducers in the actual application. If you want to be comfortable, we recommend using redux-actions.
Is there any asynchronous processing library that is more convenient than the Redux Thunk?
The features in Redux Saga I mainly use are as follows:
A function that performs the action called last.
I always hate appending __REQUEST, __SUCCESS, ... to action type when get data to backend.
Basically The order when communication from frontend to backend as follows:
Start animation about loading.
Send a request to backend.
Receive a response from backend.
Stop animation about loading.
Print message about a result(success, failure)
The Action is divided based on the above order.
If implemented in code, it is as follows.
If the REMOVE_USER action is added, SUCCESS will be diffrenet, and the rest will be the same. In other words, OOO_COMPLETE, OOO_REQUEST and OOO_FAILURE are likely to overlap in almost all logic that communicates with the backend.
Create action types of REQUEST, SUCCESS, FAILURE, COMPLETE.
Create basic reducers about action types.
Create and call a logic about REQUEST, SUCCESS, FAILURE, COMPLETE when communicates with the backend in saga.
The code to whichis applied is as follows.
Compared to the previous code, the amount of code has decreased considerably.
If you are creating a react application, try using Redux.
And I think that it is better to reduce duplicate code because side effects always occur. You might think, "Should I deduplicate this code?" But you reduce a lot of duplicate code, you naturally feel that your coding skill is improving, so I think I should aim to reduce duplicate code.