import {createStore} from 'redux' import {useSelector, useDispatch} from 'redux'

Store & initialStore Actions & ActionCreators Reducer / RootReducer Provider / wrap entire Application

1. in initial_store.js create initialStore / initialState const initialStore = {}
2. in actions.js create the actions export const EXAMPLEACTION = "EXAMPLEACTION" export const OTHERACTION = "OTHERACTION" export const SOMEACTION = "SOMEACTION"
3. in reducer.js create the reducer

import {EXAMPLE_ACTION} from './action.js'

const reducer = (state, action) => { if(action.type === EXAMPLE_ACTION) { return {} } return { state } }

4. const store = createStore(reducer = initialStore)

Store takes 2 Arguments

dispatch() method sends the actions to the Store

Reducer does NOT mutate the state, it returns a new State Reducer is a Function and takes 2 Arguments function reducer(oldState, action) { console.log({oldState, action}) } Reducer updates the Store

mapStateToProps mapDispatchToProps

Hooks version

useSelector useDispatch