feat: pwa 설정 추가 (#82)

our-bbang · Nov 1, 2023 · bfdd8fa · bfdd8fa
1 parent 8d051e9
commit bfdd8fa
Show file tree

Hide file tree

Showing 10 changed files with 89 additions and 0 deletions.
diff --git a/index.html b/index.html
@@ -2,15 +2,44 @@
 <html lang="en">
   <head>
     <meta charset="UTF-8" />
+    <meta name="theme-color" content="#4ED99C" />
     <link rel="icon" type="image/svg+xml" href="/favicon_1.svg" />
+    <link
+      rel="alternate icon"
+      href="icons/favicon.ico"
+      type="ico"
+      sizes="32x32"
+    />
+    <link
+      rel="apple-touch-icon"
+      href="icons/icon-196x196.png"
+      sizes="196x196"
+    />
     <meta
       name="viewport"
       content="width=device-width, initial-scale=1.0, user-scalable=no, maximum-scale=1.0"
     />
+    <link rel="manifest" href="/manifest.json" />
     <title>꿈틀: AI 기반 계획표 생성 서비스</title>
   </head>
   <body>
     <div id="root"></div>
     <script type="module" src="/src/main.tsx"></script>
+    <script>
+      if ('serviceWorker' in navigator) {
+        // Register a service worker hosted at the root of the
+        // site using the default scope.
+        navigator.serviceWorker
+          .register('/sw.js')
+          .then((registration) => {
+            console.log('Service worker registration succeeded:', registration);
+          })
+          .catch((err) => {
+            console.log('Service worker registration failed:', error);
+          });
+      } else {
+        console.log('Service workers are not supported.');
+      }
+    </script>
   </body>
 </html>
diff --git a/public/icons/favicon.ico b/public/icons/favicon.ico
diff --git a/public/icons/icon-144x144.png b/public/icons/icon-144x144.png
diff --git a/public/icons/icon-16x16.png b/public/icons/icon-16x16.png
diff --git a/public/icons/icon-196x196.png b/public/icons/icon-196x196.png
diff --git a/public/icons/icon-32x32.png b/public/icons/icon-32x32.png
diff --git a/public/icons/icon-512x512.png b/public/icons/icon-512x512.png
diff --git a/public/icons/icon-72x72.png b/public/icons/icon-72x72.png
diff --git a/public/manifest.json b/public/manifest.json
@@ -0,0 +1,46 @@
+{
+  "name": "vite-pwa",
+  "short_name": "꿈틀",
+  "start_url": "/",
+  "display": "standalone",
+  "background_color": "#ffffff",
+  "theme_color": "#485EEE",
+  "icons": [
+    {
+      "src": "icons/icon-16x16.png",
+      "sizes": "16x16",
+      "type": "image/png",
+      "purpose": "any maskable"
+    },
+    {
+      "src": "icons/icon-32x32.png",
+      "sizes": "32x32",
+      "type": "image/png",
+      "purpose": "any maskable"
+    },
+    {
+      "src": "icons/icon-72x72.png",
+      "sizes": "72x72",
+      "type": "image/png",
+      "purpose": "any maskable"
+    },
+    {
+      "src": "icons/icon-144x144.png",
+      "sizes": "144x144",
+      "type": "image/png",
+      "purpose": "any maskable"
+    },
+    {
+      "src": "icons/icon-196x196.png",
+      "sizes": "196x196",
+      "type": "image/png",
+      "purpose": "any maskable"
+    },
+    {
+      "src": "icons/icon-512x512.png",
+      "sizes": "512x512",
+      "type": "image/png",
+      "purpose": "any maskable"
+    }
+  ]
+}
diff --git a/sw.js b/sw.js
@@ -0,0 +1,14 @@
+// install event
+self.addEventListener('install', (e) => {
+  console.log('[Service Worker] installed');
+});
+
+// activate event
+self.addEventListener('activate', (e) => {
+  console.log('[Service Worker] actived', e);
+});
+
+// fetch event
+self.addEventListener('fetch', (e) => {
+  console.log('[Service Worker] fetched resource ' + e.request.url);
+});