State is an often tricky concept for noobs, and here is an attempt to simplify it through a real life example.
State is a snapshot of how things were at a particular point of time. In a web page. Period.
The background might have been blue, the variable hello might have had the value 10, the array might have had 15 elements. All these are part of state at a particular time.
Let's say we have to make a simple counter app, which can just increment and decrement a number on the screen. The click of a particular button will increment, and the other will decrement.
Everytime any of the buttons is clicked, the state of the number visible on the screen changes, and the same is reflected on the screen.
Similarly, an event happening can also be a state change, such as the change in window size of the browser.
State management is complex because changing state the incorrect way can lead to unexpected results, and is often very hard to debug, since there is no actual syntactic error.
Angular uses libraries like NgRX for state management, and React uses Redux.
Mutating state means to make changes to the existent state, and it is good practice in React to not modify state directly, as it leads to unexpected views. More info here.)
Cheers! Happy coding
Top comments (0)