redux-counter-intro.js

import React from 'react'
import { render as renderDom } from 'react-dom'
import {createStore} from 'redux'

const INCREMENT = 'INCREMENT'
const increment = (howMuch) => { return {type: INCREMENT, amount: howMuch} }

const Counter = (props) => {
  return (
    <div>
      <h2>Hi, I got the count: {props.count} </h2>
      <button onClick={()=> props.dispatch(increment(4))}>up</button>
    </div>
  )
}

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

const store = createStore(countReducer)

const redraw = () => {
  renderDom(
    <Counter count={store.getState()} dispatch={store.dispatch} />, 
    document.querySelector('main'))
}

store.subscribe(redraw)
redraw()