reading-notes

Class Thirty-One Notes (401)

Context API

Choosing the State Structure¹

The five principles for structuring state:

1. When more than one state is updated at once, put them into the same state
2. Do not have states that contradicts each other
3. Do not repeat states
4. Avoid duplicate states to avoid a state to be out-of-sync
5. Avoid deeply nested states, choose a flat state structure when possible

Passing State Deeply with Context²

• Contexts solve the issues when a parent is trying to pass props to its child’s child, which involves passing through multiple layers in a tree.
• createContext and LevelContext complementary to useContext for complex applications. createContext is required to create a context, and LevelContext allows the component to use the vlaue of the nearest LevelContext.Provicer in the UI tree above it.
• Props should still be considered before using contexts.

What is one technique to try before useContext? What hook complements useContext for complex applications?

Back to main page

References

1. https://react.dev/learn/choosing-the-state-structure ↩

2. https://react.dev/learn/passing-data-deeply-with-context ↩