React Design Patterns and Best Practices - Second Edition

Context API

The new and official Context API was introduced in React 16.3.0. Before, React offered an experimental API for context. Although it was a powerful tool, its use was discouraged because of inherent problems in the API.

React 16.3 introduces a new context API that is more efficient and supports both static type checking and deep updates.

The Context API implementation is really easy. First, you need to create your Context (using createContext) and your Provider, which is a React class component. Let's create a context for our List component to fetch the gists. This file needs to be called ListContext.jsx:

  // Dependencies  import React, { Component, createContext } from 'react';  import { element } from 'prop-types';  // Context