Skiende74 chapter03

chapter03/skiende74.md

@@ -0,0 +1,74 @@
+# 03장: 리액트 훅 깊게 살펴보기
+
+리액트를 이루는 핵심 요소들을 깊게 살펴보고, 리액트의 렌더링 과정을 이해하는 장입니다.
+
+<br>
+
+- [03장: 리액트 훅 깊게 살펴보기](#03장-리액트-훅-깊게-살펴보기)
+  - [3.1 리액트 훅 깊게 살펴보기](#31-리액트-훅-깊게-살펴보기)
+    - [3.1.1 useState](#311-usestate)
+    - [3.1.2 useEffect](#312-useeffect)
+    - [3.1.3 useMemo](#313-usememo)
+    - [3.1.4 useCallback](#314-usecallback)
+    - [3.1.5 useRef](#315-useref)
+    - [3.1.6 useContext](#316-usecontext)
+    - [3.1.7 useReducer](#317-usereducer)
+    - [3.1.8 useImperativeHandle](#318-useimperativehandle)
+    - [3.1.9 useLayoutEffect](#319-uselayouteffect)
+    - [3.1.10 useDebugValue](#3110-usedebugvalue)
+    - [3.1.11 훅의 규칙](#3111-훅의-규칙)
+    - [3.1.12 정리](#3112-정리)
+  - [3.2 사용자 정의 훅과 고차 컴포넌트 중 무엇을 써야 할까?](#32-사용자-정의-훅과-고차-컴포넌트-중-무엇을-써야-할까)
+    - [3.2.1 사용자 정의 훅](#321-사용자-정의-훅)
+    - [3.2.2 고차 컴포넌트](#322-고차-컴포넌트)
+    - [3.2.3 사용자 정의 훅과 고차 컴포넌트 중 무엇을 써야 할까?](#323-사용자-정의-훅과-고차-컴포넌트-중-무엇을-써야-할까)
+    - [3.2.4 정리](#324-정리)
+
+<br>
+
+## 3.1 리액트 훅 깊게 살펴보기
+함수형 컴포넌트에서는 리액트 훅을 이용하여 클래스형 컴포넌트의 실행주기 메소드의 역할을 대신할 수 있다.
+### 3.1.1 useState
+useState가 필요한이유. 나이브하게 변수만바꾸는 콜백이 작동하지 않는 이유
+- 1. 변수를 바꿔도, 리액트는 rerender하지 않기때문. -> 그러면 useState의 set함수만 가져와서 triggerRender();로 명명후 콜백에 넣어주면? 그래도안됨 2떄문에.
+- 2. render가 된다해도, 리액트는 함수를 재실행후 업데이트한다. 그런데 재실행때 초기화구문때문에 상태가 처음으로 다시돌아가버린다. -> 클로저 사용
+
+- 추가TIP : useState(인수) 인수에 원시값말고 함수를넣어주면 게으른 초기화 가능. (=딱처음실행될때만 초기화하고, 이후 업데이트시 실행되지않는다.)
+무거운연산(localStorage, setStorage 접근, 배열메소드연산 등)에 사용하면 좋다.
+
+### 3.1.2 useEffect
+useEffect는 옵저버 등으로 값을 따로 관찰하는 게 아니고, '렌더링 시'에 그냥 덤으로 값을 보고 변한게있으면 그 콜백을 실행해줌. 그러니 단순 부수효과함수에불과.
+useEffect(콜백, 의존성배열) 순으로 쓰고, 의존성배열에 있는 변수가 바뀌면 콜백을 실행함.
+
+콜백에서는, 함수를 리턴하면 그 함수가 이어서 실행된다. (클린업함수)
+### 3.1.3 useMemo
+
+### 3.1.4 useCallback
+
+### 3.1.5 useRef
+
+### 3.1.6 useContext
+
+### 3.1.7 useReducer
+
+### 3.1.8 useImperativeHandle
+
+### 3.1.9 useLayoutEffect
+
+### 3.1.10 useDebugValue
+
+### 3.1.11 훅의 규칙
+
+### 3.1.12 정리
+
+<br>
+
+## 3.2 사용자 정의 훅과 고차 컴포넌트 중 무엇을 써야 할까?
+
+### 3.2.1 사용자 정의 훅
+
+### 3.2.2 고차 컴포넌트
+
+### 3.2.3 사용자 정의 훅과 고차 컴포넌트 중 무엇을 써야 할까?
+
+### 3.2.4 정리