Published on

Progressive Web Apps(PWA)

Authors
  • avatar
    Name
    Luffy Yeon
    Twitter

Progressive Web Apps(PWA)

PWA 코드랩에 참석하기전 PWA가 무엇인지 간단히 알아보기.
프로그레시브 웹 앱은 웹을 통해서 데스크톱 및 모바일에 설치 가능한, 앱과 유사한 환경을 구축할 수 있도록 제공한다.


여기서 중요한 점은 모든 브라우저에서 작동하는 웹 앱이라는 점.
브라우저에서 지원하는 앱이라고 생각하면 쉬울 것 같다.


PWA는 따로 설치가 필요하지 않고, 페이지에 접속하여 바탕화면에 앱 아이콘을 추가 할 수 있다. 푸시알림을 통하여 재참여가 가능하고 오프라인에서도 캐싱된 데이터로 웹 앱으로 접근이 가능하다. ex) img link script 등 다른 도메인으로부터 리소스 요청


구글 코드랩에 PWA에 대한 좋은 예제와 설명이 있다.
참고: PWA


PWA의 특징

  • 프로그레시브 - 어떤 브라우저에서도 똑같이 동작합니다.
  • 반응형 - 데스크톱, 모바일, 태블릿 등 모든 폼 팩터에 맞습니다.
  • 연결 독립적 - 서비스 워커를 사용하여 오프라인이나 느린 네트워크에서 작동하도록 향상됩니다.
  • 앱과 유사 - 앱 스타일로 구현 됩니다.
  • 최신 상태 - 서비스 워커 업데이트 프로세스 덕분에 항상 최신 상태로 유지됩니다.
  • 안전 - HTTPS를 통해 제공되므로 스누핑이 차단되며, 콘텐츠가 변조되지 않도록 보장합니다.
  • 검색 가능 - W3C 매니페스트 및 서비스 워커 등록 범위 덕분에 '애플리케이션'으로 식별되므로, 검색 엔진에서 검색이 가능합니다.
  • 재참여 가능 - 푸시 알림과 같은 기능을 통해 쉽게 재참여가 가능합니다.
  • 설치 가능 - 앱 스토어에서 씨름할 필요 없이 사용자가 자신에게 가장 유용한 앱을 홈 화면에 유지할 수 있습니다.
  • 링크 연결 가능 - URL을 통해 손쉽게 공유할 수 있으며 복잡한 설치 작업이 불필요합니다.