SPA : Single Page Application
- 하나의 페이지로 구성된 앱
- 필요한 부분만 갈아 끼운다
MPA : Multi Page Application
- 여러개의 페이지로 구성된 앱
- 페이지별로 html, css, js를 받아와서 화면을 그린다. 페이지의 이동
Nativa APP :
- 각각의 OS에 맞게 개발된 앱 (안드로이드-코틀린, IOS-스위프트)
- 내부파일시스템, 카메라 등 스마트폰 자체 기능 모두 사용가능
- 구글스토어, 앱스토어에 등록
- 아이콘으로 추가하여 사용
- (단) 개발에 드는 인력/시간 (안드/애플 각각 개발해야함)
- (단) 각각의 스토어에서 배포 거절될 수도 있다.
Mobile Web : 스마트폰 사용자를 대상으로한 웹사이트
- 스마트폰에서 보기 편하게 레이아웃
- 모바일웹 = 웹앱
- OS 구분없이 개발 가능
- 스토어 배포 필요 없음
- 브라우저에서 돌아가는 컨텐츠
- 제한된 기능 : 스마트폰의 하드웨어 사용 불가
Hybrid App
- Native 로 만드는데 + 그 안에 웹사이트를 보여주는 창을 넣어준다 (웹뷰)
- 웹뷰 컨텐츠들은 웹과 공동으로 개발 가능
- 네이티브 기능들만 따로 개발하면 된다
Cross-Platform App
- React-Native, Flutter, 등
- 하나의 언어, 한번의 개발로 안드, IOS 모두 돌아가도록 변환
- 네이티브만큼은 아니지만 대부분의 기능 사용가능
PWA : Progressive Web App
- 웹과 네이티브 앱의 기능을 모두 갖춘 형태
- 개발하기 쉽고, 사용하기 편리한 앱을 만들기 위한 새로운 접근법(방법론)
- 모바일 웹의 한계를 브라우저의 발전을 통해 극복
- 브라우저에서 접속되는 웹형태 -> 홈화면에 추가(스토어에서 다운로드한것 처럼)
- 안드는 푸시알람, 스토어 출시도 가능
- 브라우저가 더 많은 기능을 제공하기 때문
- 애플은 소극적
- your first progressive web
- 크롬의 lighthouse 기능 -> 사이트 평가 확인 (웹 성능 지표)
- manifest.json 추가(안드) & meta 태그 추가(ios용)
- index.html 안에 link태그 추가
- 서비스워커 : 인터넷이 안될때도 동작할 수있도록 캐싱,
- 스크립트추가
- service-worker.js 추가 및 설정 (캐싱정보 명시/오프라인에서 보여줄 html페이지 등
- 웹페이지에 다운로드 버튼 만들기 -> 홈화면에서 추가(안드만)