\n<\/strong>
\nAn action is a plain javaScript object with one mandatory field called ‘type’ with the provision of another fields, whenever we need to change or modify state in the store, need to dispatch an action<\/p>\n
![\"\"](\"https:\/\/www.innovationm.com\/blog\/wp-content\/uploads\/2018\/12\/Screenshot-2018-12-21-at-12.03.39-PM-300x24.png\")
<\/p>\n
Reducer:<\/strong><\/p>\n Reducer is nothing but just a pure function.which\u00a0produces state out of action and whatever reducer returns will become state of the application.<\/p>\n Pure Function is a function which doesn’t allow mutation of the data which is passed as the argument and if any modification is done it always returns new data in place of modifying the existing data, there should not any API Calls or any method calls, just a pure javaScript object that takes input as an argument and return something.<\/p>\n Reducer called with two argument , first is current state and second is action, that dispatched before, now reducer will filter out action and produce some amount of data as a state.and that state is going to persist in the store ,in this example if the user tries to login ,dispatching and action , and that action go though all the different reducer and persist state or saving the credential to the store.<\/p>\n Store: so basically redux is all about managing state , all we need to do is dispatching an action , it goes all the different\u00a0 reducer , reducer produce some amount of data as state in store<\/p>\n","protected":false},"excerpt":{"rendered":" Redux is a library which is use to maintain state of the application at application level , it reduces complexity of managing different states of the components when app is getting comparatively larger , it provides the privilege to maintain state of different components efficiently. Redux works on three basic principles 1) \u201cSingle source of […]<\/p>\n","protected":false},"author":1,"featured_media":5136,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[71,257,258],"tags":[323,247,322,321,319],"class_list":["post-5133","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-mobile","category-react","category-web-technology","tag-action","tag-react","tag-reducer","tag-redux","tag-state"],"yoast_head":"\n![\"\"](\"https:\/\/www.innovationm.com\/blog\/wp-content\/uploads\/2018\/12\/Screenshot-2018-12-21-at-12.01.58-PM-300x58.png\")
<\/p>\n![\"\"](\"https:\/\/www.innovationm.com\/blog\/wp-content\/uploads\/2018\/12\/redux3-300x167.png\")
<\/p>\n
\n<\/strong>
\nStore holds application, we can think it as an object tree, store allows to access the state via getState() and gives us current state of the application method and also allow change within the store by dispatch() method.
\nRedux library gives a method createStore() which takes reducer as a argument\u00a0by which state of the store is going to be changed.<\/p>\n![\"\"](\"https:\/\/www.innovationm.com\/blog\/wp-content\/uploads\/2018\/12\/Screenshot-2018-12-21-at-12.04.24-PM-300x19.png\")
<\/p>\n![\"\"](\"https:\/\/www.innovationm.com\/blog\/wp-content\/uploads\/2018\/12\/redux2-300x167.png\")
<\/p>\n