const counterUnit = new NumUnit() // with default value 0
// define two pure functions that produce a new value
const increment = value => value + 1;
const decrement = value => value - 1;
// create a react component
const [value, setValue] = useState<number>(); // create local state
// use an effect to update the local state when counterUnit's value changes
const subscription = counterUnit.subscribe(setValue);
return () => subscription.unsubscribe(); // prevent memory leak
<button onClick={() => counterUnit.dispatch(increment)}>Increase</button>
<button onClick={() => counterUnit.dispatch(decrement)}>Decrease</button>