PWA 설정

PWA는 웹 기술로 접근성·SEO를 유지하면서 오프라인, 푸시 알림, 홈 화면 설치를 더한 앱 경험입니다.

Next.js 프로젝트를 PWA로 만드는 가장 쉽고 널리 사용되는 방법은 next-pwa 라이브러리를 활용하는 것입니다.

next-pwa는 Workbox 기반 서비스 워커로 정적 자산과 페이지를 캐싱해, 끊긴 네트워크에서도 캐시 화면을 돌려줍니다.

개발 모드에서는 next-pwa가 꺼지는 경우가 많으므로, 서비스 워커와 캐시는 프로덕션 빌드에서 확인합니다.