Getting started with Redux

Redux is yet another framework for React web Apps. Today’s web applications are getting more into single page applications which requires lot of states to be known by the app like the cache data, local data, which tab to open, what content should be put in which tab etc.,  if we fail to know clearly about the states we are using in the app then it becomes difficult to find the error in case of bug. In order to facilitate this we use Redux which provides a nice way of dealing with states. Also Flux, is another framework which does this.

I have made a codepen to get started with Redux. In this code pen you can find a counter made with Redux.

Redux provides a method createStore which has three functions getState(), dispatch(), subscribe().

getState()

The getState function will return the current state of the app

dispatch()

By this function we can call the action to be dispatched. In this example I call dispatch({type:’INCREMENT’}) , because the action that I need to perform is INCREMENT.

subscribe()

The subscribe method will keep listening to the state change and if the state changes then the method in subscribe will be executed. Generally we put render() in the subscribe to display the state changes in the UI.

Feel free to fork the pen and play around with it!! Happy Redux!!

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s