State management with React (doc 2023)

State structuring

Principle:

• A report must not have redundant information. Example with fullname in State vs. with a calculation of the value DURING the rendering of the component. (https://react.dev/learn/managing-state)

• Avoid the 4 DRIC inspectors (mnemonic):

• Duplication

  • Redundancy
  • Nesting(deep)/
  • Contradiction

Linked states (ex: x,y for position)

Useful if two or more states at the same time.

State elevation

Bonuses

• Redux toolkit is the most used replacement for Redux: https://redux-toolkit.js.org/ **/!\ ContextAPI is a dependency injection, not a state manager. https://blog.isquaredsoftware.com/2021/01/context-redux-differences/ What simulates the impression that it "manages state" (when it is like a transport) is actually done via useState or useReducer.