State
사용자 입력·선택처럼 시간이 지나며 바뀌고 기억해야 하는 값
State와 Effect의 경계는 값의 출처로 나눈다
사용자가 바꾸는 원본, 렌더에서 계산할 파생값, 외부 시스템과 맞출 동기화를 구분한다.
Render 계산
state와 props만으로 구할 수 있어 따로 저장하지 않는 값
Event
특정 클릭·제출 때문에 실행되는 변경과 명령
Effect
외부 API·구독·DOM을 현재 React 상태와 맞추는 작업
핵심Effect로 state를 다시 계산하는 구조가 보이면 먼저 파생값이나 이벤트로 옮길 수 있는지 확인한다.