Context and Hooks

Context

• Context gives us a way to pass data through the component tree w/o having to pass props down manually at every level.
• In React apps, data is usually passed from the top-down (parent to child) via props. This can be annoying for certain types of props that are required by many components w/in an application.
• Context gives us a way to share values between components w/o having to explicitly pass a prop through every level of the tree.

Using Context

• Context lets us share data that can be considered global in scope for a tree of React components (eg: current authenticated user, theme, etc).
• Allows us to avoid passing props through intermediate elements.
• Useful when some data needs to be accessible by many components at different nesting levels.
• Since context uses reference identity to determine when to re-render, we need to be careful not to trigger unintentional renders in consumers when a provider's parent re-renders.

Hooks