| sitelink1 | |
|---|---|
| sitelink2 | |
| sitelink3 |
SNS 앱 예제로 배우는 프로그레시브 웹 앱
출간/배본가능일 2020년 7월 31일
Chapter 01 시작하기
1.1 자바스크립트와 웹 기술의 발전
1.2 프로그레시브 웹 앱(PWA)이란?
1.3 네이티브 앱 vs 웹 앱 vs 하이브리드 앱 vs 프로그레시브 웹 앱
Chapter 02 실습을 위한 개발 환경 준비하기
2.1 Node.js 설치하기
2.2 Visual Studio Code 설치하기
2.3 실습 소스코드 준비하기
Chapter 03 프로그레시브 웹 앱이 되기 위한 준비
3.1 Paper 파악하기
3.2 Paper에 PWA 불어넣기
Chapter 04 PWA의 핵심, 서비스 워커
4.1 서비스 워커란?
4.2 서비스 워커 등록하기
4.3 서비스 워커의 기능 이벤트
4.4 서비스 워커에서 브라우저 요청 가로채기
4.5 서비스 워커의 생명주기
4.6 서비스 워커의 상태
Chapter 05 오프라인을 위한 캐시 스토리지
5.1 캐시 스토리지란?
5.2 웹 페이지 리소스 캐싱하기
5.3 캐시에서 응답하기
5.4 캐시 관리하기
5.5 다양한 캐싱 전략
5.6 오프라인 상태 알리기
Chapter 06 IndexedDB 사용하기
6.1 IndexedDB란?
6.2 데이터베이스 생성하기
6.3 객체 저장소 (ObjectStore)
6.4 트랜잭션 (Transaction)
6.5 Paper에 적용하기
Chapter 07 웹 앱 매니페스트 (Web App Manifest)
7.1 웹 앱 매니페스트란?
7.2 웹 앱 매니페스트 살펴보기
7.3 홈 화면에 Paper 설치하기
Chapter 08 Sync, 백그라운드 동기화
8.1 백그라운드 동기화 살펴보기
8.2 동기화 작업을 위한 저장소 만들기
8.3 백그라운드 동기화 기능 구현하기
8.4 백그라운드 동기화 개선하기
Chapter 09 서비스 워커와 클라이언트 간 메시지 주고받기
9.1 Paper의 문제 파악하기
9.2 서비스 워커에서 웹 페이지로 메시지 보내기
9.3 웹 페이지에서 서비스 워커로 메시지 보내기
9.4 메시지 채널을 통해 메시지 주고받기
Chapter 10 Push, 사용자에게 알림 보내기
10.1 푸시란?
10.2 웹 푸시 살펴보기
10.3 알림 API (Notification API)
10.4 푸시 알림 준비하기
10.5 푸시 알림 보내기
10.6 마무리하며
Chapter 11 부록
11.1 ES6 자바스크립트 맛보기
11.2 라이트하우스 (Lighthouse)
11.3 워크박스 (Workbox)
Do it! 프로그레시브 웹앱 만들기 (반응형 웹 개발부터 하이브리드 앱 배포까지 PWA 완전 정복!)
발행 : 2020.08.06.
====================
첫째마당 프로그레시브 웹앱 시작하기
====================
[01] 헬로! 프로그레시브 웹앱
01-1 프로그레시브 웹앱이 뭐예요?
01-2 프로그레시브 웹앱을 대표하는 6가지 핵심 기술
01-3 비주얼 스튜디오 코드 설치하기
01-4 ‘안녕하세요’ 예제 만들기
[02] 모던 자바스크립트 꼭 필요한 것만 배우기
02-1 재활용할 수 있는 블록 함수
02-2 변수 선언
02-3 화살표 함수
02-4 모듈 내보내기와 가져오기
02-5 콜백 함수와 비동기 처리 방식
02-6 JSON과 Fetch API
02-7 Promise와 비동기 처리 방식
02-8 await 연산자와 async 비동기 함수
미션 코딩! 입력된 숫자의 범주 판별하기
[03] 순수 자바스크립트로 PWA 만들기
03-1 ‘안녕하세요! PWA by JS’ 구경하기
03-2 매니페스트 작성하기
03-3 메인 화면 작성하기
03-4 서비스 워커 만들고 실행하기
미션 코딩! 캐시 변경하고 서비스 워커 다시 등록하기
====================
둘째마당 프레임워크로 PWA 손쉽게 디자인하기
====================
[04] 뷰 기초 쌓기
04-1 뷰, 자바스크립트 프레임워크의 절대 강자
04-2 ‘안녕하세요!’ 예제 만들기
04-3 단방향 바인딩과 v-bind 디렉티브
04-4 양방향 바인딩과 v-model 디렉티브
04-5 조건 판단과 v-if, v-else 디렉티브
04-6 반복문과 v-for 디렉티브
04-7 이벤트 핸들러 실행과 v-on 디렉티브
미션 코딩! v-for 디렉티브로 고객 정보 출력하기
[05] 뷰 고급 기능 익히기
05-1 복잡한 로직과 computed 속성
05-2 이벤트 핸들러 로직과 methods 속성
05-3 컴포넌트로 HTML 엘리먼트 만들기
05-4 컴포넌트 속성 props
05-5 상탯값 관리와 Vuex
05-6 내비게이션과 라우터
05-7 새로 고침이 필요 없는 SPA 만들기
미션 코딩! 카운터 컴포넌트 프로그램 만들기
[06] 뷰티파이 기초 쌓기
06-1 뷰티파이, 뷰 최고의 UI 프레임워크
06-2 기본 레이아웃 만들기 1
06-3 기본 레이아웃 만들기 2
06-4 카드 UI 만들기
06-5 그리드 기본 원리
06-6 반응형 그리드
06-7 리스트와 아이콘 사용법
미션 코딩! 플로팅 버튼 UI 컴포넌트 넣기
[07] 뷰티파이 고급 기능 익히기
07-1 바닥 내비게이션
07-2 탐색 서랍
07-3 라우터로 멀티 페이지 관리하는 SPA 만들기
07-4 Vuex로 상탯값 관리하는 SPA 만들기
미션 코딩! 매개변수만으로 상탯값 관리하기
[08] 뷰 프레임워크로 PWA 만들기
08-1 ‘반가워요! PWA by VueJS’ 구경하기
08-2 프로젝트 만들고 매니페스트 작성하기
08-3 워크박스로 오프라인 관리하기
08-4 앱 실행 화면 만들기
08-5 HTTPS로 파이어베이스 호스팅에 PWA 배포하기
08-6 PWA 성능 테스트하기
미션 코딩! 기본 레이아웃을 적용한 앱 만들어 배포하기
====================
셋째마당 PWA 실전 앱 만들기
====================
[09] To-Do 앱 만들기
09-1 To-Do 앱 구경하기
09-2 매니페스트 작성하기
09-3 워크박스로 오프라인 관리하기
09-4 파이어베이스 실시간 DB 준비하기
09-5 앱 실행 화면 만들기
[10] 사진 갤러리 앱 만들기
10-1 사진 갤러리 앱 구경하기
10-2 매니페스트 작성하기
10-3 워크박스로 런타임 캐시 관리하기
10-4 앱 실행 화면 만들기
10-5 모바일 기기에서 로컬 사이트 테스트하기
[11] 카메라 사진 갤러리 앱 만들기
11-1 카메라 사진 갤러리 앱 구경하기
11-2 매니페스트 작성하기
11-3 파이어베이스 스토리지 DB 준비하기
11-4 앱 실행 화면 만들기
11-5 컴포넌트 작성하기
11-6 워크박스로 서비스 워커에서 캐시 관리하기
[12] 구글 로그인 서비스 만들기
12-1 구글 로그인 서비스 구경하기
12-2 매니페스트 작성하기
12-3 파이어베이스 인증 사용하기
12-4 앱 실행 화면 만들기
12-5 스토어 작성하기
12-6 컴포넌트 작성하기
[13] 푸시 알림 서비스 만들기
13-1 푸시 알림 서비스 구경하기
13-2 매니페스트 작성하기
13-3 파이어베이스 준비하기
13-4 앱 실행 화면 만들기
13-5 컴포넌트 작성하기
13-6 파이어베이스 서버 함수 작성하기
13-7 워크박스로 서비스 워커에서 알림 메시지 받기
[14] 오프라인 동기화 기능 만들기
14-1 오프라인 동기화 구경하기
14-2 매니페스트 작성하기
14-3 클라우드 파이어스토어 준비하기
14-4 앱 실행 화면 만들기
14-5 컴포넌트 작성하기
====================
넷째마당 PWA를 하이브리드 앱으로 배포하기
====================
[15] 코르도바로 하이브리드 앱 만들기
15-1 하이브리드 앱이란?
15-2 하이브리드 앱 실전 예제 5가지
15-3 ‘Hello Hybrid’ 앱 만들기 - 준비
15-4 ‘Hello Hybrid’ 앱 만들기 - 제작
미션 코딩! 사진 갤러리 안드로이드 앱 만들기
[16] 웹앱을 안드로이드 앱으로 만들기
16-1 To-Do 안드로이드 앱 만들기
16-2 아파치 코르도바 플러그인 사용하기
16-3 모바일 기기 상태를 체크하는 안드로이드 앱 만들기
미션 코딩! 카메라 사진 갤러리 안드로이드 앱 만들기
[17] 구글 플레이 스토어에 앱 등록하기
17-1 안드로이드 앱 번들 준비하기
17-2 구글 플레이 스토어에 앱 등록하기
위 2개의 책에서 필요한 부분은 notification push 부분이었다.
그리고 책들의 내용에서 PWA의 주요 기능들을 개념적으로만 서술했다면 분량이 그렇게 크지 않았을텐데
구체적인 예시의 샘플과 코드들을 통해 이해가 더 쉽게 설명한게 맘에 들었다.
다만 PWA(service worker)의 알림 기능외엔 다른 기능은 여건이 되지 않아 당장 파악하지 않고 있다.
