Counter.js

import React, { Component } from 'react';

const counter = (state = { value: 0 }, action) => {
  switch (action.type) {
    case 'INCREMENT':
      return { value: state.value + 1 };
    case 'DECREMENT':
      return { value: state.value - 1 };
    default:
      return state;
  }
}

class Counter extends Component {
  state = counter(undefined, {});
  
  dispatch(action) {
    this.setState(prevState => counter(prevState, action));
  }

  increment = () => {
    this.dispatch({ type: 'INCREMENT' });
  };

  decrement = () => {
    this.dispatch({ type: 'DECREMENT' });
  };
  
  render() {
    return (
      <div>
        {this.state.value}
        <button onClick={this.increment}>+</button>
        <button onClick={this.decrement}>-</button>
      </div>
    )
  }
}

From line 17:

  dispatch(action) {
    this.setState(prevState => counter(prevState, action));
  }

should probably be more like:

  dispatch(action) {
    this.state = counter(this.state, action));
  }

@graphicore lol no, state is immutable

https://reactjs.org/docs/react-component.html#state

Probably a good interview question on how to write Redux style code without using Redux

It's 2019. useReducer :)

It's 2019. useReducer :)

This is from 5 years ago.