What is the state?
The state can be anything that needs to live and be modified in the browser
State Management in react?
State management means accessing, initializing, modifying, and deleting the state in your react application.
Types of state
For simplicity, all states can be categorized into two types once that sit inside the component and the one's that don't
- Local State - State that's inside your component.
- External State - State that's outside the view layer.
Local State
A local state is bound to the component. Generally, it is used by the component and its children. If required it can be shared also be shared with the parent & sibling components. Some of the techniques for sharing the local state are as follows
- Prop Drilling
- Lifting The State
While these techniques are good to get started with, but soon becomes difficult and unnecessary as your application increases
External State
External State allows easy state management overall the application. External states allow us to establish a single source of data or truth thus making sure all our application components data is in sync. But to use an external state some amount of boilerplate code and third-party state management libraries are required. Some of the most popular external state management libraries are
Best type of state to use in your application
"Anything in excess is a poison.” The same holds true for state management, too much of local state and you have to either prop drill or lift up unnecessarily or too much of external state and we could bloat up our external state where the local state would have done the job. The key is to use a mix of both as per the requirement.
That's all of my 2 cents on state management. I hope it was useful and helpful to you. Thanks for reading :)