Redux basic

1. initialize a store(global state)
2. setup reducers: reducer(state = initState, action) => { return new state}
3. dispatch: call store

• https://redux.js.org/introduction/getting-started
• https://www.redux.org.cn/docs/basics/ExampleTodoList.html

//reducer
const reducer = (state = [], action) {
    switch(action.type){
        case 'ADD':
            retrun [ [...state], action.payload]
    }
}

previous state + action => return new state
state: 資料
action: 定義執行的動作與新的資料
reducer: 透過 action.type 決定要做什麼事， action.payload 帶入新資料

let store = createStore(reducer)

a sotore hold the state

//action
const action = {
  type: 'ADD',
  payload: {
      id: 'user56',
      name: '王仁甫'
  }
}

//dispatch

store.dispatch(action)

binding subscribe store to component

force component re-render when props value changed

react-redux connect

• https://pjchender.dev/react/redux-react-redux-api/
• https://redux.js.org/tutorials/quick-start