Motivation

Recently there has been a lot of debate about how to manage the state in React. Some claim that setState() doesn’t work as you might expect. That you have to externalize the state using a Flux-like state container and avoid completely the component’s state.

On the other hand, there are people concerned that these misconceptions could become a dogma:

Adding an external state container just for fun or because some tutorials tell you to do so, sounds like is not a good technical decision criteria.

To make myself clear, there is nothing wrong with Redux, MobX or whatever external state container you might think of. Actually they are pretty useful and come with a broad ecosystem to suit all your needs. But, the thing is: you might not need them at all, or at least yet.

If you are learning React from scratch, Pete Hunt coined the best advice you can get. Even the creator of Redux and React’s core team member Dan Abramov recommends it:

That means you need to understand how to handle state in React way before thinking about Flux.

In case you are starting a real life application you can accomplish a lot without Flux. Dividing the components into two categories: containers and presentational. This way you’ll gain in maintainability and reusability. Also, in case you need to introduce Flux later, the migration path will be cleaner. Giving you the option to make the decision at the last responsible moment.

Even if you are already using Flux, there are cases when you should use the component’s state. Think of a component library that you want to share across projects, where all the components are self-contained and independent. You really don’t want to have a state container as a dependency here.

My point is:

There are crossed opinions, misconceptions and lack of knowledge in the community about how to manage state in React.

In order to embrace all the power React gives you, it is crucial a solid understanding of how to handle state .

. Don’t add another layer of complexity to your application if you don’t need it. Remember: simplicity matters.

The purpose of the following FAQ section is to mitigate the intricacies of handling state in React.