Redux is widely accepted state management library for large scale React Projects. Because of its, predictable nature and widely support ecosystem. Redux is best way for making central store in React Applications and Another advantage is easily tracking what, where and when change the state of store.
Redux Application is comprises of
-Actions
-Central State i.e Store
-Reducers
Tracing Actions
With React Dev Tools we can trace the code that has triggered action. It could event based on mouse or keyboard or a lifecycle method that dispatches the action.
In the large scale applications where simultaneously event occur it become difficult to track who invoke the particular action and what payload is sent to reducer.
Custom Dispatch
React Dev Tools allow to send actions without any code and this will be considered as same as making call via Redux API. This could be helpful in making mock API calls. And sending type and payload with that dispatcher button, it would be helpful in debugging state of central store and reducer as well.
Action Tab
Action Tab is used for viewing the payload and type of action that has been dispatch either from UI or from Inspector section where all the list is there of actions that has been dispatched.
Inspector Section
Here, we can check for all the actions that has been dispatched from the Application or from dispatcher button and what was previous state before dispatching that action and after dispatching this could also be checked.
Slider
……
Slider helps in travelling through all the actions that has been occur and their relevant state value.
State Tab
State tab is used to view the all the properties of stories and with their respective values. It comprises of 3 views Tree, Raw and Chart. The mostly commonly view Tree View where the state is viewed in Object like structure and nested object can be viewed in an object like structure. Chart view is also most widely used where there is a need to check the deep level nested object this view helps in examining whole of the store
