책소개
타입스크립트, ECMAScript 6와 친해지는 실전 앵귤러 입문서!
새로운 기술을 배울 때 결과물이 없다면 쉽게 지치기 마련이다. 이 책은 1부 기초 다지기, 2부 기본기 향상하기, 3부 깊이 들어가기로 나누어 앵귤러를 설명하고 실제 프로젝트인 상품 관리 애플리케이션을 결과물로 만든다. 앵귤러를 시작하는 데 가장 큰 걸림돌인 타입스크립트를 쉽게 설명하여 학습 부담을 줄여주며, 저자의 실무 경험을 적극 살려 실무에 꼭 필요한 개념과 실수하기 쉬운 부분을 자세히 설명한다.
■ 출판사 서평
★ 더 쉽게, 더 꼼꼼하게, 더 실무에 가깝게!
새로운 프레임워크가 등장하면 이를 공부하고 장점을 설명하는 사람이 많습니다. 그러나 이를 실제 업무에서 바로 적용할 수 있는 사람은 그리 많지 않습니다. 이 책은 실제 업무에서 앵귤러를 도입하였던 저자의 경험을 바탕으로 합니다.
자료가 너무 부족해 직접 고민하고 부딪히며 과제를 해결해야 했고 그 덕에 더 꼼꼼하게, 더 쉽게, 더 실무에 가깝게 앵귤러를 이야기할 수 있게 되었습니다. 또한 지루하고 식상한 코드에서 벗어나고자 고민하였습니다.
\"이 책은 전적으로 프로젝트의 경험에서 나온 산물입니다. 단순히 호기심으로 앵귤러를 살펴봤다면 지금과 같이 깊이 들여다 보지 않았을 것입니다. 프로젝트를 하면서 만난 다양한 이슈도 앵귤러를 어떻게 하면 더 잘 사용할 수 있을지 많은 생각을 남겨 주었습니다. 이러한 고민들이 큰 덩어리가 되어 하나의 책이 되었습니다.\" - 지은이의 말 중에서
★ 주요 내용
- 앵귤러 프레임워크 전체 구조
- 앵귤러 CLI를 활용한 애플리케이션 개발 방법
- 앵귤러 생태계의 다양한 서드파티 라이브러리 활용
- 파이어베이스를 사용한 앵귤러 웹 애플리케이션 배포
추천사
\"Node.js와 타입스크립트를 몰라도 앵귤러를 배울 수 있는 책. 국내 출간된 앵귤러 도서 중에 가장 쉽고 친절하다!\" - 이요셉
\"뻔하고 흔한 예제가 아닌 재밌고 참신한 예제로 가득하다 보니 자칫 지루하고 따분하게 느껴질 수 있는 프레임워크를 조금 더 즐겁게 배울 수 있었습니다. 후반부에는 파이어베이스를 통해 간단히 결과물을 낼 수 있어 흥미를 유발하기에 이만한 책이 없구나 느꼈습니다.\" - 장현석
\"예제 중심으로 따라 하기 쉬워, 앵귤러에 관심 있거나 요즘 프론트엔드 개발의 첫발을 내딛고자 한다면 좋은 선택지가 될 것입니다.\" - 최수원
\"AngularJS(1.x)를 경험하고 버전 2로 넘어오기를 망설이다가 버전 4가 릴리스된 시점에 베타리딩으로 이 책을 읽게 되었습니다. 버전 1을 학습할 때는 공식 문서와 조각조각 설명된 블로그 글이 전부였는데 이렇게 정제된 책을 보니 머릿속에 체계적으로 정리되는 느낌입니다. 앵귤러를 처음 접하는 분과 버전 1에서 넘어오는 분 모두에게 좋은 시작점이 될 책이라고 생각합니다.\" - 최동원
관련 서적 (제목 + ISBN)
● 모던 웹을 위한 Node.js 프로그래밍, 3판 (9788968482946)
● 모던 웹을 위한 JavaScript+jQuery 입문, 3판 (9788968483554)
● 모던 웹 디자인을 위한 HTML5+CSS3 입문, 개정판 (9788968481611)
목차
PART I 기초 다지기
CHAPTER 1 앵귤러 준비하기
1.1 Node.js
1.2 NPM 다루기
__1.2.1 패키지 설치
__1.2.2 실습: welcome-msg-app
__1.2.3 패키지와 의존 관계
__1.2.4 로컬 환경과 전역 환경
__1.2.5 package.json
1.3 마치며
CHAPTER 2 앵귤러 시작하기
2.1 타입스크립트
__2.1.1 타입 언어
__2.1.2 상위 언어
__2.1.3 열린 언어
__2.1.4 에디터 설정
2.2 Hello, Angular
__2.2.1 ng new
__2.2.2 ng serve
__2.2.3 ng test
__2.2.4 타입 선언 정보
2.3 마치며
CHAPTER 3 앵귤러 아키텍처
3.1 뷰를 구성하는 요소
__3.1.1 컴포넌트와 템플릿
__3.1.2 컴포넌트 생명 주기
__3.1.3 컴포넌트 트리
__3.1.4 데이터 바인딩
__3.1.5 마치며
3.2 애플리케이션을 완벽하게 만드는 요소
__3.2.1 서비스와 의존성 주입
__3.2.2 상태 관리 및 공유
__3.2.3 지시자
__3.2.4 파이프
__3.2.5 모듈
3.3 머티리얼 패키지 적용
3.4 마치며
PART II 기본기 향상하기
CHAPTER 4 뷰를 구성하는 기초
4.1 컴포넌트
__4.1.1 컴포넌트의 선언
__4.1.2 메타데이터
__4.1.3 부트스트래핑
__4.1.4 컴포넌트 트리
4.2 템플릿
__4.2.1 절차적 방식과 선언적 방식
__4.2.2 데이터 바인딩
__4.2.3 지시자
__4.2.4 파이프
4.3 마치며
CHAPTER 5 견고한 애플리케이션 만들기
5.1 서비스
__5.1.1 서비스의 생성과 사용
__5.1.2 실습: 마우스 위치 로거
__5.1.3 싱글턴으로서의 서비스
5.2 의존성 주입
__5.2.1 Injectable, Inject 데코레이터
__5.2.2 providers
__5.2.3 의존성 주입기 트리
__5.2.4 Host, Optional 데코레이터
5.3 테스트 코드 작성
__5.3.1 서비스 테스트
__5.3.2 컴포넌트 테스트
5.4 디버깅
5.5 마치며
CHAPTER 6 컴포넌트 고급
6.1 독립된 요소: 컴포넌트
__6.1.1 웹 컴포넌트
__6.1.2 컴포넌트와 스타일 정보
__6.1.3 컴포넌트의 독립성을 깨뜨리는 안티패턴
6.2 컴포넌트 간 상태 공유와 이벤트 전파
__6.2.1 부모-자식 컴포넌트 간의 통신
__6.2.2 실습: 컴포넌트 통신 V2
__6.2.3 다양한 상태 공유 시나리오
__6.2.4 싱글턴 서비스를 이용한 상태 공유
6.3 앵귤러 방식의 템플릿 요소 탐색
__6.3.1 ViewChild를 사용한 요소 탐색
__6.3.2 템플릿 참조 변수와 ElementRef
__6.3.3 Content Projection과 ContentChild를 사용한 요소 탐색
6.4 컴포넌트 생명 주기
__6.4.1 ngOnInit과 ngOnDestroy
__6.4.2 ngAfterContentInit과 ngAfterViewInit
__6.4.3 ngOnChanges
__6.4.4 ngDoCheck
__6.4.5 ngAfterContentChecked와 ngAfterViewChecked
__6.4.6 지시자의 생명 주기
6.5 마치며
CHAPTER 7 HTTP 통신과 RxJS
7.1 HttpModule과 Http 서비스 기초
__7.1.1 실습: 초간단 사용자 조회 애플리케이션
__7.1.2 angular-in-memory-web-api 활용
7.2 RxJS
__7.2.1 왜 RxJS인가?
__7.2.2 RxJS 원리
__7.2.3 RxJS 연산자 활용
__7.2.4 RxJS를 활용한 마우스 위치 로거 코드 개선
7.3 게이트웨이 기반 Http 서비스 활용
__7.3.1 ApiGateway 서비스
__7.3.2 실습: 사용자 관리 애플리케이션
__7.3.3 HTTP 통신 관련 중복 코드 제거
7.4 마치며
CHAPTER 8 폼 다루기
8.1 폼의 구성
__8.1.1 폼 모델
__8.1.2 AbstractControl과 폼의 값 상태
__8.1.3 폼 지시자
__8.1.4 실습: NgModel과 FormControl
8.2 템플릿 주도 폼
__8.2.1 ngModel과 양방향 바인딩
__8.2.2 실습: 템플릿 주도 폼
__8.2.3 폼 유효성 검증
__8.2.4 커스텀 Validator 지시자 작성
8.3 반응형 폼(모델 주도 폼)
__8.3.1 ReactiveFormsModule
__8.3.2 FormBuilder
__8.3.3 FormGroup, FormControlName
__8.3.4 실습: 반응형 폼
__8.3.5 실습: 동적 폼
8.4 마치며
CHAPTER 9 앵귤러 동작 원리
9.1 부트스트랩과 컴파일
__9.1.1 애플리케이션의 최초 진입점
__9.1.2 JIT 컴파일
__9.1.3 AOT 컴파일
__9.1.4 부트스트랩 과정 분석
9.2 Zone.js와 변화 감지
__9.2.1 앵귤러를 움직이게 만드는 세 가지 이벤트
__9.2.2 Zone.js를 활용한 비동기 코드 감지
__9.2.3 상태 변화를 일으키는 세 가지 이벤트
__9.2.4 변화 감지 트리와 변화 감지 전략
9.3 마치며
PART III 깊이 들어가기
CHAPTER 10 프로젝트: 상품 관리 애플리케이션 구성
10.1 애플리케이션 설계
__10.1.1 기능 정의 및 도메인 모델
__10.1.2 컴포넌트 트리
10.2 프로젝트 구성
10.3 프로젝트 구현 1: 기본 레이아웃 구현
__10.3.1 주요 컴포넌트 생성
__10.3.2 컴포넌트 구현 코드
__10.3.3 라우터 없이 사이드바 기능 구현
10.4 마치며
CHAPTER 11 모듈과 라우터
11.1 모듈의 분리
__11.1.1 기능 모듈
__11.1.2 핵심 모듈
__11.1.3 모듈의 imports, exports
__11.1.4 프로젝트 구현 2: 도메인별 기본 구현
11.2 라우터 기본
__11.2.1 라우터 설정: Route
__11.2.2 Routes 등록
__11.2.3 RouterLink, RouterLinkActive
__11.2.5 프로젝트 구현 3: 라우터 설정
__11.2.6 라우터 사용의 장점
11.3 라우터 활용
__11.3.1 상태 관리
__11.3.2 Router
__11.3.3 ActivatedRoute
__11.3.4 가드의 설정
11.4 모듈별 라우터
__11.4.1 컴포넌트 경로
__11.4.2 라우팅 설정 분리하기
__11.4.3 프로젝트 구현 4: 라우터 설정 분리
11.5 마치며
CHAPTER 12 프로젝트: 파이어베이스 사용
12.1 파이어베이스 사용
__12.1.1 프로젝트 생성
__12.1.2 파이어베이스 CLI
__12.1.3 파이어베이스 연동
12.2 프로젝트 구현 5
__12.2.1 도메인 모델 클래스 구현
__12.2.2 사용자 세션 기능 구현
12.3 프로젝트 구현 6
__12.3.1 실시간 데이터베이스 사용
__12.3.2 NoCounterService 구현
__12.3.3 DataStoreService 구현
__12.3.4 파이어베이스 보안 규칙 설정
12.4 마치며
CHAPTER 13 프로젝트: 상품 관리 애플리케이션 구현 최종
13.1 프로젝트 구현 7
__13.1.1 카테고리 관리 뷰
__13.1.2 CategoryDetailComponent
__13.1.3 CategoryDetailResolverService
__13.1.4 CategoryItemComponent
__13.1.5 CategoryManagementComponent
__13.1.6 CategoryListResolverService
13.2 프로젝트 구현 8
__13.2.1 상품 관리 뷰
__13.2.2 ProductDetailComponent
__13.2.3 ProductDetailResolverService
__13.2.4 ProductListComponent
__13.2.5 ProductListResolverService
__13.2.6 CheckedProductSetService
__13.2.7 ButtonGroupComponent
__13.2.8 ProductBulkUpdaterService
__13.2.9 ProductManagementComponent
13.3 프로젝트 최종 구현
__13.3.1 MainDashboardComponent
__13.2.2 스피너
__13.3.3 상품 상태 파이프
__13.3.4 CanDeactivate 가드 설정
__13.3.5 세션 가드
13.4 마치며
부록. 자바스크립트의 진화: ES6(ECMAScript 6)
1. ES6 표준의 의미
2. 모듈 시스템
3. 모듈 번들러
4. 실습: area-calculator
