리액트 인 액션

PART 1 리액트 소개 1
CHAPTER 1 리액트를 만나다 3
1.1 리액트 시작하기 4
1.2 리액트가 적합하지 않은 경우 10
1.3 가상 DOM 15
1.4 컴포넌트: 리액트의 기본 단위 20
1.5 팀을 위한 리액트 23
1.6 요약 24
CHAPTER 2 첫 번째 컴포넌트 26
2.1 리액트의 컴포넌트에 대해 알아보기 28
2.2 리액트 컴포넌트 개발하기 36
2.3 컴포넌트의 수명과 시간 49
2.4 JSX와의 첫 만남 60
2.5 요약 64

PART 2 리액트의 컴포넌트와 데이터 67
CHAPTER 3 리액트의 데이터와 데이터 흐름 69
3.1 상태 69
3.2 리액트에서의 상태 76
3.3 컴포넌트 간의 통신 86
3.4 단방향 데이터 흐름 87
3.5 요약 90
CHAPTER 4 리액트의 렌더링과 생명주기 메서드 91
4.1 레터스 소셜 저장소 셋업하기 92
4.2 렌더링 과정과 생명주기 메서드 97
4.3 레터스 소셜 앱 개발 시작하기 118
4.4 요약 126
CHAPTER 5 폼 다루기 128
5.1 포스트 생성하기 129
5.2 폼 다루기 133
5.3 새 포스트 생성하기 145
5.4 요약 147
CHAPTER 6 서드파티 라이브러리의 통합 148
6.1 레터스 소셜 API에 포스트 전송하기 149
6.2 지도를 이용해 컴포넌트를 개선하기 151
6.3 요약 172
CHAPTER 7 리액트의 라우팅 173
7.1 라우팅의 기초 174
7.2 라우터 구현하기 177
7.3 요약 192
CHAPTER 8 고급 라우팅과 파이어베이스의 통합 194
8.1 라우터 사용하기 195
8.2 파이어베이스와의 통합 208
8.3 요약 216
CHAPTER 9 리액트 컴포넌트의 테스트 217
9.1 테스트의 종류 220
9.2 Jest, Enzyme, React-test-renderer를 이용한 리액트 컴포넌트의 테스트 223
9.3 처음 작성하는 테스트 코드 225
9.4 요약 245

PART 3 리액트 애플리케이션 아키텍처 247
CHAPTER 10 리덕스 애플리케이션 아키텍처 249
10.1 플럭스 애플리케이션 아키텍처 251
10.2 리덕스 액션 생성하기 258
10.3 요약 280
CHAPTER 11 리액트에 리덕스 통합하기 282
11.1 리듀서는 상태가 어떻게 변경되어야 하는지를 결정한다 283
11.2 리액트에 리덕스 통합하기 299
11.3 요약 312
CHAPTER 12 서버 측 리액트와 리액트 라우터 314
12.1 서버 측 렌더링이란? 316
12.2 왜 서버에서 렌더링을 해야 할까? 320
12.3 SSR이 필요하지 않은 경우 323
12.4 서버에서 컴포넌트 렌더링하기 324
12.5 리액트 라우터 라이브러리 331
12.6 리액트 라우터로 인증 라우트 처리하기 337
12.7 데이터를 포함한 서버 측 렌더링 341
12.8 요약 352
CHAPTER 13 리액트 네이티브 소개 354
13.1 리액트 네이티브 355
13.2 리액트와 리액트 네이티브 358
13.3 언제 리액트 네이티브를 사용할 것인가? 361
13.4 세상에서 제일 간단한 ‘Hello World’ 앱 363
13.5 앞으로의 여정 367
13.6 요약 368

부록: 리액트 16.3 이후 생명주기 메서드 변경 사항 370

리액트의 멘탈 모델이 강력한 이유는 무엇일까? 이 모델은 컴퓨터 공학 및 소프트웨어 엔지니어링 기법의 깊숙한 영역과 결부되어 있다. 리액트의 멘탈 모델은 함수적(functional) 개념과 객체지향(object-oriented)을 결합하고 있으며, 컴포넌트를 UI 개발의 주요 단위로 보고 있다.

리액트의 상태를 조금 더 잘 이해할 수 있도록 하기 위해 ‘상태’라는 것이 무엇인지 일단 생각해 보자. 지금까지 프로그램 내의 상태에 대해 생각해 보거나 들어본 적이 없다 하더라도 최소한 예전에 본 적은 있을 것이다. 지금까지 여러분이 작성했던 대부분의 프로그램들은 일종의 상태를 가지고 있다. Vue.js, 앵귤러 혹은 엠버 등의 프런트엔드 프레임워크를 사용해 본 적이 없다 하더라도 분명 상태의 개념을 가지고 있는 UI를 작성해 봤을 것이다.