Ionic PWA (프로그래시브 웹 앱) 만들기

Firebase와 Service-Worker를 사용하여 Ionic PWA 만들기

아이오닉3와 파이어베이스를 사용하여 요즘 한창 이슈가 되고 있는 PWA(Progressive Web app)을 구현해 봅니다. 실제 웹앱을 구현해보면서 앞으로 진화 될 PWA의 개념을 정립해보세요.

PWA란?

모바일 웹과 앱의 장점을 모두 취하려는 "앱 같은 웹"입니다. PWA는 서비스 작업자(service-worker)라는 새로운 API를 활용해서 웹앱의 중요한 부분을 캐싱하고 즉시 로딩이 가능하게 합니다. 그래서 모바일 웹이지만 푸시 알림도 보낼 수 있습니다. (참고) https://developers.google.com/web/progressive-web-apps/

PWA를 구현을 지원하는 다양한 프레임 워크가 있지만, Web/App Component들을 사용하고, 실행 가능한 service-worker를 내장하고 있으며, 다양한 내부 /외부 API를 사용할 수 있는 아이오닉 프레임 워크가 PWA를 구현하는데 있어서 가장 적합하다고 생각합니다. 현재 이를 이용한 다양한 PWA 관련 프로잭트가 진행 되고 있습니다. *Ionic에서는 아직 초기 버전이지만 자체적으로 개발한 PWA-toolkit를 제공하고 있습니다.

  도움이 되는 분들

• 하이브리드 앱을 개발하고 싶은 분
• PWA를 개발하고 싶으신 분
• Ionic을 처음 접하는 초보자

  강의 특징

main feature

ionic 3 Firebase realtime Database CRUD/indexing Firebase Auth web push message Moment.js IOS/Android Building Modal ActionSheet infinite scroll Time Stemp response grid

개발 환경

cli packages: (/usr/local/lib/node_modules) @ionic/cli-utils : 1.19.0 ionic (Ionic CLI) : 3.19.0 global packages: cordova (Cordova CLI) : 7.1.0 local packages: @ionic/app-scripts : 3.1.4 Cordova Platforms : android 6.3.0 Ionic Framework : ionic-angular 3.9.2 System: ios-deploy : 1.9.2 Node : v8.6.0 npm : 5.5.1 OS : macOS High Sierra Xcode : Xcode 9.2 Build version 9C40b

지식공유자 소개

김철현

SDS LGAd 심마니(검색엔진) Mnet Media(현 CJ E&M) 을 거쳐 현재 프리랜서/컨설턴트로 활동중