reactjs - When do I choose React state Vs Redux Store

Question

I've been learning Redux and a part I'm unclear of is, how do I make a determination between using react state vs redux store and then dispatching actions. from my reading so far it looks like I could use React state in place of Redux store and still get things done. I understand the separation of concerns with using Redux store and just having 1 container component and the rest of it as stateless component but how do I make the determination of when to use React state Vs redux store is not very clear to me. Can someone please help?

Thanks!

Answer 1

If the state doesn't need to be shared with other components, or the state doesn't need to be keep when the component is unmounted, then you can just put it in the component's state.

You can think that the Redux store is the database of front-end, if you have something like product data fetched from an API, then the Redux store is the right place; if you have a dropdown component, which takes a isOpen prop, then the parent of that dropdown can just keep dropdownIsOpen as a component state.

For more information, here is the answer from Dan: https://github.com/reactjs/redux/issues/1287

Also you said

only 1 container component and the rest of it as stateless component

This is incorrect. You can have several container components. A container component can also contain another container component.