React Projects

Creating a global Context

If you look at the current structure of the routes in your App component, you can imagine this will get messy if you add more Providers and Consumers to your application. State management packages such as Redux tend to have a global state where all of the data for the application is stored. When using Context, it's possible to create a global Context that can be accessed using the useContext Hook. This Hook acts as a Consumer and can retrieve values from the Provider of the Context that was passed to it. Let's refactor the current application to have a global Context:

1. Start by creating a file called GlobalContext.js in the src/Context directory. This file will import both ListsContextProvider and ItemsContextProvider ...