Quest 18-F. 프로그레시브 웹앱

Introduction

이번 퀘스트에서는 2021년 현재 웹 프론트엔드의 많은 최신 기술 중 프로그레시브 웹앱에 관해 알아보겠습니다.

Topics

Progressive Web App(PWA)
Service Worker
Cache & CacheStorage API
Web Manifest

Resources

Checklist

웹 어플리케이션을 프로그레시브 웹앱 형태로 만들면 어떤 이점을 가질까요?
서비스 워커란 무엇인가요? 웹 워커와의 차이는 무엇인가요?
PWA의 성능을 높이기 위한 방법론에는 어떤 것들이 있고, 어떤 식으로 적용할 수 있을까요?

Quest

텍스트 에디터 프로그램을 PWA 형태로 만들어 보세요.
- 필요한 에셋을 적절히 캐싱하되, 버전업이 되었을 때 캐싱을 해제할 수 있는 형태가 되어야 합니다.
- 해당 PWA를 데스크탑에 인스톨 가능하도록 만들어 보세요.
- 오프라인인 경우에는 임시저장 기능을 만들어, 온라인인 경우를 감지하여 자동으로 서버에 반영되도록 만들어 보세요.

Advanced

본 퀘스트의 주제로 고려되었으나 분량상 선정되지 않은 주제들은 다음과 같습니다. 시간날 때 한 번 찾아 보세요!
- Search Engine Optimization(SEO)
- CSS-in-JS와 Styled Component
- Server-Side Rendering(SSR)