React Hooks Tutorial on pure useReducer + useContext for global state like Redux and comparison with react-hooks-global-state

React hooks are awesome.

In this article, I will first explain minimal code to implement global state with useReducer and useContext which are called “hooks” that will be available in React 16.7. I will then compare it with react-hooks-global-state which is a tiny library that I’ve been developing for global state management primarily for small applications.

Note: Global state is convenient for sharing values among components far apart in the component tree, but it shouldn’t be abused because it would limit the reusability. Consider if values could be simply passed as props down the component tree.

Pure useReducer + useContext example without any libraries

Let’s look at the code. It’s written in TypeScript. My TypeScript preference is enabling the strict mode, more precisely with noImplicitAny and noAny(tslint). I’m pretty interested in writing code in…