Learn React Hooks

Introducing React context

In the previous chapters, we passed down the user state and dispatch function from the App component, to the UserBar component; and then from the UserBar component to the Logout, Login, and Register components. React context provides a solution to this cumbersome way of passing down props over multiple levels of components, by allowing us to share values between components, without having to explicitly pass them down via props. As we are going to see, React context is perfect for sharing values across the whole application.

First, we are going to have a closer look at the problem of passing down props. Then, we are going to introduce React context as a solution to the problem.