PWA란?
프로그레시브 웹 앱(progressive web app)의 줄임말.
웹과 앱의 장점을 결합함.
네이티브 앱
- 느린 네트워크에서도 작동하며, 백그라운드에서 푸시 알람을 보내준다.
- 카메라, 마이크 등에도 쉽게 접근하여 다양한 기능을 수행할 수 있다.
- ⇒ Capability(능력)가 뛰어나다라고 할 수 있다.
웹
- URL을 통한 접근이 간단
- 설치 과정이 없다.
- ⇒ Reach(범위)가 넓다라고 할 수 있다.

PWA, 예를 들면?
우리가 온라인에서 볼 수 있는 많은 사이트들도 실제로는 PWA이다. ex) 트위터닷컴(twitter.com)
스마트폰으로 이 사이트에 들어가면, 홈 화면에 트위터닷컴을 추가할 수 있다. 그러고 나서 스마트폰에 저장된 트위터 사이트를 열어 보면, 모양도 네이티브 앱처럼 보이고, 기능도 모두 똑같다. 브라우저 창 같은 건 아무것도 없으며 아이폰이든 안드로이드 스마트폰이든 관계없이, 실행하는 데 있어서는 아무런 차이도 없다. 그냥 로그인을 해서 이용하기만 하면 된다.
iOS, Android의 환경에서 모두 실행되는 앱을 개발하는 대표적인 방법이 바로 프로그레시브 웹 앱(PWA)이다. PWA는 보안상의 이유로 브라우저가 접근하지 못하는 시스템 하드웨어와 소프트웨어에도 접근할 수 있다. 따라서 PWA의 성능이 뛰어나다면, 사용자들은 자신들이 웹 기반의 앱을 사용하고 있는 것인지, 아니면 네이티브 앱을 사용하고 있는 것인지를 구분하지 못할 것이다.
웹 앱을 PWA로 식별되기 위해 확인해야 하는 몇 가지 핵심 원칙
- 발견 가능, 따라서 컨텐츠를 검색 엔진을 통해 찾을 수 있다.
- 설치 가능, 따라서 기기의 홈 화면에서 사용할 수 있다.
- 연결 가능, 따라서 간단하게 URL을 전송해 공유할 수 있다.
- 네트워크 독립적, 따라서 오프라인이나 불안한 네트워크 연결에서 동작한다.
- 점진적, 따라서 최신 브라우저의 모든 기능은 사용할 수 없지만 이전 브라우저의 기본 기능은 여전히 사용할 수 있다.
- 재 참여 가능(Re-engageable), 따라서 새 컨텐츠가 사용 가능할 때마다 알림을 보낼 수 있다.
- 반응형, 따라서 모든 기기의 화면이나 브라우저에서 사용할 수 있다 — 모바일 폰, 태블릿, 노트북, TV, 냉장고, 등.
- 안전, 따라서 여러분과 앱 사이의 연결이 여러분의 민감한 데이터에 접근하려는 모든 제3자로부터 안전하다.
[참고]
https://developer.mozilla.org/ko/docs/Web/Progressive_web_apps/Introduction
https://altenull.github.io/2018/02/25/프로그레시브-웹-앱-Progressive-Web-Apps-란/
'개발몰입과정 개념스터디 > 4차' 카테고리의 다른 글
CSR, SSR (React, Next.js) (0) | 2022.02.07 |
---|---|
Tailwind CSS이란? (0) | 2022.02.05 |
Styled-Component란? (0) | 2022.02.05 |
SCSS (CSS Modules)란? (0) | 2022.02.05 |
SEO와 SSG, 그리고 Gatsby.js (0) | 2022.02.05 |