🌐
React
legacy.reactjs.org › docs › context.html
Context – React
Context is designed to share data that can be considered “global” for a tree of React components, such as the current authenticated user, theme, or preferred language.
🌐
React
react.dev › learn › passing-data-deeply-with-context
Passing Data Deeply with Context – React
In this example, you specified 1 as the argument to createContext, so useContext(LevelContext) returns 1, setting all those headings to <h1>. Let’s fix this problem by having each Section provide its own context. The Section component currently renders its children: ... This tells React: “if any component inside this <Section> asks for LevelContext, give them this level.” The component will use the value of the nearest <LevelContext> in the UI tree above it.
Discussions

When to use context?
Me personally, if I know state rarely changes. Instances like user authentication, app theme (dark, light, or whatever), something to that effect. If I'm not mistaken, react docs recommends using a query library from now on to handle server data fetching like React-Query or RTK Query (I could be wrong!!!). I've only used React-Query, but I have used Redux ToolKit. More on reddit.com
🌐 r/reactjs
4
4
May 5, 2023
React Context vs Zustand: Am I Missing Out on Anything?
You should ideally only use Context for sharing state which is contextual in nature. You should avoid using Context for global state. Zustand is more performant than context, lightweight, and really easy to learn. It can even be applied contextually, but it is made for global state by default. No good reason not to use it over Context. More on reddit.com
🌐 r/reactjs
21
6
July 5, 2023
Is there a reason not to use Redux as a replacement for Context?
Hi, I'm a Redux maintainer. The answer is that they really are different tools :) Context is a Dependency Injection tool for a single value, used to avoid prop drilling. Redux is a tool for predictable global state management, with the state stored outside React. Note that Context itself isn't the "store", or "managing" anything - it's just a conduit for whatever state you are managing, or whatever other value you're passing through it (event emitter, etc). I wrote an extensive article specifically to answer this frequently asked question, including details about what the differences are between Context and Redux, and when to consider using either of them - I'd recommend reading through this: Why React Context is Not a "State Management" Tool (and Why It Doesn't Replace Redux) More on reddit.com
🌐 r/reactjs
88
82
February 27, 2023
Context api + useReducer VS redux

Sure. If you want to build all of the tooling that React-Redux provides yourself.

And now a rant, that isn’t aimed directly at you but at these this question in general because it gets asked all the time with 0 effort on the part of the asker:

Does no one do their research anymore before asking on this topic? Context is NOT a state manager, it is a storage solution. Your options for storing state in React are Context or hooks -thats it.

Don’t like Redux? Fine. But it’s ridiculous to ask “how can I replace this library with so many years of development by myself” without even doing a tiny bit of research as to what you’d gain or what you’d lose.

Not wanting to utilize something that is complicated is understandable. But state management as a whole is complicated and Redux is the battle cruiser of state management. You can build something simpler but don’t be surprised when it isn’t performant, buggy, scalable, or adaptable.

There are over 10 well maintained state management libraries now. A simple trip to Google would at least put you on the right track to understand what’s available and why.

There should probably be a sticky in the sidebar about this topic. There might even be already. I can’t tell you how many times I’ve answered this exact question here or on SO. People are obsessed with not using Redux.

While I’m in grandpa mode, to Mark Erickson, you’re a champ for heading up the React-Redux maintenance. It’s a fantastic library, your community involvement is so appreciated, and thank you for fielding so many low effort questions. You da man.

<Rant/>

More on reddit.com
🌐 r/reactjs
7
3
January 3, 2021
🌐
React
react.dev › reference › react › createContext
createContext – React
Wrap your components into a context provider to specify the value of this context for all components inside: ... Starting in React 19, you can render <SomeContext> as a provider.
🌐
Kent C. Dodds
kentcdodds.com › blog › how-to-use-react-context-effectively
How to use React Context effectively
If you're using TypeScript, not providing a default value can be really annoying for people who are using React.useContext, but I'll show you how to avoid that problem altogether below. Keep reading! Ok, let's continue. For this context module to be useful at all we need to use the Provider and expose a component that provides a value.
🌐
LogRocket
blog.logrocket.com › home › react context tutorial: complete guide with practical examples
React Context tutorial: Complete guide with practical examples - LogRocket Blog
February 19, 2025 - React Context was introduced in React v.16.3. It enables us to pass data through our component trees, allowing our components to communicate and share data at various levels. This guide will explore everything you need to know about using Context ...
🌐
React
react.dev › reference › react › useContext
useContext – React
Here, the context value is a JavaScript object with two properties, one of which is a function. Whenever MyApp re-renders (for example, on a route update), this will be a different object pointing at a different function, so React will also have to re-render all components deep in the tree that call useContext(AuthContext).
🌐
Devtrium
devtrium.com › posts › how-use-react-context-pro
How to use React Context like a pro - Devtrium
September 13, 2021 - In situations where you care about this (and only in those), you can separate your state and your state setters in two different contexts. I believe this idea was first introduced by Kent C. Dodds in this blog post. The implementation of that pattern is the following: ... import React, { createContext, useContext, useState, useEffect, useCallback } from "react"; // create contexts
Find elsewhere
🌐
Telerik
telerik.com › blogs › react-basics-how-when-use-react-context
React Basics: How and When to Use React Context
August 21, 2023 - Context, in React, is a powerful tool that allows us to share data between components without having to pass props down every level of a component tree. We’ve written content before on understanding how the React Context API works.
🌐
LoginRadius
loginradius.com › home
React Context API: What is it and How it works?
January 1, 2026 - The React Context API is a way for a React app to effectively produce global variables that can be passed around. This is the alternative to "prop drilling" or moving props from grandparent to child to parent, and so on.
🌐
Kyle Shevlin's Blog
kyleshevlin.com › how-to-use-react-context-effectively
How to Use React Context Effectively | Kyle Shevlin
March 11, 2021 - Creating a Context returns an object with two properties, Provider and Consumer, both of which are components. Providers are parent components that receive a value prop that they wormhole to all their Consumer children. Here’s a quick example using a ThemeContext: const ThemeContext = React.createContext() function App() { return ( <ThemeContext.Provider value="light"> <Header /> <Main /> <Footer /> </ThemeContext.Provider> ) } function Header() { return ( <ThemeContext.Consumer> {theme => { return ( <header style={{ backgroundColor: theme === 'light' ?
🌐
freeCodeCamp
freecodecamp.org › news › how-to-use-react-context
How to Use React Context in Your Project – Beginner's Guide
January 5, 2024 - It allows components to subscribe to the context changes and access the shared value. We might not see the consumer per say but it will use the information rendered by the provider.
🌐
freeCodeCamp
freecodecamp.org › news › react-context-api-explained-with-examples
React Context API Explained with Examples
May 30, 2024 - The React Context API was released in 2018 to avoid prop drilling by simplifying state management and making sharing data across the component tree more efficient and error-free.
🌐
GeeksforGeeks
geeksforgeeks.org › reactjs › context-in-react
Context in React - GeeksforGeeks
React Context is a method to pass props from parent to child component(s), by storing the props in a store(similar in Redux) and using these props from the store by child component(s) without actually passing them manually at each level of the ...
Published   July 15, 2025
🌐
Medium
medium.com › @ankushchavan0411 › getting-started-with-react-context-api-dca142757080
Getting Started with React Context API | by Ankush S Chavan | Medium
January 8, 2024 - Before we delve into the code, let’s briefly understand what the React Context API is and why it’s useful. The Context API provides a way to pass data through the component tree without having to pass props manually at every level.
🌐
Robin Wieruch
robinwieruch.de › react-context
How to use React Context
React Context is a powerful feature for passing props down the component tree without the need to tell components in between about them. React Context creates a Provider and Consumer component for tunnelling React components ...
🌐
Dmitri Pavlutin
dmitripavlutin.com › react-context-and-usecontext
A Guide to React Context and useContext() Hook
February 2, 2023 - React context provides data to components no matter how deep they are in the components tree. The context is used to manage global data, e.g.
🌐
CodeMiner42
blog.codeminer42.com › home › react › you are using react context wrong or why we should not underestimate what we consider simple
You are using React Context WRONG Or why we should not underestimate what we consider simple - The Miners
March 19, 2024 - Something that only depends on the context re-renders when something that is not the context changes · Let’s tackle them one by one! Before solving this problem, let’s understand the reason why it happens. Even though part of the process of React rendering a component consists of calling the function that defines that component, it’s not the whole thing, that’s why when you use a component with the JSX syntax <MyComponent propA={1} />, it’s not the same as you calling MyComponent({ propA: 1 }) directly.
🌐
Fireship
fireship.dev › react-context
Guide to React Context - Fireship
Context provides a way to pass data through the component tree without having to pass props down manually at every level. - The React Docs
🌐
Refine
refine.dev › home › blog › tutorials › a guide to usecontext and react context api
A Guide to useContext and React Context API | Refine
October 31, 2024 - The createContext function returns a context object. The returned object has the Provider and Consumer properties. These properties are React components and are usually referred to as context providers and consumers respectively.