이미지 검색을 사용해 보세요
검색창 이전화면 이전화면
최근 검색어
인기 검색어

소득공제
리액트 & 리액트 네이티브 통합 교과서
웹과 네이티브 모바일 개발을 위한 실전 활용법
베스트
IT 모바일 top100 3주
가격
35,000
10 31,500
YES포인트?
1,750원 (5%)
5만원 이상 구매 시 2천원 추가 적립
결제혜택
카드/간편결제 혜택을 확인하세요

이미 소장하고 있다면 판매해 보세요.

  •  국내배송만 가능
  •  문화비소득공제 가능

이 분야의 이벤트

프로그래밍 언어 시리즈

책소개

목차

1장. 왜 리액트인가?
__리액트란?
____리액트는 단지 뷰다
__단순성이 좋다
__선언적 UI 구조
__시간과 데이터
__성능 문제
__올바른 추상화 수준
__리액트 16의 변경 사항
____핵심 아키텍처 개선
____생명주기 메서드
____컨텍스트 API
____프래그먼트 렌더링
____목록과 문자열을 렌더링
__요약

2장. JSX 렌더링
__JSX란 무엇인가?
____Hello JSX
____선언적 UI 구조
__HTML과 같은
____내장 HTML 태그
____HTML 태그 규약
__UI 구조 설명
__자신의 JSX 요소 생성
____HTML 캡슐화
____중첩 요소
____네임스페이스 컴포넌트
__자바스크립트 표현 사용
____동적 프로퍼티 값과 텍스트
____컬렉션을 요소에 매핑
__JSX의 프래그먼트
____래퍼 요소
____프래그먼트를 사용해 불필요한 태그 제거
__요약

3장. 컴포넌트 프로퍼티, 상태 그리고 컨텍스트
__컴포넌트 상태란 무엇인가?
__컴포넌트 프로퍼티란 무엇인가?
__컴포넌트 상태 설정
____초기 컴포넌트 상태
____컴포넌트 상태 설정
____컴포넌트 상태 병합
__프로퍼티 값 전달하기
____기본 프로퍼티 값
____프로퍼티 값 설정
__무상태 컴포넌트
____순수 함수형 컴포넌트
____함수형 컴포넌트 기본값
__컨테이너 컴포넌트
__컨텍스트 제공 및 사용
__요약

4장. 이벤트 핸들링 - 리액트 방식
__이벤트 핸들러 선언
____핸들러 함수 선언
____다중 이벤트 핸들러
____제네릭 핸들러 임포트
__이벤트 핸들러 컨텍스트와 매개변수
____Auto-binding context
____컴포넌트 데이터 가져오기
__고차 이벤트 핸들러
__인라인 이벤트 핸들러
__요소에 핸들러를 바인딩
__통합 이벤트 객체
__이벤트 풀링
__요약

5장. 재사용할 수 있는 컴포넌트 제작
__재사용할 수 있는 HTML 요소
__일체형 컴포넌트의 어려움
____JSX 마크업
____초기 상태와 상태 헬퍼
____이벤트 핸들러 구현
__컴포넌트 구조 리팩토링
____JSX로 시작
____article 목록 컴포넌트 구현
____article 항목 컴포넌트 구현
____article 컴포넌트 추가 기능 구현
____함수형 컴포넌트 만들기
__렌더 프롭 활용
__컴포넌트 트리 렌더링
__기능 컴포넌트와 유틸리티 컴포넌트
__요약

6장. 리액트 컴포넌트 생명주기
__컴포넌트는 왜 생명주기가 필요한가?
__프로퍼티와 상태 초기화하기
____컴포넌트 데이터 가져오기
____프로퍼티로 상태 초기화하기
____프로퍼티로 상태 업데이트하기
__렌더링 효율 최적화
____렌더링 여부 결정
____렌더링 최적화를 위한 메타데이터의 사용
__명령형 컴포넌트 렌더링
____제이쿼리 UI 위젯 렌더링
__컴포넌트의 후처리
____비동기 호출 정리
____에러 경계
__요약

7장. 컴포넌트 프로퍼티 검증
__예측 값 파악
__이동 가능한 컴포넌트
__간단한 프로퍼티 검증기
____기본 유형 검증
____값 요청
____any 프로퍼티 값
__유형과 값 검사기
____렌더링될 수 있는 것
____특정 유형 요청
____특정 값을 요청
__커스텀 프로퍼티 검증기 구현
__요약

8장. 컴포넌트 확장
__컴포넌트 상속
____상태 상속
____프로퍼티 상속
____JSX 및 이벤트 핸들러 상속
__고차 컴포넌트 구성
____조건부 컴포넌트 렌더링
____데이터 소스 제공
__요약

9장. 라우트를 통한 내비게이션 처리
__라우트 선언
____헬로 라우트
____라우트 선언 분리
____부모와 자식 라우트
__라우터 매개변수 처리
____라우트의 리소스 ID
____선택적 매개변수
__링크 컴포넌트 사용
____기본 링크
____URL 및 쿼리 매개변수
__요약

10장. 서버단 리액트 컴포넌트
__동형 자바스크립트란 무엇인가?
____서버는 렌더링 대상이다
____초기 로드 성능
____백엔드와 프론트엔드 간의 코드 공유
__문자열로 렌더링
__백엔드 라우팅
__프론트엔드 조정
__데이터 가져오기
__요약

11장. 모바일 우선 리액트 컴포넌트
__모바일 우선 디자인의 근거
__React-bootstrap 컴포넌트 사용
____내비게이션 구현
____목록
____폼
__요약

12장. 왜 리액트 네이티브인가?
__리액트 네이티브는 무엇인가?
__리액트와 JSX는 익숙하다
__모바일 브라우저 경험
__같으면서 다른 안드로이드와 iOS
__모바일 웹 애플리케이션 사례
__요약

13장. 리액트 네이티브 프로젝트 시작하기
__create-react-native-app 설치하고 사용하기
__리액트 네이티브 앱 생성하기
__앱 실행하기
__Expo 설치하고 사용하기
__시뮬레이터 사용하기
____iOS 시뮬레이터
____안드로이드 시뮬레이터
__요약

14장. 플렉스박스로 반응형 레이아웃 만들기
__플렉스박스는 새로운 레이아웃 표준이다
__리액트 네이티브 스타일 소개하기
__플렉스박스 레이아웃 만들기
____단순한 세 열 레이아웃
____개선된 세 열 레이아웃
____유연한 행
____유연한 그리드
____유연한 행과 열
__요약

15장. 화면 탐색하기
__탐색 기초
__라우트 인자
__탐색 헤더
__탭과 드로워 탐색
__상태 다루기
__요약

16장. 항목 목록 렌더링하기
__데이터 컬렉션 렌더링하기
__목록 정렬하고 필터링하기
__목록 데이터 가져오기
__지연 목록 로딩
__요약

17장. 프로그레스 보여주기
__진행 상황과 사용성
__프로그레스 표시하기
__프로그레스 측정하기
__탐색 인디케이터
__단계 프로그레스
__요약

18장. 지오로케이션과 맵
__내 위치는 어디인가?
__주변에는 무엇이 있을까?
__가볼 만한 곳 주석달기
____포인트 배치하기
____오버레이 배치하기
__요약


19장. 사용자 입력받기
__텍스트 입력받기
__목록 옵션 선택하기
__온/오프 토글링하기
__날짜/시간 입력받기
__요약


20장. 알림, 통지, 확인
__중요한 정보
__사용자 확인받기
____성공 확인
____에러 확인
__수동적 통지
__액티비티 모달
__요약


21장. 사용자 제스처에 대응하기
__손가락으로 스크롤하기
__터치 피드백주기
__스와이프 가능과 취소 가능
__요약


22장. 이미지 출력 제어하기
__이미지 로딩하기
__이미지 리사이즈하기
__이미지 지연 로딩하기
__아이콘 렌더링하기
__요약


23장. 오프라인의 세계로
__네트워크 상태 감지하기
__애플리케이션 데이터 저장하기
__애플리케이션 데이터 동기화하기
__요약


24장. 애플리케이션 상태 다루기
__정보 아키텍처와 플럭스
____단일 방향성
____동기식 업데이트 라운드
____예측 가능한 상태 변환
__통합 정보 아키텍처
__리덕스 구현하기
____초기 애플리케이션 상태
____스토어 생성하기
____스토어 프로바이더와 라우트
____앱 컴포넌트
____Home 컴포넌트
____모바일 앱에서의 상태
__아키텍처 확장하기
__요약


25장. 왜 릴레이와 그래프QL인가?
__또 다른 접근법?
__새로운 용어들
__선언형 데이터 의존성
__애플리케이션 상태 변형하기
__그래프QL 백엔드와 마이크로서비스
__요약
__TodoMVC와 릴레이


26장. 릴레이 리액트 앱 구현하기
__그래프QL 스키마
__릴레이 부트스트래핑하기
__Todo 항목 추가하기
__Todo 항목 렌더링하기
__Todo 항목 완성하기
__요약

저자 소개 3

아담 보두치

관심작가 알림신청
 

Adam Boduch

거의 10년 동안 대규모 자바스크립트 개발 작업에 참여해왔다. 프론트엔드로 옮기기 전에는 파이썬과 리눅스를 사용하는 여러 가지 대규모 클라우드 컴퓨팅 제품을 연구했다. 복잡성을 잘 알고 있으면서 실제 소프트웨어 시스템과 이들이 제기하는 확장 문제에 대한 실질적인 경험을 갖고 있다. 『리액트 & 리액트 네이티브 통합 교과서』(에이콘, 2019)를 비롯한 여러 자바스크립트 서적을 저술했으며, 혁신적인 사용자 경험과 고성능을 추구하는 데 열정적이다.

아담 보두치의 다른 상품

경희대학교 컴퓨터공학과를 다녔으며, 자바스크립트 및 제이쿼리를 사용해 여러 웹 프로젝트를 진행해왔다. 더욱 체계적인 웹 개발을 위해 찾아보던 중 리액트를 접하게 됐으며 이 기술에 흥미를 느껴 웹 프론트엔드 개발자로 전향하게 됐다. 가상 DOM, 컴포넌트 등 리액트만의 여러 특징은 제이쿼리로만 개발하던 그 동안의 나의 웹 개발의 패러다임에 변화와 활력을 줬다. 현재도 리액트를 사용해서 SNS 개발을 진행하고 있으며, 리액트 네이티브로 토이 프로젝트를 진행 중이다. 추후 리액트와 리액트 네이티브를 사용해 다양한 서비스를 출시하는 것이 개인적인 목표다.
18여 년간 마이크로소프트, IBM, 야후와 스타트업등에서 소프트웨어 개발자, 컨설턴트를 거쳤다. 커리어를 윈도우 애플리케이션 개발자로 시작했기에 『찰스 페졸드의 WPF』(에이콘, 2007) 등을 출간하며 플랫폼 전문성을 가지는 것으로 방향을 잡았지만 웹과 모바일로의 플랫폼 확장의 시대에서는 강제 적응 모드에 들어갈 수밖에 없게 됐다. 아직도 많은 것을 지속적으로 배워야 하는 IT 바닥이 야속하기도 하지만 새로운 기술이 나올 때마다 다시 젊은 개발자로 돌아간 것 같은 느낌이 드는 것은 그나마 매력이다.

품목정보

발행일
2019년 07월 22일
쪽수, 무게, 크기
592쪽 | 188*235*28mm
ISBN13
9791161753195

출판사 리뷰

이 책의 구성 및 특징은 다음과 같다.

1장, ‘왜 리액트인가?’에서는 리액트가 무엇인지, 왜 사용하고 싶은지에 대해 알아본다.
2장, ‘JSX 렌더링’에서는 JSX가 리액트에서 콘텐트를 렌더링할 때 사용하는 구문이라는 것에 대해 알아본다. HTML이 가장 보편적인 결과지만 JSX를 사용하면 네이티브 UI 컴포넌트 등을 렌더링할 수 있다.
3장, ‘컴포넌트 프로퍼티, 상태 그리고 컨텍스트’에서는 프로퍼티가 컴포넌트에 전달되는 방법과 상태가 변경될 때 컴포넌트를 재렌더링하는 방법에 대해 알아본다.
4장, ‘이벤트 핸들링-리액트 방식’에서는 리액트의 이벤트가 JSX에서 구체화된다는 것과 리액트가 이벤트를 어떻게 처리하고 코드가 해당 이벤트에 어떻게 반응해야 하는지에 대해 알아본다.
5장, ‘재사용할 수 있는 컴포넌트 제작’에서는 컴포넌트가 종종 더 작은 컴포넌트들을 사용해 구성된다는 것에 대해 알아본다. 이는 데이터 및 동작을 하위 컴포넌트에 올바르게 전달해야 한다는 것을 의미한다.
6장, ‘리액트 컴포넌트 생명주기’에서는 리액트 컴포넌트가 어떻게 만들어지고 파괴되는지에 대해 알아본다. 이에는 네트워크에서 데이터를 가져오는 것과 같은 여러 다른 생명주기(Lifecycle) 이벤트가 있다.
7장, ‘컴포넌트 프로퍼티 검증’에서는 리액트에 컴포넌트로 전달되는 프로퍼티 유형의 유효성을 검사하는 메커니즘이 있다는 것을 알아본다. 이를 통해 컴포넌트에 예기치 못한 값이 전달되지 않는다는 사실을 확인할 수 있다.
8장, ‘컴포넌트 확장’에서는 컴포넌트를 확장하는 데 사용되는 메커니즘에 대해 소개한다. 이는 상속과 고차 컴포넌트(higher-order components)를 포함한다.
9장, ‘라우트를 통한 내비게이션 처리’에서는 내비게이션이 모든 웹 애플리케이션의 본질적인 부분이라는 것에 대해 알아본다. 리액트는 리액트 라우터 패키지(react-router package)를 사용해 라우트를 선언적으로 처리한다.
10장, ‘서버단 리액트 컴포넌트’는 브라우저에서 리액트가 컴포넌트를 DOM에 렌더링하는 방법을 논의한다. 또한 컴포넌트를 문자열로 렌더링할 수도 있는데 이는 서버에서 페이지를 렌더링하고 브라우저에 정적 콘텐트를 전달할 때 유용하다.
11장, ‘모바일 우선 리액트 컴포넌트’에서는 모바일 웹 애플리케이션은 데스크톱 화면 해상도를 위해 설계된 웹 애플리케이션과는 근본적으로 다르다는 것에 대해 알아본다. 리액트 부트스트랩 패키지(react-bootstrap package)를 사용하면 UI를 모바일 환경에서 만들 수 있다.
12장, ‘왜 리액트 네이티브인가?’에서는 리액트 네이티브가 모바일을 위한 리액트라는 것에 대해 알아본다. 리액트에 대한 경험이 있다면 똑같은 기술을 통해 향상된 모바일 경험을 제공할 수 있다.
13장, ‘리액트 네이티브 프로젝트 시작하기’에서는 어느 누구도 보일러플레이트 코드 작성이나 프로젝트 디렉터리 설정을 좋아하지 않는다는 것에 대해 알아본다. 리액트 네이티브에는 이러한 작업을 자동화하는 도구가 존재한다.
14장, ‘플렉스박스로 반응형 레이아웃 만들기’에서는 플렉스박스(Flexbox) 레이아웃 모델이 CSS를 사용하는 웹 UI 레이아웃에서 인기 있는 이유를 알아본다. 리액트 네이티브는 레이아웃 화면과 동일한 메커니즘을 사용한다.
15장, ‘화면 탐색하기’에서는 탐색은 웹 애플리케이션의 중요한 부분이지만 모바일 애플리케이션은 사용자가 화면에서 화면으로 이동하는 방식을 처리하는 도구가 필요하다는 것에 대해 알아본다.
16장, ‘항목 목록 렌더링하기’에서는 리액트 네이티브에서는 항목 목록을 완벽하게 렌더링해주는 목록 뷰 컴포넌트가 있다는 것에 대해 알아본다. 단순히 데이터 소스를 제공하면 나머지는 알아서 처리한다.
17장, ‘프로그레스 보여주기’에서는 프로그레스 바가 일의 진행률을 보여주는 데 매우 훌륭하다는 것에 대해 알아본다. 얼마나 걸리는지 모를 경우 프로그레스 인디케이터를 사용하라. 리액트 네이티브에는 두 가지 컴포넌트가 모두 있다.
18장, ‘지오로케이션과 맵’에서는 react-native-maps 패키지가 리액트 네이티브에 매핑 기능을 제공하는 것에 대해 일아본다. 웹 애플리케이션에서 사용되는 지오로케이션 API는 리액트 네이티브에서 직접 제공된다.
19장, ‘사용자 입력받기’에서는 대부분의 애플리케이션이 사용자로부터 입력을 받아야 한다는 것에 대해 알아본다. 이는 모바일 애플리케이션에서도 다르지 않으며 리액트 네이티브는 HTML 폼 요소들과 같은 다양한 제어 기능을 제공한다.
20장, ‘알림, 통지, 확인’에서는 알림(Alert)은 사용자에게 중요한 일이 발생했다는 것, 통지(Notification)는 눈에 띄지 않는 업데이트라는 것, 확인(Confirmation)은 즉각적인 응답을 얻는 데 사용된다는 것에 대해 알아본다.
21장, ‘사용자 제스처에 대응하기’에서는 모바일 장치에서의 제스처가 브라우저에서 올바르게 동작하기 어렵다는 것에 대해 알아본다. 이와 반대로 네이티브 앱은 스와이프, 터치 등에 대해 훨씬 더 나은 경험을 제공할 수 있다. 리액트 네이티브는 많은 세부 사항을 처리한다.
22장, ‘이미지 출력 제어하기’에서는 이미지가 아이콘, 로고 또는 사물의 사진이 대부분의 애플리케이션에서 얼마나 중요한 역할을 하는지에 대해 알아본다. 리액트 네이티브는 이미지 로드, 사이즈 조정 및 적절하게 배치하기 위한 도구를 제공한다.
23장, ‘오프라인의 세계로’에서는 모바일 장치의 네트워크 연결이 불안정한 경향이 있다는 것에 대해 알아본다. 따라서 모바일 앱은 임시 오프라인 상태를 처리할 수 있어야 한다. 이를 위해 리액트 네이티브에는 로컬 스토리가 API가 있다.
24장, ‘애플리케이션 상태 다루기’에서는 애플리케이션 상태가 웹이나 모바일을 포함한 모든 리액트 애플리케이션에서 얼마나 중요한지에 대해 알아본다. 이것이 바로 리덕스 및 Immutable.js와 같은 라이브러리를 이해하는 것이 중요한 이유다.
25장, ‘왜 릴레이 및 그래프QL인가?’에서는 릴레이와 그래프QL을 함께 사용해 대규모 상태를 처리하는 새로운 접근법에 대해 알아본다. 이는 질의 및 변형 언어이며 리액트 컴포넌트를 감싸는 라이브러리다.
26장, ‘릴레이 리액트 앱 구현하기’에서는 릴레이와 그래프QL의 진정한 이점은 상태 스키마가 웹과 네이티브 버전의 애플리케이션 간에 공유된다는 것에 있다는 점을 알아본다.

리뷰/한줄평3

리뷰

6.0 리뷰 총점

한줄평

6.0 한줄평 총점

클린봇이 부적절한 글을 감지 중입니다.

설정