This video is available to students only

React Context API

Context API provides a way to pass data through the component tree - no more prop-drilling!

Context provides a way to pass data through the component tree without having to pass props down manually at every level.

Prop drilling has been one of the long-term pains of using React, where we needed to manually pass down a prop to a deeply nested component, through all its parents.

Let's say we have a user.name context that we need in a UserProfile component. However user.name is at the application level, and UserProfile is under, say, Home -> Header -> Sidebar -> UserProfile.

In prop-drilling fashion, we would pass down the value through each component - Home -> Header -> Sidebar -> UserProfile. The Context API can help us access this directly.

Start a new discussion. All notification go to the author.