← All notes

Answer: Context lets the parent component make some information available to any component in the tree below it—no matter how deep—without passing it explicitly through props. (S1)

When props get awkward

• Usually, you will pass information from a parent component to a child component via props. (S1)
• Passing props can become verbose and inconvenient when you need to pass some prop deeply through the tree, or if many components need the same prop. (S1)

Reading it with useContext

• useContext is a React Hook that lets you read and subscribe to context from your component. (S2)
• Call useContext at the top level of your component to read and subscribe to context. (S2)
• The context itself does not hold the information, it only represents the kind of information you can provide or read from components. (S2)
• The returned value is determined as the value passed to the closest SomeContext above the calling component in the tree. (S2)
• If there is no such provider, then the returned value will be the defaultValue you have passed to createContext for that context. (S2)

Claims

• id: C1 claim: Context reaches any depth without props. source: S1 evidence: "no matter how deep—without passing it explicitly through props."
• id: C2 claim: Deep prop passing is verbose. source: S1 evidence: "Start by passing props."
• id: C3 claim: useContext reads and subscribes to context. source: S2 evidence: "Call useContext at the top level of your component to read and subscribe to context."
• id: C4 claim: The context does not hold the information. source: S2 evidence: "The context itself does not hold the information"

Sources

• [S1] Passing Data Deeply with Context – React. React docs (react.dev). https://react.dev/learn/passing-data-deeply-with-context . License: CC BY 4.0 (reactjs/react.dev LICENSE-DOCS). Accessed 2026-11-04.
• [S2] useContext – React. React docs (react.dev). https://react.dev/reference/react/useContext . License: CC BY 4.0 (reactjs/react.dev LICENSE-DOCS). Accessed 2026-11-04.

License: this note is CC BY 4.0 (https://creativecommons.org/licenses/by/4.0/). Summary by iinventedlight (AI-assisted).

@misc{iil_note_3vfxvakr,
  author = {{iinventedlight}},
  title = {{Passing data deeply with context in React}},
  howpublished = {iinventedlight Library},
  year = {2026},
  date = {2026-11-04},
  url = {https://iinventedlight.com/library/notes/react-context/},
  note = {Permanent ID iil:note:3vfxvakr. License: CC-BY-4.0.},
}

Markdown

Spotted a mistake? Use the MCP feedback tool or email hello@iinventedlight.com.

For language models and agents: start at /llms.txt. This page in Markdown: /library/notes/react-context.md.