feat: add pwa to projectshut

app/layout.tsx

@@ -1,28 +1,43 @@
-import "./globals.css";
-import { Inter } from "next/font/google";
+import { Footer, Navbar, ScrollToTop } from "@/components";
 import { MobileNavBar } from "@/components/MobileNavbar";
-import { Navbar, Footer, ScrollToTop } from "@/components";
+import "@/public/manifest.json";
 import { Metadata } from "next";
-
+import { Inter } from "next/font/google";
+import "./globals.css";
 
 const inter = Inter({ subsets: ["latin"] });
 
 export const metadata: Metadata = {
   metadataBase: new URL("https://projectshut.vercel.app/"),
+  manifest: "/manifest.json",
   title: {
     default: "ProjectsHut - Learn. Build. Share.",
-    template: '%s - ProjectsHut',
+    template: "%s - ProjectsHut",
   },
-  description: "A platform where you can share your open source projects with the world.",
-  keywords: ["ProjectHut", "projects", "educational resources","wide range of products", "high-quality projects", "React", "Nodejs", "JavaScript", "open source", "contribution", "learners"],
-  authors: {name: "Priyankar Pal"},
+  description:
+    "A platform where you can share your open source projects with the world.",
+  keywords: [
+    "ProjectHut",
+    "projects",
+    "educational resources",
+    "wide range of products",
+    "high-quality projects",
+    "React",
+    "Nodejs",
+    "JavaScript",
+    "open source",
+    "contribution",
+    "learners",
+  ],
+  authors: { name: "Priyankar Pal" },
   openGraph: {
-    title: 'ProjectsHut - Learn. Build. Share.',
-    description: 'A platform where you can share your open source projects with the world.',
-    url: 'https://projectshut.vercel.app',
-    siteName: 'ProjectHut',
-    locale: 'en-US',
-    type: 'website',
+    title: "ProjectsHut - Learn. Build. Share.",
+    description:
+      "A platform where you can share your open source projects with the world.",
+    url: "https://projectshut.vercel.app",
+    siteName: "ProjectHut",
+    locale: "en-US",
+    type: "website",
   },
   robots: {
     index: true,
@@ -36,10 +51,12 @@ export const metadata: Metadata = {
     },
   },
   twitter: {
-    title: 'ProjectsHut - Learn. Build. Share.',
-    card: 'summary_large_image',
-    description: "A platform where you can share your open source projects with the world.",
-    images: "https://user-images.githubusercontent.com/88102392/251507361-e71396f9-92c6-4664-b7e4-4275cb902e65.png"
+    title: "ProjectsHut - Learn. Build. Share.",
+    card: "summary_large_image",
+    description:
+      "A platform where you can share your open source projects with the world.",
+    images:
+      "https://user-images.githubusercontent.com/88102392/251507361-e71396f9-92c6-4664-b7e4-4275cb902e65.png",
   },
 };
 

next.config.js

@@ -1,4 +1,9 @@
 /** @type {import('next').NextConfig} */
+const withPWA = require("next-pwa")({
+  dest: "public",
+  register: true,
+  skipWaiting: true,
+});
 
 const nextConfig = {
   images: {
@@ -9,7 +14,7 @@ const nextConfig = {
       "github.com",
     ],
   },
-  trailingSlash: true,
+  trailingSlash: true
 };
 
-module.exports = nextConfig;
+module.exports = withPWA(nextConfig);

package.json

@@ -22,6 +22,8 @@
     "eslint-config-next": "13.4.13",
     "framer-motion": "^10.15.1",
     "next": "^13.4.13",
+    "next-pwa": "^5.6.0",
+    "pnpm": "^8.6.12",
     "postcss": "8.4.27",
     "react": "18.2.0",
     "react-dom": "18.2.0",
@@ -34,9 +36,9 @@
     "typescript": "5.1.6"
   },
   "devDependencies": {
-    "@commitlint/config-conventional": "^17.7.0",
     "@commitlint/cli": "^17.7.0",
+    "@commitlint/config-conventional": "^17.7.0",
     "@types/react-syntax-highlighter": "^15.5.7",
     "husky": "^8.0.3"
   }
-}
+}