실전 프로젝트로 배우는 AngularJS

▣ 01장: 단일 페이지 애플리케이션 개발 준비
1-1. 개발 도구 설치
- 깃 설치
- 노드 설치
- 요맨 설치
- 서브라임 텍스트 편집기 설치
1-2. 단일 페이지 애플리케이션 생성
- yo generator 선택과 설치
- Yo를 이용한 ToDo 애플리케이션 생성
1-3. 애플리케이션 컴포넌트 생성
- 앵귤러를 위한 index.html 설정 이해하기
- yo를 이용한 앵귤러 컨트롤러 추가
- bower를 이용한 앵귤러 지시자 추가
1-4. 애플리케이션 테스트 및 빌드
- grunt를 이용한 테스트
- grunt를 이용한 배포
정리

▣ 02장: AngularJS 프레임워크 이해
2-1. MV* 프레임워크
2-2. 양방향 데이터 바인딩
- 스코프 내부와 상속 관계
- MyToDo 애플리케이션에서 양방향 데이터 바인딩
- 스코프 생명 주기(Life Cycle)
- 그 외 $scope 객체 메서드
2-3. 의존성 주입(DI, Dependency Injection)
2-4. 클라이언트 템플릿
2-5. 지시자(Directive)
- 지시자가 DOM에 적용되는 순서
- 지시자 정의
- 지시자의 스코프 객체의 범위 종류
- Template, TemplateUrl, TemplateCache, replace와 ng-template 사용
- compile, link의 $watch 등록을 이용한 양방향 데이터 바인딩
- controller, require와 link 네 번째 파라미터와의 관계
- transclude, ng-transclude 사용
2-6. 테스트 프레임워크(단위, E2E)
- 카르마 기반 단위 테스트
- 프로트랙터 기반 E2E 테스트
정리

▣ 03장: 싱글 페이지 애플리케이션 기획및 생성
3-1. 애플리케이션 기획
- 메인 페이지
- 그룹 정보 페이지
- 그룹 활동 페이지
- 설문 생성 페이지
3-2. 애플리케이션 제너레이터 설계
- 애플리케이션의 폴더 구조 전략
- 애플리케이션 제너레이터 선정
- 앵귤러 코드 스타일 전략
- 스타일 가이드에 따른 제너레이터 템플릿 수정 방법
- IE8 지원을 위한 index.html 설정
3-3. SPA 생성
- 애플리케이션의 모듈 구성
- 라우팅 설정 방식
3-4. 단위 업무를 위한 앵귤러 컴포넌트 조합
- $resource를 통한 REST 모델 사용
- promise와 $q Async 호출에 대한 이해
정리

▣ 04장: 애플리케이션을 위한 공통 프레임워크 개발
4-1. 공통 프레임워크 모듈 개발
- 다국어 처리
- 메시지 처리
- 팝업 메시지창 지시자
- HTTP 에러 처리
- 사용자 정의 Bower 컴포넌트 등록
- 로컬 저장소 서비스
- 유틸리티 지시자
4-2. 로그인 화면 개발
- 트위터 부트스트랩 기반의 화면 디자인 및 폰트 사용
- 폼 유효성(Form Validation) 검사
- 인증을 위한 토큰과 쿠키
4-3. OAuth를 이용한 인증 처리
- 백엔드에서 Passport 모듈을 이용한 인증 처리
- 페이스북 인증 처리
- 크롬 브라우저 개발자 도구를 이용한 클라이언트 디버깅
- 노드 인스팩터를 이용한 서버 디버깅
정리 235

▣ 05장: 메인 페이지 개발
5-1. 백엔드 API 개발
- REST API 별 서버 모듈 조합
- 노드 모듈의 exports 이해
- 몽고디비와 몽구스 이해
- 서버 모델 개발
- 그룹 REST API 개발
- 포스트맨을 이용한 REST API 검증
- 백엔드 단위 테스트 수행
5-2. 메인 화면 개발
- 공통 컴포넌트 재구성
- 메인 화면 레이아웃 개발
- 그룹 생성
5-3. 그룹 목록 및 정보 표현
정리

▣ 06장: 그룹 페이지 개발
6-1. 그룹 정보 페이지
- 그룹 상세 정보 조회
- 그룹 프로필 이미지 변경
- 그룹 가입, 탈퇴
6-2. 그룹 활동 페이지
- 그룹 활동 화면 레이아웃 개발
- 그룹 멤버 목록 표현
6-3. 설문 카드 생성
- 설문 카드 생성
- 카드 지시자 개발
6-4. 설문 종류별 카드 표현
6-5. 설문 응답 및 결과 표현
정리

▣ 07장: 실시간 반응 개발
7-1. Socket.IO 기반 실시간 연동
- 노드 기반 백엔드 Socket.IO
- AngularJS 기반 프런트엔드 Socket.IO
- 상단 알림 메뉴 추가
7-2. 카드 목록 UX 개선
- 카드에 동영상 추가
- 무한 스크롤 적용
- 애니메이션 효과 적용
7-3. AngularJS 성능 옵션
- 일회 바인딩
- ngModelOptions 지시자
- 디버깅 정보 비활성화
- $applyAsync 적용
정리