PWA 정의

→ Progressive Web App 의 약자로 웹 기술(HTML CSS JavaScript)을 사용하여 네이티브 앱과 유사한 사용자 경험을 제공하는 웹 에플리케이션이다. 사용자는 브라우저를 통해 접근하지만 설치하여 오프라인에서도 사용할수있으며 푸시 알림 등의 기능을 제공한다.

구성요소

1. service Worker

→ 백그라운드에서 실행되는 JS파일로 네트워크 요청을 가로채 캐시를 관리하고 푸시알림을 처리한다.
→ 어플리케이션이 서버와 데이터를 주고받을때 그 중간에서 모든 요청을 통제하고 관리가 가능하다. 그래서 특정 네트워크 요청과 반응을 따로 저장해두고 오프라인 상태일때 저장해둔 데이터를 보여준다.

→ → 예를 들면 최신 뉴스들을 미리 fetch하여 저장해놓고 사용자가 어플리케이션을 키자마자 볼수있도록, 성능이 좋은 어플리케이션을 만들기 위해서도 쓰인다.

2. Web App Manifest

→ JSON 파일로 앱의 이름, 아이콘, 테마 색상, 시작 URL 등을 정의한다.
즉 프로그레시브 웹 앱에 대해 브라우저에게 알려주며 사용자의 테스크톱이나 모바일 기기에 설치할때 어떻게 작동해야 하는지 알려주는 JSON 형식의 파일.

3. HTTPs

→ PWA는 반드시 HTTPs 환경에서 동작해야한다.
→ 데이터 보안을 보장하며 Service Worker 가 정상적으로 작동하는 필수조건이다.