PWA (Progressive Web App)

별칭: PWA · Progressive Web App · 프로그레시브 웹 앱 · 홈 화면 추가

웹앱을 기기에 설치하거나 홈 화면에서 앱처럼 열 수 있게 만드는 웹 기술 묶음.

PWA는 웹 기술로 만든 앱이 네이티브 앱처럼 설치, 홈 화면 실행, 오프라인 동작 같은 경험을 일부 제공하게 하는 방식이다. 수업에서는 manifest와 아이콘을 추가해 직접 만든 웹서비스를 휴대폰에서 다시 열기 쉽게 만든다.

정의

PWA(Progressive Web App)는 웹 기술로 만든 앱이 플랫폼 앱과 비슷한 사용자 경험을 제공하도록 만드는 접근이다. 웹앱 manifest, service worker, HTTPS, 반응형 UI 같은 요소를 조합해 설치 가능성, 오프라인 경험, 홈 화면 실행 등을 제공할 수 있다.

왜 중요한가

초보자가 만든 웹앱은 URL로 공유하기 쉽지만, 사용자가 매번 주소를 찾아 들어가야 하면 일상 도구가 되기 어렵다. PWA를 적용하면 홈 화면에 아이콘을 추가해 앱처럼 다시 열 수 있어, 작은 업무 도구나 개인 서비스의 재사용성이 올라간다.

Semiclass에서의 의미

모바일 망토 단계에서는 manifest.webmanifest와 아이콘을 추가하고, 아이폰·안드로이드에서 홈 화면 추가 흐름을 확인한다. 수업의 목표는 완전한 앱스토어 배포가 아니라, 웹서비스가 휴대폰에서 꺼내 쓰는 도구에 가까워지는 경험을 이해하는 것이다.

주의할 점

PWA 지원 범위는 브라우저와 운영체제마다 다르다. iOS와 Android의 설치 UI, 푸시 알림, 오프라인 캐시 지원이 완전히 같지 않다. 처음에는 manifest와 반응형 레이아웃부터 안정적으로 맞추고, service worker나 푸시는 필요할 때 추가하는 편이 좋다.

출처