Web
PWA란? Manifest란?
또롱또
2022. 6. 26. 17:35
728x90
Progressive Web Application
새롭고 강력한 소프트웨어 앱을 만드는 방식
html+css+js로 만든 웹앱을 웹브라우저의 API와 결합해서 크로스플랫폼에서 동작하는 어플리케이션을 만들수 있다.
안드로이드나 IOS처럼 특정 플랫폼에서 동작하는 native 어플리케이션은
사용자에게 다양한 기능을 제공하는 역량은 크지만, 그 플랫폼에서만 사용가능하다는 단점
웹앱은 플랫폼 상관없이 브라우저만 있으면 사용가능하다는 장점,
하지만 진짜 어플리케이션들처럼 플랫폼 자체를 사용할 수는 없다.
PWA는 웹앱처럼 사용자들이 접근이 용이하고, 플랫폼도 사용 가능하다.
- 스티브잡스가 제일먼저 생각했지만, 웹스토어 선택
- 그러다가 크롬개발자가 만듬
uber, youtube, spotify 등등이 pwa 기술을 사용
한계점:
PWA를 지원하지 않는 플랫폼이 많다 - 웹스토어 등(사파리는 가능)
완전히 네이티브 앱처럼 만들기는 한계가 있다.
PWA builder - 웹사이트를 pwa로 전환할때 어떤지 검토해줌
workbox - 다양한 pwa를 위한 서비스 worker를 자동으로 만들어줌
만드는데필요한거
1. 웹어플
2. https를 이용한 서비스
3. application manifest가 있어야함(json)
4. service worker (js로 작성가능)
* 내가 못한거겠지만, Regnok으로 배포한건 터지고 Netlify 은 성공했다..
Manifest
웹앱 매니페스트(Manifest)는 PWA(Progressive Web Apps)의 설치와 앱의 구성 정보를 담고 있는 json 설정파일아래와 같은 기능을 해준다
App Icon : 설치 시 앱의 아이콘 이미지와 크기 설정
스플래시((splash screen) 화면 : 로딩화면 설정
Start URL : 웹앱이 실행될 때 가장 처음 보여질 URL 설정
Display Type : 웹 앱의 화면 형태 (browser, standalone, fullscreen)
Display Orientation : 웹앱의 화면 방향(가로모드, 세로모드)728x90