Counter sample for using react-redux

index.js

import React from 'react';
import ReactDOM from 'react-dom';
import * as serviceWorker from './serviceWorker';
import { createStore, combineReducers } from 'redux';
import { Provider, useSelector, useDispatch } from 'react-redux';

const reducer = combineReducers({
  counter: (state = 0, action) => {
    switch (action.type) {
      case "INCR":
        return state + 1;
      case "DECR":
        return state - 1;
      default:
        return state;
    }   
  },
  lastUpdate: (state = null, action) => {
    switch (action.type) {
      case "INCR":
        return new Date();
      case "DECR":
        return new Date();
      default:
        return state;
    }   
  }
});

const store = createStore(reducer);

function Counter(props) {
  const { counter, lastUpdate } = useSelector( state => state );
  const dispatch = useDispatch();
  return (
      <React.Fragment>
          <p>{counter}</p>
          <p>{lastUpdate===null?"N/A":lastUpdate.toDateString()}</p>
          <button type="button" onClick={e=>{dispatch({type:"INCR"})}}>Incr +</button>
          <button type="button" onClick={e=>{dispatch({type:"DECR"})}}>Decr -</button>            
      </React.Fragment>
  );
}

ReactDOM.render(
  <React.StrictMode>
    <Provider store={store}>
      <Counter/>
    </Provider>
  </React.StrictMode>,
  document.getElementById('root')
);

// If you want your app to work offline and load faster, you can change
// unregister() to register() below. Note this comes with some pitfalls.
// Learn more about service workers: https://bit.ly/CRA-PWA
serviceWorker.unregister();