Skip to main content

Managing State in React.js + Flux Applications.

Recently i have been trying out the new kid on the block, React.js and its unidirectional data/state management partner Flux.

The concept of React.js is very simple.

  • Your app is a combination of react components. 
  • Every component has a state and properties.
  • Whenever there is any change in the state or properties of the components the component is rerendered.

Though in the above points i used the state and properties very casually. Usually its very important to get your head around when to use state and when to use properties.  You can refer to this article to find out more about props vs state. 

On the other hand Flux which calls itself an architectural pattern rather than a framework, is also straight forward.

  • There is a dispatcher whose main goal is to dispatch the event to all the registered objects.
  • There is a store, the store basically encapsulates the state of a component or group of components. The store registers itself with the dispatcher and receives the events with data from the dispatcher. it can choose which actions it should react to and modify the data it is holding.
  • Actions are sent to the dispatcher with a payload to be distributed to the registered objects.

This example can make it more clear

now a component can listen to this store by registering a listiner and whenever there is a change an event is emitted form the store and the component’s listener method is called back which can update its state.


Post a Comment

Popular posts from this blog

It was a great experience to talk to a huge audience in Mumbai and Delhi about how to start your ML journey at Google Cloud Summit ’18 India



COVID-19 Lockdown

It is May 11th 2020 and most of India has been under lockdown for 46 straight days. These have been tough times for everyone. While some of the folks i know have been cribbing about being bored to death in this lockdown, for me it has been a busy time. My current field of work which is "Cloud Technology" picked up as everyone was locked up with nothing but technology to entertain and survive and hence there was a lot of work. While me and my family was trying to navigate the chaos and madness of ordering everything online, i would say we were able to deal with the situation without going out much.  This was until my phone broke, crashed, bricked, it was gone.  While i had a spare 4 year old iPhone to fall back on but you know about spare phones, they were too old to trade for a newer one is why you decided to label it as a spare and keep it. They almost never work. So after struggling to get my office and personal stuff to work on an old phone and tablet, i decided i needed t