<div id="readability-page-1" class="page"><div tabindex="-1" id="___gatsby"><main><div itemscope="" itemtype="http://schema.org/BlogPosting"><section><main><article><div id="post-content" itemprop="articleBody"><p>마침내 3편 내용을 정리할 시간이다.</p>
<p>1장. 클래스/함수형 컴포넌트</p>
<ul>
<li>새로운 프로젝트 소개</li>
<li>클래스와 함수 비교: 상태 관리, 고정 값</li>
<li>클래스와 함수: 리액트 컴포넌트</li>
<li>리액트 훅: 함수 컴포넌트에 UI 역할을 제공</li>
</ul>
<p>2장. 상태 훅</p>
<ul>
<li>문제</li>
<li>구현: 클로져, 배열</li>
<li>훅 구조와 규칙</li>
</ul>
<p>3장. 부수효과 훅</p>
<ul>
<li>문제 정의: 순서 함수와 컴포넌트</li>
<li>구현: 지연 실행, 의존성, 부수효과 정리</li>
<li>역할: 컴포넌트와 외부 환경 간의 동기화</li>
</ul>
<p>4장. 훅 활용 1</p>
<ul>
<li>적용: 메뉴 목록, 장바구니, 주문내역</li>
<li>달라진 점: 상태 관리, 부수효과 관리, 클래스를 함수로</li>
</ul>
<p>5장. 컨택스트 훅</p>
<ul>
<li>문제정의: 고차 컴포넌트와 훅</li>
<li>구현: 2편의 MyReact 활용</li>
<li>효과: 컨택스트 소비 방법 변화. 횡단 관심사 주입 방법 변화</li>
</ul>
<p>6장. 훅 활용 2</p>
<ul>
<li>적용: MyRouter, MyLayout</li>
<li>달라진 점: 컨택스트 사용 방법, 횡단 관심사 주입 방법</li>
</ul>
<p>--</p>
<p>남은 것</p>
<ul>
<li>레프 객체 다루기 (Dialog, OrderForm)</li>
<li>제어 폼</li>
<li>추가 훅 (useReducer, useMemo, useCallback)</li>
</ul></div></article></main></section></div></main></div></div>

김정환 블로그 RSS Feed

김정환

마침내 3편 내용을 정리할 시간이다. 1장. 클래스/함수형 컴포넌트 새로운 프로젝트 소개 클래스와 함수 비교: 상태 관리, 고정 값 클래스와 함수: 리액트 컴포넌트 리액트 훅: 함수 컴포넌트에 UI 역할을 제공…

[리액트 2부] 3편 최종정리

댓글