redux가 익숙해진다면 hooks로 관리하자
useEffect에 대한 deep한 설명
https://rinae.dev/posts/a-complete-guide-to-useeffect-ko
redux w/ hooks
https://www.youtube.com/watch?v=o3aGun-pQhQ
redux hooks code ex
https://github.com/candraKriswinarto/react-redux-tut
참고 https://velopert.com/3528
https://www.youtube.com/watch?v=93p3LxR9xfM
벨로퍼트 5-1부터
https://www.youtube.com/watch?v=LRUQfJLuPA8&list=PL9FpF_z-xR_GMujql3S_XGV2SpdfDBkeC&index=21
실습
https://vimeo.com/402201704
redux -> middleware wear(fetch때 필요함)
mobx
contextAPI
vuex
action - obj
action creator = function - 반환하는값을 action
reducers = function - 업데이트된 상태값 리턴
- 여러개의 리듀서가 있고, 상태의 값 업데이트 그 함수가 요청한 새로운 상태값을 리턴, 상태는 객체이고 밸류값을 바꿔준다. 여러개의 키가 잇으면 원하는 키에접근해서 그 키의 밸류값만 업데이트 시켜줌.
보험회사의 부서 여러개
회사를 스토어
고객이 서류를 들고있음
서류 - 액션
고객 - 액션 크리에이터
직접가서 제출 - dispatch
1. 리셉션 -> dispatch (서류를 받아서 동시에 모든 부서에 전달(이 과정을 dispatch)(자동으로이르어짐)
2. 각 부서 -> 각 reducer ( 부서에서 판단 -> 서류확인 )
3. 서류확인에 대한 정보 ( 타입확인검사)
- (액션은 객체, 키값으로 type, type 밸류값은 액션의 정보임)
- ( type : "INCREMENT" )
- 서류확인후 관련 없으면 pass
- 관련 있으면 진행 -> 어떤 부서? type밸류값 (액션의 종류)
- type밸류값의 추가정보? 두번째 객체 payload:"아무형태가능
- 이 다음에 dispatch로 이동 -> reducers로 이동함
reducer는 만들어야함? (dispatch는 안만들어도 된다?) - reducers는 (기존state, 액션) 두 인자를 받는다.
ex) 가입부서(state-기존고객명단,
타입확인
리듀서에서
-> switch(action.type) -- 케이스 하나만 받음
case : "REGISTER"
case : --
case : --
case : --
맞는게 없을때는
default: 를 호출
한 리듀서
dipatch(액션) -> combine reducers -> reducers로 동시 모두 보냄
props
store랑 component랑 연결 --> connet함수
받아먹는 컴포넌트
액션발생 컴포넌트
받고보내는 둘다하는 컴포넌트
위의 케이스별로 인자가 다름.
인풋이 아주아주아주 많을때
한 디브안에 여러개의 디브 각디브안에 input이 엄청많음
마지막 버튼(액션)으로 데이터뿌림
