PWA - Progressive Web App | Getting Started

(공지) SNS 앱 예제로 배우는 프로그레시브 웹 앱 출간 안내

• 실습 저장소
• 책 살펴보기!

(출간일: 2020.07.31)

• YES24
• 교보문고
• 알라딘
• 인터파크도서

소개

안녕하세요, 이근혁 입니다. 이번에 프로그레시브 웹 앱에 대한 도서를 출간하게 되었습니다. 프로그레시브 웹 앱의 기본적인 개념 뿐만 아니라 서비스 워커부터 오프라인 캐싱, 백그라운드 동기화, 푸시 알림까지 핵심적인 내용에 대해 최대한 쉽고 상세하게 전달할 수 있도록 준비하였습니다.

다양한 개선 방안과 활용 방안까지 준비했으니 SNS 앱 예제로 배우는 프로그레시브 웹 앱에 많은 관심 부탁드립니다!

---

강좌 소개

프로그레시브 웹 앱에 대한 전반적인 내용과 활용법에 대해 학습할 수 있는 기초 강좌입니다.
각 챕터는 블로그 포스팅과 예제 소스코드를 통해 직접 실습할 수 있도록 구성되어있으며 궁금한 내용은 블로그 댓글 또는 이메일로 보내주시면 됩니다.

웹 개발의 전반적인 이해가 필요하며 자바스크립트 ES6에 대한 내용을 어느정도 알고 계셔야 진행하실 때 어려움이 없습니다.

실습 환경

• 브라우저 (Google Chrome 추천)
• 텍스트 에디터 혹은 IDE (본 강좌에서는 VSCode 사용)
• Simple Server

목차

• 프로그레시브 웹 앱 시작하기 (1) - PWA란?
• 프로그레시브 웹 앱 시작하기 (2) - 서비스워커 등록
• 프로그레시브 웹 앱 시작하기 (3) - 리소스 캐싱 및 Fetch
• 프로그레시브 웹 앱 시작하기 (4) - 서비스워커 상태
• 프로그레시브 웹 앱 시작하기 (5) - Push, 푸시 알림 1
• 프로그레시브 웹 앱 시작하기 (6) - Push, 푸시 알림 2

상세 목차

• Chapter 1 프로그레시브 웹 앱 시작하기 (1) - PWA란?
  • PWA에 대한 기본 이론 학습
  • 예제 웹 서버 띄우기
  • 코드 분석
• Chapter 2 프로그레시브 웹 앱 시작하기 (2) - 서비스워커 등록
  • 서비스워커 등록하기
  • 서비스워커 생명주기
  • 브라우저 Fetch 가로채기
• Chapter 3 프로그레시브 웹 앱 시작하기 (3) - 리소스 캐싱 및 Fetch
  • 필요한 리소스 캐싱하기
  • 사용하지 않는 캐시 삭제하기
  • 오프라인 환경에서 캐싱된 데이터 응답하기
• Chapter 4 프로그레시브 웹 앱 시작하기 (4) - 서비스워커 상태
  • 서비스워커 상태 기초
  • 서비스워커 상태 변경 감지
• Chapter 5 프로그레시브 웹 앱 시작하기 (5) - Push, 푸시 알림 1
  • 푸시 알림 구독
  • 구독 정보 확인
  • 구독 상태 확인
  • 푸시 알림 받기
• Chapter 6 프로그레시브 웹 앱 시작하기 (6) - Push, 푸시 알림 2
  • 푸시 알림 클릭 이벤트
  • 푸시 알림 구독 취소
  • 브라우저 알림 권한 확인
• Chapter 7
  • 백그라운드 동기화, 푸시 알림, IndexedDB와 같은 다양한 활용 방안은 SNS 앱 예제로 배우는 프로그레시브 웹 앱에서 만나볼 수 있습니다!

이미지 출처

링크

진행자

• 이근혁
  • Github: Geunhyeok LEE
  • E-Mail: dev.ghlee@gmail.com