HOME > Detail View

Detail View

리액트 교과서 : 기본기에 충실한 리액트 입문서! (Loan 7 times)

Material type
단행본
Personal Author
Mardan, Azat 곽현철, 역
Title Statement
리액트 교과서 : 기본기에 충실한 리액트 입문서! / 아자트 마르단 지음 ; 곽현철 옮김
Publication, Distribution, etc
서울 :   길벗,   2018  
Physical Medium
672 p. : 삽화 ; 24 cm
Varied Title
React quickly : [painless web apps with React, JSX, REDUX, and GraphQL].
기타표제
React, JSX, Redux, GraphQL, Jest, 서버 사이드 렌더링을 이해하고 | 웹 애플리케이션에 실제로 적용하는 방법을 터득한다.
ISBN
9791160504828
General Note
색인수록  
부록: A. 이 책에서 사용한 애플리케이션 설치하기, B. React 치트시트, C. Express.js 치트시트. 외  
000 00000cam c2200205 c 4500
001 000045950622
005 20180816135414
007 ta
008 180816s2018 ulka b 001c kor
020 ▼a 9791160504828 ▼g 93000
035 ▼a (KERIS)BIB000014839014
040 ▼a 241018 ▼c 241018 ▼d 211009
041 1 ▼a kor ▼h eng
082 0 4 ▼a 006.76 ▼2 23
085 ▼a 006.76 ▼2 DDCK
090 ▼a 006.76 ▼b 2018z3
100 1 ▼a Mardan, Azat
245 1 0 ▼a 리액트 교과서 : ▼b 기본기에 충실한 리액트 입문서! / ▼d 아자트 마르단 지음 ; ▼e 곽현철 옮김
246 1 3 ▼a React, JSX, Redux, GraphQL, Jest, 서버 사이드 렌더링을 이해하고 | 웹 애플리케이션에 실제로 적용하는 방법을 터득한다.
246 1 9 ▼a React quickly : ▼b [painless web apps with React, JSX, REDUX, and GraphQL].
260 ▼a 서울 : ▼b 길벗, ▼c 2018
300 ▼a 672 p. : ▼b 삽화 ; ▼c 24 cm
500 ▼a 색인수록
500 ▼a 부록: A. 이 책에서 사용한 애플리케이션 설치하기, B. React 치트시트, C. Express.js 치트시트. 외
546 ▼a 영어로 된 원저작을 한국어로 번역
700 1 ▼a 곽현철, ▼e
900 1 0 ▼a 마르단, 아자트, ▼e

Holdings Information

No. Location Call Number Accession No. Availability Due Date Make a Reservation Service
No. 1 Location Sejong Academic Information Center/Science & Technology/ Call Number 006.76 2018z3 Accession No. 151342378 Availability Available Due Date Make a Reservation Service C

Contents information

Book Introduction

기본기에 충실한 리액트 입문서. React.js를 사용해 웹/모바일을 개발하고자 하는 웹/모바일 개발자, 소프트웨어 엔지니어를 대상으로 한다. 1부는 JSX, 상태 객체, 라이프사이클 이벤트, DOM 이벤트, jQuery UI 이벤트, 폼, 리액트 컴포넌트 같은 리액트의 핵심 개념을 다루고, 2부는 Webpack, React Router, Redux, GraphQL, Jest, Node.js, Express 같은 리액트 개발 생태계를 살펴본다. 그리고 각 부 마지막에 리액트를 경험해보고, 앞서 학습한 개념을 확고히 다질 수 있는 큰 프로젝트를 세 개씩 준비했다.

리액트와 관련 생태계를 이용한 풀 스택 웹/앱 개발!

왜 리액트인가?

React.js는 페이스북이 2013년에 오픈 소스로 공개한 이래 넷플릭스, 에어비앤비, 인스타그램 같은 유명 기업을 비롯한 많은 곳에서 사용되며 빠르게 성장했다. 리액트의 인기가 높았던 이유는 웹 사이트 어디서든 UI를 재사용하는 새로운 방식으로 프런트엔드 개발을 효율적으로 바꿔 놓았기 때문이다. 리액트는 최초로 템플릿 없이 순수하게 자바스크립트만으로 컴포넌트를 정의해 UI를 구성한다. 그리고 이 방법이 유지보수, 재사용, 확장하기도 더 쉽다는 사실을 입증했다.

리액트의 핵심 개념부터 관련 생태계를 활용한 현실적인 예제까지
1부에서 리액트의 핵심 개념을 살펴본다. 리액트의 특징, JSX, 리액트에서 컴포넌트, 이벤트, 폼을 다루는 방법을 배운다. 그리고 1부 마지막에 학습한 개념을 바탕으로 Menu, Tooltip, Timer 컴포넌트를 활용한 세 가지 프로젝트를 진행한다. 프로젝트를 통해 리액트의 중요 개념과 기술을 실제 업무에 사용해 본다고 가정하고 복습해볼 수 있다.

2부는 리액트 개발 생태계를 구성하는 친구들을 살펴본다. Webpack, Redux, GraphQL, Jest를 다루고, 리액트의 상태(state)와 프런트엔드, 백엔드를 모두 자바스크립트로 구성하는 유니버설 자바스크립트를 살펴본다. 학습한 다양한 기술을 종합적으로 사용해볼 수 있도록 역시 세 가지 프로젝트를 준비했다. 프로젝트를 통해 리액트에 대한 경험을 키우고 학습한 지식을 확고하게 정리할 수 있다.


Information Provided By: : Aladin

Author Introduction

아자트 마르단(지은이)

소규모 스타트업, 대기업, 미국 연방정부에서 데스크톱, 웹, 모바일 애플리케이션을 개발했다. 강의와 개발자 에반젤리스트 Developer Evangelist, 프로젝트 관리를 맡기도 했다. 지금은 샌프란시스코에 위치한 미국의 주요 은행 중 한 곳인 캐피탈 원 Capital One 에서 기술 펠로우 fellow 로 활동하고 있다. 14권 이상의 책을 출간했고, NodeUniversity (http://node.university)를 통해 17개 이상의 온라인 코스를 개설했다. 대부분 AWS 같은 클라우드 서비스와 React, 자바스크립트, Node.js에 관한 내용이다. 새로운 소식이나 업데이트, 팁을 알고 싶다면 소셜 미디어나 웹 사이트를 찾아주기 바란다. - 트위터 https://twitter.com/azat_co - 웹 사이트 http://azat.co - 링크드인 http://linkedin.com/in/azatm - 블로그 http://webapplog.com - 책 http://webapplog.com/books

곽현철(옮긴이)

NTS, 티몬에서 UI 개발자, 프런트엔드 개발자로 근무했고, 지금은 외국계 기업의 웹 서비스를 현지화하는 업무를 맡고 있습니다. 번역서로는 『리액트 교과서』, 『처음 시작하는 리액트』가 있습니다.

Information Provided By: : Aladin

Table of Contents

목차
1부 React 기초 = 33
 1장 React 살펴보기 = 35
  1.1 React란 무엇인가? = 37
  1.2 React가 해결할 수 있는 문제 = 38
  1.3 React의 장점 = 39
   1.3.1 간결성 = 40
   1.3.2 속도와 테스트 용이성 = 47
   1.3.3 React의 폭넓은 개발 커뮤니티와 생태계 = 49
  1.4 React의 단점 = 50
  1.5 웹 애플리케이션에 React 적용하기 = 51
   1.5.1 React 라이브러리와 렌더링 대상 = 52
   1.5.2 단일 페이지 애플리케이션과 React = 53
   1.5.3 React 개발 스택 = 56
  1.6 첫 번째 React 앱 만들기 : Hello World = 57
  1.7 퀴즈 = 63
  1.8 요약 = 63
  1.9 퀴즈 정답 = 64
 2장 React 첫걸음 = 65
  2.1 엘리먼트 중첩 = 66
  2.2 React 컴포넌트 클래스 생성 = 70
  2.3 React 속성 사용하기 = 74
  2.4 퀴즈 = 81
  2.5 요약 = 82
  2.6 퀴즈 정답 = 82
 3장 JSX = 83
  3.1 JSX의 정의와 장점 = 85
  3.2 JSX의 이해 = 89
   3.2.1 JSX로 React 엘리먼트 생성하기 = 89
   3.2.2 React 컴포넌트에 JSX 사용하기 = 90
   3.2.3 JSX에서 변수 출력하기 = 92
   3.2.4 JSX에서 속성 사용하기 = 94
   3.2.5 React 컴포넌트 메서드 생성하기 = 99
   3.2.6 JSX의 if/else 처리 = 101
   3.2.7 JSX의 주석 작성 방법 = 105
  3.3 Babel을 이용한 JSX 트랜스파일러 설정하기 = 106
  3.4 React와 JSX의 까다로운 부분 = 112
   3.4.1 특수문자 = 112
   3.4.2 data- 속성 = 114
   3.4.3 스타일 속성 = 114
   3.4.4 class와 for 속성 = 115
   3.4.5 불 값을 속성 값으로 사용하는 경우 = 116
  3.5 퀴즈 = 117
  3.6 요약 = 117
  3.7 퀴즈 정답 = 118
 4장 React 컴포넌트의 상태 객체 = 119
  4.1 React 컴포넌트의 상태란? = 122
  4.2 상태 객체 다루기 = 124
   4.2.1 상태 객체에 접근하기 = 124
   4.2.2 초기 상태 설정하기 = 126
   4.2.3 상태 갱신하기 = 128
  4.3 상태 객체와 속성 = 133
  4.4 상태비저장 컴포넌트 = 134
  4.5 상태비저장 컴포넌트와 상태저장 컴포넌트의 비교 1 = 137
  4.6 퀴즈 = 144
  4.7 요약 = 144
  4.8 퀴즈 정답 = 145
 5장 React 컴포넌트 라이프사이클 이벤트 = 147
  5.1 React 컴포넌트 라이프사이클 이벤트 한눈에 살펴보기 = 148
  5.2 이벤트 분류 = 149
  5.3 이벤트 구현 = 153
  5.4 모든 이벤트 실행하기 = 155
  5.5 마운팅 이벤트 = 158
   5.5.1 componentWillMount() = 159
   5.5.2 componentDidMount() = 159
  5.6 갱신 이벤트 = 163
   5.6.1 componentWillReceiveProps(newProps) = 164
   5.6.2 shouldComponentUpdate() = 165
   5.6.3 componentWillUpdate() = 165
   5.6.4 componentDidUpdate() = 165
  5.7 언마운팅 이벤트 = 166
   5.7.1 componentWillUnmount() = 166
  5.8 간단한 예제 = 166
  5.9 퀴즈 = 171
  5.10 요약 = 172
  5.11 퀴즈 정답 = 173
 6장 React에서 이벤트 다루기 = 175
  6.1 React에서 DOM 이벤트 다루기 = 176
   6.1.1 캡처 및 버블링 단계 = 179
   6.1.2 React 이벤트 살펴보기 = 182
   6.1.3 React 합성 이벤트 객체 다루기 = 186
   6.1.4 이벤트와 상태 사용하기 = 191
   6.1.5 이벤트 핸들러를 속성으로 전달하기 = 193
   6.1.6 컴포넌트 간의 데이터 교환 = 196
  6.2 React가 지원하지 않는 DOM 이벤트 처리하기 = 199
  6.3 React를 다른 라이브러리와 통합하기 : jQuery UI 이벤트 = 202
   6.3.1 버튼 통합하기 = 203
   6.3.2 라벨 통합하기 = 205
  6.4 퀴즈 = 207
  6.5 요약 = 208
  6.6 퀴즈 정답 = 208
 7장 React에서 폼 다루기 = 209
  7.1 React에서 폼을 다루기 위한 권장 방법 = 210
   7.1.1 React에서 폼과 이벤트 정의하기 = 213
   7.1.2 폼 요소 정의하기 = 215
   7.1.3 변경 감지하기 = 223
   7.1.4 대출 신청서의 계좌번호 영역 만들기 = 225
  7.2 폼을 다루는 다른 방법 = 228
   7.2.1 비제어 엘리먼트에서 변경 감지하기 = 229
   7.2.2 비제어 엘리먼트에서 이벤트를 감지하지 않는 경우 = 231
   7.2.3 값에 참조로 접근하기 = 231
   7.2.4 기본값 설정하기 = 235
  7.3 퀴즈 = 236
  7.4 요약 = 237
  7.5 퀴즈 정답 = 238
 8장 확장성을 고려한 React 컴포넌트 = 239
  8.1 컴포넌트의 기본 속성 = 240
  8.2 React 속성 타입과 유효성 검사 = 243
  8.3 자식 엘리먼트 렌더링 = 251
  8.4 코드 재사용을 위한 React 고차 컴포넌트 생성하기 = 255
   8.4.1 displayName을 이용한 자식 컴포넌트와 부모 컴포넌트의 구분 = 258
   8.4.2 펼침 연산자를 사용해서 모든 속성 전달하기 = 259
   8.4.3 고차 컴포넌트 사용하기 = 260
  8.5 모범 사례 : 프레젠테이션 컴포넌트와 컨테이너 컴포넌트 = 263
  8.6 퀴즈 = 265
  8.7 요약 = 265
  8.8 퀴즈 정답 = 266
 9장 프로젝트 : Menu 컴포넌트 = 267
  9.1 프로젝트 구조와 개발 환경 준비하기 = 269
  9.2 JSX를 사용하지 않고 만드는 Menu 컴포넌트 = 270
   9.2.1 Menu 컴포넌트 = 271
   9.2.2 Link 컴포넌트 = 274
   9.2.3 메뉴 작동시키기 = 277
  9.3 JSX로 만드는 Menu 컴포넌트 = 279
   9.3.1 Menu 컴포넌트 리팩토링 = 281
   9.3.2 Link 컴포넌트 리팩토링 = 282
   9.3.3 JSX 프로젝트 실행하기 = 283
  9.4 과제 = 285
  9.5 요약 = 285
 10장 프로젝트 : Tooltip 컴포넌트 = 287
  10.1 프로젝트 구조와 개발 환경 준비하기 = 289
  10.2 Tooltip 컴포넌트 = 291
   10.2.1 toggle() 메서드 = 292
   10.2.2 render() 메서드 = 293
  10.3 실행하기 = 296
  10.4 과제 = 297
  10.5 요약 = 298
 11장 프로젝트 : Timer 컴포넌트 = 299
  11.1 프로젝트 구조와 개발 환경 준비하기 = 301
  11.2 앱 아키텍처 = 303
  11.3 TimerWrapper 컴포넌트 = 306
  11.4 Timer 컴포넌트 = 311
  11.5 Button 컴포넌트 = 313
  11.6 실행하기 = 315
  11.7 과제 = 316
  11.8 요약 = 317
2부 React 아키텍처 = 319
 12장 Webpack 빌드 도구 = 321
  12.1 Webpack의 역할 = 322
  12.2 프로젝트에 Webpack 적용하기 = 324
   12.2.1 Webpack과 의존 모듈 설치 = 326
   12.2.2 Webpack 설정 = 329
  12.3 코드 모듈화 = 330
  12.4 Webpack의 실행과 빌드 테스트 = 333
  12.5 핫 모듈 대체 = 335
   12.5.1 HMR 설정 방법 = 337
   12.5.2 HMR 실행 = 341
  12.6 퀴즈 = 342
  12.7 요약 = 343
  12.8 퀴즈 정답 = 343
 13장 React 라우팅 = 345
  13.1 라우터를 처음부터 구현하기 = 347
   13.1.1 프로젝트 설정 = 348
   13.1.2 app.jsx에서 경로 맵핑 생성하기 = 350
   13.1.3 router.jsx 파일에 Router 컴포넌트 생성하기 = 351
  13.2 React Router = 353
   13.2.1 JSX로 React Router 사용하기 = 357
   13.2.2 해시 히스토리 = 359
   13.2.3 브라우저 히스토리 = 360
   13.2.4 React Router를 사용하기 위한 Webpack 설정 = 362
   13.2.5 레이아웃 컴포넌트 생성하기 = 365
  13.3 React Router의 기능과 패턴 = 369
   13.3.1 withRouter 고차 컴포넌트를 이용해서 라우터에 접근하기 = 369
   13.3.2 프로그래밍적으로 페이지 이동하기 = 370
   13.3.3 URL 매개변수와 데이터 전달 = 371
   13.3.4 React Router에서 속성 전달하기 = 373
  13.4 Backbone을 이용한 라우팅 = 374
  13.5 퀴즈 = 378
  13.6 요약 = 379
  13.7 퀴즈 정답 = 379
 14장 Redux를 이용한 데이터 다루기 = 381
  14.1 React의 단방향 데이터 흐름 지원 = 382
  14.2 Flux 데이터 아키텍처의 이해 = 385
  14.3 Redux 데이터 라이브러리 사용하기 = 388
   14.3.1 Redux를 이용한 넷플릭스 따라잡기 = 390
   14.3.2 의존 모듈과 빌드 설정 = 392
   14.3.3 Redux 사용하기 = 396
   14.3.4 라우팅 = 397
   14.3.5 리듀서 결합하기 = 400
   14.3.6 영화 목록 리듀서 = 401
   14.3.7 액션 = 404
   14.3.8 액션 생성자 = 405
   14.3.9 컴포넌트를 스토어에 연결하기 = 407
   14.3.10 스토어에 액션 전달하기 = 410
   14.3.11 컴포넌트 속성으로 액션 생성자 전달하기 = 411
   14.3.12 넷플릭스 앱 실행하기 = 417
   14.3.13 Redux 요약 정리 = 418
  14.4 퀴즈 = 419
  14.5 요약 = 419
  14.6 퀴즈 정답 = 420
 15장 GraphQL을 이용한 데이터 다루기 = 421
  15.1 GraphQL = 423
  15.2 넷플릭스 앱에 백엔드 추가하기 = 425
   15.2.1 서버에 GraphQL 설치하기 = 428
   15.2.2 데이터 구조 = 431
   15.2.3 GraphQL 스키마 = 433
   15.2.4 API를 호출하여 응답을 스토어에 저장하기 = 436
   15.2.5 영화 목록 보여주기 = 441
   15.2.6 GraphQL 요약 정리 = 443
  15.3 퀴즈 = 444
  15.4 요약 = 445
  15.5 퀴즈 정답 = 445
 16장 Jest를 이용한 React 단위 테스트 = 447
  16.1 테스트의 종류 = 449
  16.2 Jest와 다른 테스트 프레임워크의 비교 = 450
  16.3 Jest를 이용한 단위 테스트 = 452
   16.3.1 Jest 단위 테스트 작성 = 454
   16.3.2 Jest 어써션 = 456
  16.4 Jest와 TestUtils를 이용한 UI 테스트 = 458
   16.4.1 TestUtils를 이용한 엘리먼트 탐색 = 462
   16.4.2 패스워드 위젯을 위한 UI 테스트 = 463
   16.4.3 얕은 렌더링 = 468
  16.5 TestUtils 요약 정리 = 470
  16.6 퀴즈 = 471
  16.7 요약 = 472
  16.8 퀴즈 정답 = 472
 17장 React와 Node.js를 이용한 유니버셜 자바스크립트 = 473
  17.1 React를 서버에서 사용하는 이유와 유니버셜 자바스크립트의 이해 = 475
   17.1.1 적절한 페이지 색인 = 475
   17.1.2 더 나은 성능과 빠른 속도 = 477
   17.1.3 더 나은 코드 유지보수 = 478
   17.1.4 React와 Node.js를 이용한 유니버셜 자바스크립트 = 478
  17.2 Node.js와 React = 481
  17.3 React와 Express : 컴포넌트를 이용한 서버 측 렌더링 = 485
   17.3.1 서버에서 간단한 텍스트 렌더링하기 = 486
   17.3.2 HTML 페이지 렌더링 = 487
  17.4 Express와 React를 이용한 유니버셜 자바스크립트 = 495
   17.4.1 프로젝트 구조와 설정 = 498
   17.4.2 서버 설정 = 499
   17.4.3 Handlebars를 이용한 서버 측 레이아웃 템플릿 = 505
   17.4.4 서버에서 React 컴포넌트 구성하기 = 507
   17.4.5 클라이언트 측의 React 코드 = 510
   17.4.6 Webpack 설정 = 511
   17.4.7 앱 실행하기 = 513
  17.5 퀴즈 = 518
  17.6 요약 = 519
  17.7 퀴즈 정답 = 520
 18장 프로젝트 : React Router를 이용한 서점 만들기 = 521
  18.1 프로젝트 구조와 Webpack 설정 = 525
  18.2 주 HTML 파일 = 529
  18.3 컴포넌트 생성하기 = 530
   18.3.1 메인 파일 : app.jsx = 530
   18.3.2 Cart 컴포넌트 = 539
   18.3.3 Checkout 컴포넌트 = 541
   18.3.4 Modal 컴포넌트 = 542
   18.3.5 Product 컴포넌트 = 544
  18.4 프로젝트 실행하기 = 546
  18.5 과제 = 547
  18.6 요약 = 547
 19장 프로젝트 : Jest를 이용한 비밀번호 검사 = 549
  19.1 프로젝트 구조와 Webpack 설정 = 552
  19.2 주 HTML 파일 = 556
  19.3 비밀번호 모듈 구현하기 = 557
   19.3.1 테스트 작성 = 557
   19.3.2 코드 구현 = 559
  19.4 Password 컴포넌트 구현하기 = 561
   19.4.1 테스트 작성 = 561
   19.4.2 코드 구현 = 562
  19.5 실행하기 = 571
  19.6 과제 = 572
  19.7 요약 = 573
 20장 프로젝트 : Jest, Express, MongoDB를 이용한 자동완성 컴포넌트 구현 = 575
  20.1 프로젝트 구조와 Webpack 설정 = 579
  20.2 웹 서버 구현하기 = 584
   20.2.1 RESTful API 정의하기 = 585
   20.2.2 서버에서 React 렌더링하기 = 587
  20.3 브라우저 스크립트 추가하기 = 588
  20.4 서버 템플릿 생성하기 = 589
  20.5 Autocomplete 컴포넌트 구현하기 = 590
   20.5.1 Autocomplete 컴포넌트를 위한 테스트 = 590
   20.5.2 Autocomplete 컴포넌트 코드 = 592
  20.6 실행하기 = 596
  20.7 과제 = 599
  20.8 요약 = 599
부록 A. 이 책에서 사용한 애플리케이션 설치하기 = 602
부록 B. React 치트시트 = 613
부록 C. Express.js 치트시트 = 622
부록 D. MongoDB와 Mongoose 치트시트 = 629
부록 E. 성공을 위한 ES6 = 634
부록 F. 서점 예제로 살펴보는 React Router v4 = 651
부록 G. React 버전 16.3의 변경 사항 = 655
찾아보기 = 667

New Arrivals Books in Related Fields

Baumer, Benjamin (2021)
데이터분석과인공지능활용편찬위원회 (2021)
Harrison, Matt (2021)