개요

내가 생각하는 최강의 PWA 보일러 플레이트를 만든다.
내가 생각하는 최강의 PWA 보일러 플레이트의 구성은 다음과 같다.
next.js도 workbox도 별로 접한 적이 없기 때문에, 사구리 사구리 해 간다.

구성

다음 두 가지로 애플리케이션을 구축한다.

next.js

htps // // 네 xtjs. rg/

SSR/SPA용

평소 잘 접하고 있는 것이 React이므로, React의 Isomorphic JavaScript 프레임워크를 사용한다.

workbox

htps : //에서 ゔぇぺぺrs. 오, ぇ. 이 m / ぇ b / 와 ls /를 rk 보 x /

Service Worker 라이브러리

Service Worker를 만드는 라이브러리로는 workbox가 한 강한 것 같기 때문에 workbox를 사용해 본다.

firebase

htps : // 푹 빠져라. 오, ぇ. 코m/

주로 사용하는 것은 이하의 3개

hosting

functios

FireStore

플랫폼은 가장 간편하고 타다의 firebase를 사용한다.

next.js/firebase 설정

이해하기 위해서도 create-next-app는 사용하지 않고 만들어 간다.
→ 어쩐지 귀찮아 보이기 때문에 create-next-app 사용하기로 했다.

create-next-app 설치

npm i -g create-next-app

nextjs의 프로젝트 생성

create-next-app --example with-firebase-hosting-and-typescript pwa-boilerplate

firebase 프로젝트 생성

htps : // 이런. 푹 빠져라. 오, ぇ. 코m/
※ 자세한 것은 h tps:// 퀵했다. 작은 m / 미라 CE T- RT09 / MS / 8 A C43 A B7 A 18b3001 0라든지 봐

.firebaserc 편집

{
  "projects": {
    "default": "<firebase projectId>"
  }
}

동작 확인

yarn run deploy

https://{projectId}.firebaseapp.com/


~ 계속 ~