상세정보

리액트와 리액트 네이티브의 핵심 개념으로 시작해, 크로스 플랫폼 모바일 앱 제작에 필요한 다양한 기능뿐만 아니라 네이티브 모듈 제작, 디버깅, 성능 튜닝까지 고급 기법들을 다룬다. 리액트 네이티브는 페이스북의 오픈 소스 자바스크립트 라이브러리인 리액트를 기반으로 이미 친숙한 웹 기술을 사용하면서도 순수 네이티브 앱과 동일한 성능과 UI를 갖는 모바일 앱을 개발할 수 있도록 하는 라이브러리다.

리액트 네이티브는 페이스북의 오픈 소스 자바스크립트 라이브러리인 리액트를 기반으로 이미 친숙한 웹 기술을 사용하면서도 순수 네이티브 앱과 동일한 성능과 UI를 갖는 모바일 앱을 개발할 수 있도록 하는 라이브러리다. 이 책은 리액트와 리액트 네이티브의 핵심 개념으로 시작해, 크로스 플랫폼 모바일 앱 제작에 필요한 다양한 기능뿐만 아니라 네이티브 모듈 제작, 디버깅, 성능 튜닝까지 고급 기법들을 다룬다. 이 책 한 권으로 실전에 필요한 리액트 네이티브 기술을 모두 통달할 수 있을 것이다.

★ 이 책에서 다루는 내용 ★

■ 리액트 네이티브 컴포넌트와 API 활용
■ 리액트의 JSX 문법 학습
■ 리덕스와 리덕스 미들웨어를 사용한 데이터 관리
■ iOS와 안드로이드 모두를 위한 리액트 네이티브 앱 제작
■ 애니메이션 API를 사용한 애니메이션 효과 적용
■ 라우팅과 내비게이션의 비교
■ 자신만의 네이티브 모듈 제작
■ 플렉스박스를 사용한 레이아웃과 고급 애니메이션의 적용
■ 써드파티 라이브러리 통합과 커스텀 네이티브 컴포넌트 개발
■ 리덕스, 리덕스 미들웨어, 원격 API와의 조합을 통한 확장성 높은 데이터 중심의 앱 제작

★ 이 책의 대상 독자 ★

이 책은 독자가 자바스크립트를 충분히 이해하며 에크마스크립트(ECMAScript)2015(ES2015 또는 ES6)에 친숙하다고 가정한다. 이 책의 예제 코드는 클래스, 화살표 함수, 비구조화, 스프레드 연산 등 ES2015의 특징을 십분 활용하기 때문이다. 리액트, 모바일 개발, HTML, CSS에 능숙하면 도움이 되겠지만 필수 사항은 아니다.

★ 이 책의 구성 ★

1장, '리액트 기초 다지기'에서는 리액트의 전반을 설명하고 리액트 방식으로 사고하는 법을 알려준다. 효과적인 리액트 네이티브 작업을 위해서는 먼저 리액트의 이해가 필수다.
2장, '리액트 네이티브식 '헬로 월드!''에서는 리액트 네이티브의 작동 원리를 알아보고 다른 유명한 모바일 개발 플랫폼들과 비교해본다. 그 다음 컴퓨터에 iOS를 위한 리액트 네이티브 개발 환경을 구축하는 방법을 알려준다.
3장, '스타일과 레이아웃'에서는 리액트 네이티브에서는 캐스케이딩 스타일 시트(Cascading Style Sheets(CSS))의 장점 등을 포함해 웹 개발 세계로부터 많은 개념을 차용한다. 이와 동시에 CSS의 덜 바람직한 부분들은 철저히 배제한다. 또한 리액트 네이티브 앱에 스타일을 적용하는 방법과 컴포넌트 레이아웃을 위한 플렉스박스(Flexbox)의 사용법을 공부한다.
4장, '리액트 네이티브 컴포넌트'에서는 다수의 강력한 컴포넌트와 API를 제공한다. 또한 그런 컴포넌트와 API를 사용해 RNNYT라는 뉴스 리더 앱 제작을 시작한다.
5장, '플럭스와 리덕스'에서는 일반적인 모델-뷰-컨트롤러 패턴을 꺼려하며, 플럭스(Flux)라는 일방향 데이터 흐름 패턴을 선호한다. 5장에서는 플럭스의 사상을 이해하고, 유명한 플럭스 구현체인 리덕스(Redux)의 사용법을 배운다.
6장, 'NYT API와 리덕스의 통합'에서는 뉴스 리더 앱인 RNNYT에 생명을 불어넣기 위해 데이터 관리와 뉴욕 타임스 API 통신을 위한 리덕스와 리덕스 미들웨어를 구현해본다.
7장, '내비게이션과 고급 API'에서는 내비게이션의 여러 선택 사항 중 어느 방식을 선택해야 할지를 논의한다. 그 다음엔 NaviagtionExperimental이라는 컴포넌트와 그 밖의 다른 리액트 네이티브 API를 앱에 적용한다.
8장, '애니메이션과 제스처 리액트 네이티브'에서는 자연스러운 애니메이션을 만드는 두 가지 방법을 제공한다. 또한 RNNYT에 터치 제스처가 지원되는 온보딩 경험 구축을 통해 각 방법을 적용하는 방법을 설명한다.
9장, '안드로이드를 위한 리팩토링'에서는 크로스 플랫폼 개발을 쉽게 해준다. 그러나 안드로이드를 위한 개발 환경을 구성하는 일이 아주 쉽지만은 않다. 안드로이드 개발을 위해 필요한 모든 툴의 설치와 설정을 단계적으로 진행한다. 그 다음엔 앱을 크로스 플랫폼용으로 리팩토링해 일급 안드로이드 앱으로서의 면모를 갖추게 한다.
10장, '네이티브 모듈의 작성과 사용'에서는 iOS와 안드로이드를 위해 각각 오브젝티브-C와 자바로 커스텀 네이티브 코드를 작성하고 사용하는 방법을 설명한다. 놀라운 부분 중 하나는 이 프레임워크에 포함된 컴포넌트와 API만 사용하도록 제한을 두지 않는다는 점에 있다. 앱에 뭔가 평범하지 않은 기능을 넣고 싶다면, 커스텀 네이티브 코드를 만들어 연계하거나 써드파티 라이브러리를 포함시키면 된다.
11장, '앱 출시 준비'에서는 제스트(Jest)라는 테스트 프레임워크와 성가신 성능 문제를 적발할 수 있는 여러 툴을 소개한다. 마지막으로, iOS와 안드로이드의 스토어에 앱을 배포하는 방법을 설명한다.
12장, '리액트 네이티브 툴과 참고자료'에서는 리액트 네이티브 앱의 제작 경험을 증진시켜줄 여러 툴을 소개한다. 그 다음 웹, 맥 OS, 심지어 윈도우까지 지원하는 몇 가지 리액트 네이티브 프로젝트들을 알아본다.

정보제공 :

1장. 리액트 기초 다지기 

__프레임워크 또는 라이브러리 
__리액트 탄생의 배경 
__리액트 시작하기 
__JSX로 컴포넌트 작성 
__컴포넌트 
__컴포넌트 조합 
__속성과 속성 타입 
____속성받기 
____속성 타입 
____속성 전달 
____기본 속성값 
____Props.children 
__이벤트 핸들러 
__상태 
__컴포넌트 생명주기 
____컴포넌트 업데이트 
____컴포넌트 언마운트 
__컴포넌트 유형 
____React.createClass 
____함수형 컴포넌트 
__정리 

2장. 리액트 네이티브식 ''헬로 월드!'' 

__모바일 앱 개발 환경의 이해 
____어도비 폰갭 
____Ionic 
____NativeScript 
____리액트 네이티브 
__리액트 네이티브 툴의 이해 
____엑스코드구글 크롬 
____홈브류 
____노드JS와 npm 
____왓치맨 
____플로 
____리액트 네이티브 CLI 
__툴 설치 
____엑스코드 설치 
____홈브류 설치 
____노드와 npm 설치 
____왓치맨과 플로 설치 
____리액트 네이티브 CLI 설치 
__첫 번째 리액트 네이티브 앱 
____리액트 네이티브 패키저 
__HelloWorld 앱의 이해 
____ES2015 임포트문 
____HelloWorld 컴포넌트 
____스타일 부분 
____루트 컴포넌트 등록 
____React를 임포트하는 이유 
__리액트 네이티브 앱 디버깅 
____크롬 디버거 
____중단점 
__정리 

3장. 스타일과 레이아웃 리액트 네이티브 

__스타일 구성과 적용 
____인라인 스타일 
____스타일 객체 
__스타일시트 
____컴포넌트에 특정적인 스타일 속성 
__상속 없는 스타일링 
__박스 모델과 플렉스박스 
____박스 모델 
____플렉스박스 
____또 다른 축 다루기 
____크기 조절 
__텍스트 스타일링 
____텍스트 스타일 속성 
____텍스트 스타일 캡슐화 
__이미지 스타일링 
____배경 이미지 
__스타일 조사와 디버깅 
____리액트 네이티브 인스펙터 
__유사 미디어 쿼리 기능 추가 
____Dimensions 객체 
____onLayout 핸들러 
__정리 

4장. 리액트 네이티브 컴포넌트 리액트 네이티브 

__네이티브 컴포넌트 
____Text 
____View 
____Image 
____Touchable 
____ListView 
____Modal 
____WebView 
____TabBarIOS 
____TextInput 
____그 외의 입력 컴포넌트 
__네이티브 API 
____ActionSheetIOS 
____AlertVibration 
____StatusBar 
__정리 

5장. 플럭스와 리덕스 

__플럭스 아키텍처 
____Motivation 
____플럭스 구현하기 
__리덕스 시작하기 
____리덕스의 기본 원칙 
____리덕스 설치 
____리덕스 구현하기 
____리액트-리덕스 
____미들웨어 
__정리 

6장. NYT API와 리덕스의 통합 

__NYT API 데이터의 이해 
__리덕스 데이터의 흐름 
____리덕스 상태 트리 만들기 
____앱에 리덕스 데이터 연결하기 
____리팩토링과 리셰이핑 
____리셀렉트 도입 
____검색 기능 추가 
__비동기식 요청으로 NYT API 연결하기 
____iOS ATS에 대한 조치 
____ ‘당겨서 새로고침''과 ‘로딩 스피너'' 
__정리 

7장. 내비게이션과 고급 API 

__내비게이션 
____NavigatorIOS 
____Navigator 
____NavigationExperimental 
____내비게이션 API의 선택 
__Navigator의 사용 
____Navigator 컴포넌트 
____내비게이션바 
__NavigationExperimental의 사용 
____내비게이션 상태 표현하기 
____내비게이션 상태 관리 
____CardStack 컴포넌트 
____내비게이션 헤더 
____탭내비게이션 
____모달 추가 
__그 밖의 고급 API 
____NetInfo를 이용한 오프라인 메시지 
____Linking을 이용한 브라우저 열기 
____AsyncStorage를 이용한 북마크 저장 
__정리 

8장. 애니메이션과 제스처 

__LayoutAnimation과 Animated 소개 
__기본형 온보딩 구축 
____시작하기 
__LayoutAnimation 
____하나 더! 
__Animated 
____온보딩의 리팩토링 
____온보딩 경험에 Animated 추가 
____애니메이션 값 보정 
__PanResponder 적용 
____PanResponder 보완 
__정리 

9장. 안드로이드를 위한 리팩토링 

__툴 설치 
____JDK 설치 
____안드로이드 스튜디오 설치 
____ANDROID_HOME과 PATH 설정 
____안드로이드 에뮬레이터 실행 
__RNNYT에 안드로이드 지원 추가 
____플랫폼 로직의 분기 
____안드로이드를 위한 RNNYT 리팩토링 
__정리 

10장. 네이티브 모듈의 작성과 사용 

__네이티브 모듈 사용하기 
____네이티브 모듈 설치 
____아이콘 라이브러리 사용하기 
__네이티브 모듈 제작 
____iOS 네이티브 모듈 
____안드로이드 네이티브 모듈 
__정리 

11장. 앱 출시 준비 

__테스트 
____단위 테스트 
____컴포넌트 테스트 
__성능 
____말썽쟁이 ListView 
____낮은 반응의 터치와 느린 내비게이션 
____성능 관련 요약 
__실제 기기에서의 실행 
____iOS 디바이스에서의 디버깅 
____안드로이드 디바이스에서의 디버깅 
__앱 배포 
____디버깅 코드 제거 
____iOS 
____안드로이드 
__정리 

12장. 리액트 네이티브 툴과 참고자료 

__리액트 네이티브 에디터, 플러그인, IDE 
____아톰과 뉴클라이드 
__iOS와 안드로이드를 넘어 
____리액트 네이티브 웹 소개 
____리액트 네이티브 UWP 플러그인 
____리액트 네이티브 맥 OS 
__정리