íë¡ê·¸ë ìë¸ ì¹ ì±
íë¡ê·¸ë ìë¸ ì¹ ì±ì ìµì ì¹ APIì ì íµì ì¸ ì ì§ì ê°ì ì ëµì í¨ê» ì¬ì©í´ í¬ë¡ì¤ íë«í¼ ì¹ ì´í리ì¼ì´ì ì ìì±í©ëë¤. ì´ë¬í ì±ì ì´ëìë ëìíë©° ë¤ì´í°ë¸ ì±ììì ì¬ì©ì ê²½í ì´ì ê³¼ ëì¼í ëª ê°ì§ 기ë¥ë¤ì ì ê³µí©ëë¤. ì´ ë¬¸ìììë ì´ì ëí´ ì¬ë¬ë¶ì´ ììì¼ í 모ë ê²ë¤ì ëí´ ìë ¤ë립ëë¤.
PWA ì´ì
PWAë ë°ê²¬ ê°ë¥, ì¤ì¹ ê°ë¥, ì°ê²° ê°ë¥í´ì¼ íê³ , ë¤í¸ìí¬ì ë 립ì ì´ì´ì¼ íê³ , ì ì§ì ì´ê³ ì¬ì°¸ì¬ê° ê°ë¥í´ì¼íë©° ë°ìíì´ê³ ìì í´ì¼ í©ëë¤. ì´ë¬í ê²ë¤ì´ 무ìì ì미íëì§ë íë¡ê·¸ë ìë¸ ì¹ ì± ì´ì 문ì를 ì½ì´ë³´ì기 ë°ëëë¤. PWA를 구ííë ë°©ë²ì ìë ì¹ì ì ëì´ë ê°ì´ë를 참조íììì¤.
íµì¬ PWA ê°ì´ë
ë¤ì ê°ì´ëë ê°ë¨í ìì 를 ì´í´ë³´ê³ 모ë ì¡°ê°ì´ ì´ë»ê² ëìíëì§ ë³´ì¬ì¤ì¼ë¡ì¨ PWA 구íì ìí´ í´ì¼íë ê²ë¤ì´ 무ìì¸ì§ ë³´ì¬ì¤ëë¤.
기ì ê°ì´ë
- í´ë¼ì´ì¸í¸ ì¬ì´ë ì ì¥ì â ì¹ ì ì¥ì, IndexedDB, service worker를 ì¸ì ì´ë»ê² ì¬ì©íëì§ ë³´ì¬ì£¼ë ìì¸ ê°ì´ë
- Service worker ì¬ì© â Service Worker APIì ëí ë ìì¸í ê°ì´ë.
- IndexedDB ì¬ì© â IndexedDBì 근본ì ëí ìì¸í ì¤ëª .
- Web Storage API ì¬ì© â ê°ë¨íê² ë§ë¤ì´ì§ Web storage API.
- Application Shell 구조를 ì¬ì©í ì¹ ì± ì¦ì ë¡ë© â App Shell ì½ë© í¨í´ì ì¬ì©í´ ë¹ ë¥´ê² ë¡ë©ëë ì±ì ìì±íë ê°ì´ë.
- Push API ì¬ì© â Web Push APIì 기ì´ì ëí´ ë°°ì°ê¸°.
- Notifications API ì¬ì© â ì¹ ì림 ìì½.
- ë°ìí ëìì¸ ë¸ë¡ êµ¬ì¶ â ë°ìí ëìì¸ ê¸°ì´, ìµì ì± ë ì´ìì íì 주ì ë°°ì°ê¸°.
- 모ë°ì¼ ì°ì â ë°ìí ì´í리ì¼ì´ì ë ì´ììì ìì±í ë, ë³´íµ ê¸°ë³¸ì ì¼ë¡ 모ë°ì¼ ë ì´ììì ìì±íê³ , ë ëì ìë¨ ë ì´ììì 구ì¶íë ê²ì´ ì¢ìµëë¤.
- í íë©´ì ì¶ê° ê°ì´ë â ì±ì í íë©´ì ì¶ê°íì¬ ì»ì ì ìë ì´ì ì ëí´ ë°°ì°ê¸°.
ë구
- localForage â ì주 ê°ë¨íê² í´ë¼ì´ì¸í¸ ì¬ì´ë ë°ì´í° ì ì¥ì를 ë§ë¤ ì ìë íë¥íê³ ê°ë²¼ì´ JavaScript ë¼ì´ë¸ë¬ë¦¬. 기본ì ì¼ë¡ IndexedDB를 ì¬ì©íê³ íìí ê²½ì° Web SQL/Web Storage를 ì¬ì©í©ëë¤.
- ServiceWorkerWare â ìì¬ì´ Service Worker ê°ë°ì ìí Express ê°ì ë§ì´í¬ë¡íë ììí¬.
- oghliner â í í릿ì´ì GitHub íì´ì§ì ì¤íë¼ì¸ ì¹ ì±ì ë°°í¬í기 ìí ë구.
- sw-precache â í¹ì 리ìì¤ë¥¼ í리ìºì±(미리 ìºì±;precache)íë service worker ì½ë를 ìì±íë ë ¸ë 모ë.
- workbox â ë ëì ìºì± ì ëµê³¼ ì¬ì´ í리ìºì±ì ì ê³µíë sw-precacheì ì ì ì ì§ì£¼.
- upup â ì¬ì´í¸ê° ì¬ì©ìë¤ì ìí´ íì ì¡´ì¬íëë¡ í´ì£¼ë ìì ì¤í¬ë¦½í¸.
- The service worker cookbook â ì¤íë¼ì¸ ì± ë° ê·¸ ì´ìì ë¤ìí ì± êµ¬í ë°©ë²ì ë³´ì¬ì£¼ë íë¥í service worker/push ê°ì´ë ì리ì¦.
í¨ê» 보기
- Progressive Web Apps landing page and check list on web.dev
- Progressive Web Apps: Everything You Need To Know
- Progressive Web Apps: Escaping Tabs Without Losing Our Soul
- Instant Loading Web Apps with An Application Shell Architecture
- Workbox â set of libraries to power a "production-ready" service worker for your PWA
- Lighthouse â web-app auditing tool that includes PWA-auditing features
- localForage â
localStorage-like async storage, to improve your PWA's offline experience