PWA

Prograssive web app

모바일 환경에서 구동하는 앱의 종류는 무엇이 있을까!

스마트폰이 처음 생기고 모바일 환경에서만 작동하는 ①네이티브앱이 생겨났고 브라우저로 작동하는 ②웹앱, 두 장점을 합친 ③하이브리드앱(웹뷰방식과 네이티브언어로 변환되는 방식이 있다) 그리고 ④프로그래시브웹앱이 있다. 이렇게가 내가 공부해서 알고있는 앱의 종류이다.

그런데 프로그래시브웹앱의 목표가 너무 맘에 들었다. 기억은 잘 안나지만 내가 이해하기로는 웹으로 시작했지만 앱과 최종적으로 도착지가 같다는 것이었다.

ㅇㅅㅇb

 

네이티브 앱

장점	단점
스마트폰에 최적화된 기능 구현 가능	개발난이도 UP, 많은 시간 소요 OS별로 따로 개발해야함
시장이 넓다	업데이트가 생기면 다시 받아야함 앱 시장에서 선택 받기 어렵다
아이콘을 눌러 쉽게 접속 알림을 통해 재방문 유도	용량이 크다

 

웹앱

장점	단점
익숙한 웹 기술 이용 가능 개발 시간 단축	모바일 하드웨어 기능 사용이 제한됨 푸시 알림을 사옹할 수 없음 (받는게 불가능)
웹 브라우저로 구동	앱 스토어, 플레이 스토어 이용 불가
실시간 유지 보수 가능	네이티브와 같이 빠르고 풍부한 사용자 경험에 제약이 있음 인터넷 접속이 끊어지면 사용 불가

 

하이브리드 앱

장점	단점
기존 웹 개발 기술을 모든 운영체제에서 그대로 사용 가능 같은 코드를 모바일 운영체제별로 다르게 패키징 가능	하드웨어 기능을 플러그인에서 제공하는 것만 사용 가능
앱 스토어, 플레이 스터오 배포 가능	업데이트가 생기면 다시 받아야함 스토어에서 선택 받기 힘들다
네이티브 앱과 유사한 사용자 경험을 제공	네이티브 앱과 같은 성능에는 한계가 있다

 

프로그래시브 웹앱

장점	단점
이미 익숙한 웹 기술 이용 가능 개발 시간 단축 푸시 알림, 오프라인 캐시, HTTPS 사용 가능	하드웨어 사용은 웹 API를 통하므로 웹 표준을 지원하는 브라우저가 필요하다
웹 브라우저만 있으면 어디서든 배포 가능 '홈 화면 설치' 기능을 통해 운영체제의 응용프로그램으로 설치 가능 실시간으로 유지 보수 가능	앱 스토어, 플레이 스토어를 이용할 수 없지만 코르도바를 사용하면 같은 코드 기반으로 배포할 수 있다
빠른 실행 속도로 네이티브 앱과 유사한 사용자 경험	안드로이드, 윈도우 OS에선 PWA 모든 기능 사용 가능하지만 IOS는 현재 일부만 사용할 수 있다

 

프로그래시브 웹앱의

6가지 핵심 기술

1. 서비스워커★ - 브라우저가 분리되어 백그라운드로 항상 실행됨. 오프라인에서도 작동. 푸시 알림 받음.

2. 웹앱 매니페스트★ - 앱 정보를 담은 JSON파일 (앱개발 해봤으면 뭔지 알 듯. 세부정보는 다름).

3. HTTPS★ - 웹 통신 규약. 웹서버와 브라우저 사이의 데이터 암호화. 홈화면추가기능은 HTTPS에서만 가능.

4. 푸시알림 - 푸시 알림을 받으면 사용자의 재방문을 유도할 수 있음.

5. 홈 화면에 추가 기능 - 데스크톱에서는 옴니박스라고 함. 설치되어 진짜 앱처럼 인식. 브라우저에 접속만해도 홈 화면에 추가하라고 제안함. 이를 위해서는 ①HTTPS로 호스팅해야하고 ②매니페스트가 정상적으로 등록되어야하며 ③서비스 워커가 정상 설치되어 있어야하고 ④PWA가 설치되어 있지 않아야함.

6. 웹 API - 위치정보나 스마트폰 카메라도 작동 가능 (https://developer.mozilla.org/ko/docs/Web/API)

 

 

 

 

[Do it! 프로그래시브 웹앱 만들기] 도서로 공부했습니다.