4. useReducer 바로 알기 - 기본편
useReducer 는, 강력한 State 관리 도구이다. useState 에 비해, 조금 복잡하지만, 많은 state의 변화를 가져오는 action (실행 함수) 을 한군데 모아, 가독성 있게 State 를 관리 할 수 있다. 또한, 컴포넌트의 상태 업데이트 로직을 컴포넌트에서 분리시킬 수 있다. useReducer는, 크게 두가지 파트가 있다. 리듀서 함수, 그리고 리듀서함수를 dispatch 하여 사용하기 1. 리듀서함수 리듀서 함수는, type 이라는 action의 이름을 이용하여, 각 type 에 맞는, action을 취하게 한다. 리듀서 함수의 반환값 (쉽게 말하면, 각각의 type에 맞는 action이 일어난 후 return 값) 은, 새로운 상태 를 반환한다. * 리듀서함수는 컴포넌트 함수..
2022. 12. 8.
3. useEffect 바로알기 with. 클린업 프로세스, 디바운싱
useEffect의 사용 useEffect는, 사이드이펙트를 막는데 아주 유용하다. 기본사용 : useEffect( ( ) => { 실행함수 } , [ 종속성 ] ) useEffect의 기본적인 사용법 1. 시작할때 한번만 : 종속성에 state를 넣는다. 2. 무언가 변할때마다 : 종속성에 변하는것(state)를 넣는다. 종속성에는 여러 state 를 넣을 수도 있다, [name, password, id ...] 초기에 한번 실행되고, 이후, 종속성 값이 변할때마다 실행된다. 3. 클린업 프로세스를 이용한다 useEffect 를 사용할때, "반환하는 함수"를 만들 수 있다.(화살표 함수도, 선언문 함수도 괜찮다.) 이 함수를 "클린업 함수" 라고 부른다. [클린업 함수의 실행 타이밍] 1. 클린업 함수..
2022. 12. 8.