Skip to content

Commit c814819

Browse files
committed
3장 info 작성
1 parent 2f50d7f commit c814819

3 files changed

Lines changed: 78 additions & 8 deletions

File tree

.DS_Store

0 Bytes
Binary file not shown.

chapter02/wogus216.md

Lines changed: 13 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -665,15 +665,15 @@ componentDidcatch 두개의 인수를 받는데, 첫번째는 getDerivedStateFro
665665
1. 최초 렌더링
666666
2. 리렌더링: 최소 렌더링이 발생한 이후로 발생하는 모든 렌더링을 의미
667667

668+
리렌더링 발생하는 경우는 다음과 같다.
668669

669-
리렌더링 발생하는 경우는 다음과 같다.
670-
* 클래스형 setState가 실행되는 경우: state의 변화는 컴포넌트 상태의 변화를 의미
671-
* 클래스형 forceUpdate가 실행되는 경우
672-
* 함수형 useState 두 번째 배열요소 setter가 실행되는 경우
673-
* 함수형 useReducer 두 번째 배열요소 dispatch가 실행되는 경우: useReducer도 useState와 마찬가지로 상태를 업데이트 함수를 배열로 제공
674-
* 컴포넌트의 key props가 변경되는 경우: 리액트에서 Key는 리렌더링이 발생하는 동안 형제요소들 사이에서 동일한 요소를 식별하는 값.
675-
* props가 변경되는 경우: 부모로 전달 받는 값이 props가 달라지면 자식 컴포넌트 변경이 필요
676-
* 부모 컴포넌트가 렌더링될 경우
670+
- 클래스형 setState가 실행되는 경우: state의 변화는 컴포넌트 상태의 변화를 의미
671+
- 클래스형 forceUpdate가 실행되는 경우
672+
- 함수형 useState 두 번째 배열요소 setter가 실행되는 경우
673+
- 함수형 useReducer 두 번째 배열요소 dispatch가 실행되는 경우: useReducer도 useState와 마찬가지로 상태를 업데이트 함수를 배열로 제공
674+
- 컴포넌트의 key props가 변경되는 경우: 리액트에서 Key는 리렌더링이 발생하는 동안 형제요소들 사이에서 동일한 요소를 식별하는 값.
675+
- props가 변경되는 경우: 부모로 전달 받는 값이 props가 달라지면 자식 컴포넌트 변경이 필요
676+
- 부모 컴포넌트가 렌더링될 경우
677677

678678
### 2.4.3 리액트의 렌더링 프로세스
679679

@@ -750,5 +750,10 @@ memo나 다른 메모제이션 방법을 사용하는 것이 이점이 있을
750750
- 리액트가 구 트리와 신규 트리를 비교
751751

752752
얼핏 봐도 memo를 하지 않았을 때 치러야할 잠재적인 위험비용이 더 커보인다.
753+
정리하자면 메모제이션은 하지 않는 것 보다 메모이제이션을 했을 때 더 많은 이점을 누린다.
754+
755+
> 예제의 차이를 이해해보자
753756
754757
### 2.5.3 결론 및 정리
758+
759+
꼼꼼히 확인 하고 써보거나 쓰면서 계속 체크를 하는 둘 중 하나 방법

chapter03/info.md

Lines changed: 65 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,65 @@
1+
# 03장: 리액트 훅 깊게 살펴보기
2+
3+
리액트를 이루는 핵심 요소들을 깊게 살펴보고, 리액트의 렌더링 과정을 이해하는 장입니다.
4+
5+
<br>
6+
7+
- [03장: 리액트 훅 깊게 살펴보기](#03장-리액트-훅-깊게-살펴보기)
8+
- [3.1 리액트 훅 깊게 살펴보기](#31-리액트-훅-깊게-살펴보기)
9+
- [3.1.1 useState](#311-usestate)
10+
- [3.1.2 useEffect](#312-useeffect)
11+
- [3.1.3 useMemo](#313-usememo)
12+
- [3.1.4 useCallback](#314-usecallback)
13+
- [3.1.5 useRef](#315-useref)
14+
- [3.1.6 useContext](#316-usecontext)
15+
- [3.1.7 useReducer](#317-usereducer)
16+
- [3.1.8 useImperativeHandle](#318-useimperativehandle)
17+
- [3.1.9 useLayoutEffect](#319-uselayouteffect)
18+
- [3.1.10 useDebugValue](#3110-usedebugvalue)
19+
- [3.1.11 훅의 규칙](#3111-훅의-규칙)
20+
- [3.1.12 정리](#3112-정리)
21+
- [3.2 사용자 정의 훅과 고차 컴포넌트 중 무엇을 써야 할까?](#32-사용자-정의-훅과-고차-컴포넌트-중-무엇을-써야-할까)
22+
- [3.2.1 사용자 정의 훅](#321-사용자-정의-훅)
23+
- [3.2.2 고차 컴포넌트](#322-고차-컴포넌트)
24+
- [3.2.3 사용자 정의 훅과 고차 컴포넌트 중 무엇을 써야 할까?](#323-사용자-정의-훅과-고차-컴포넌트-중-무엇을-써야-할까)
25+
- [3.2.4 정리](#324-정리)
26+
27+
<br>
28+
29+
## 3.1 리액트 훅 깊게 살펴보기
30+
31+
### 3.1.1 useState
32+
33+
### 3.1.2 useEffect
34+
35+
### 3.1.3 useMemo
36+
37+
### 3.1.4 useCallback
38+
39+
### 3.1.5 useRef
40+
41+
### 3.1.6 useContext
42+
43+
### 3.1.7 useReducer
44+
45+
### 3.1.8 useImperativeHandle
46+
47+
### 3.1.9 useLayoutEffect
48+
49+
### 3.1.10 useDebugValue
50+
51+
### 3.1.11 훅의 규칙
52+
53+
### 3.1.12 정리
54+
55+
<br>
56+
57+
## 3.2 사용자 정의 훅과 고차 컴포넌트 중 무엇을 써야 할까?
58+
59+
### 3.2.1 사용자 정의 훅
60+
61+
### 3.2.2 고차 컴포넌트
62+
63+
### 3.2.3 사용자 정의 훅과 고차 컴포넌트 중 무엇을 써야 할까?
64+
65+
### 3.2.4 정리

0 commit comments

Comments
 (0)