React - State

State in React.

In React apps, whether a component is stateful or stateless is considered an implementation detail of the component that may change over time. You can use stateless components inside stateful components, and vice versa.

State in React refers to local state mainly. It is like a component’s personal data storage. State is useful for handling data that changes over time or that comes from user interaction. State gives components memory.

• Class Component: React Class Component - Local State
• Function Component: React Function Component - State (useState Hook)

• https://reactjs.org/docs/context.html

in conjonction with React - Higher Order Component (HOC)

• Class Component: React Class Component - Shared State (Lifting state up)

props are component arguments (passed in the form of object properties) that are passed from parent to child component. They are not really state but hold values.

React does not persist the data between page load because it's mainly coupled with a state management library.

State management library aims to implement logging, hot reloading, time travel, universal apps, record and replay.

A state management library will trace every mutation to the action that caused it. You can record user sessions and reproduce them just by replaying every action.

Redux evolves the ideas of Flux, but avoids its complexity by taking cues from Elm.

• The whole state of the app is stored in an object tree inside a single store.
• The only way to change the state tree is to emit an action, an object describing what happened.
• To specify how the actions transform the state tree, you write pure reducers.

• MobX (used by postman)
• Flux

¹⁾