refactor: 파비콘 변경 및 정적 댓글 기능 추가

app/layout.tsx

@@ -56,6 +56,9 @@ export const metadata: Metadata = {
     card: 'summary_large_image',
     images: [siteMetadata.socialBanner],
   },
+  icons: {
+    icon: '/static/favicons/logo.png',
+  },
 }
 
 export default function RootLayout({ children }: { children: React.ReactNode }) {

app/tag-data.json

@@ -1 +1 @@
-{ "all": 12, "frontend": 7, "backend": 20, "backend-frontend": 2 }
+{ "all": 11, "frontend": 8, "backend": 20, "backend-frontend": 2 }

components/Comments.tsx

@@ -1,22 +1,7 @@
 'use client'
 
-import { Comments as CommentsComponent } from 'pliny/comments'
-import { useState } from 'react'
-import siteMetadata from '@/data/siteMetadata'
+import Giscus from './Gitcus'
 
 export default function Comments({ slug }: { slug: string }) {
-  const [loadComments, setLoadComments] = useState(false)
-
-  if (!siteMetadata.comments?.provider) {
-    return null
-  }
-  return (
-    <>
-      {loadComments ? (
-        <CommentsComponent commentsConfig={siteMetadata.comments} slug={slug} />
-      ) : (
-        <button onClick={() => setLoadComments(true)}>Load Comments</button>
-      )}
-    </>
-  )
+  return <Giscus />
 }

components/Gitcus.tsx

@@ -0,0 +1,16 @@
+'use client'
+
+import dynamic from 'next/dynamic'
+const DynamicGiscus = dynamic(() => import('@giscus/react'))
+
+export default function Comments() {
+  return (
+    <DynamicGiscus
+      repo="WE-ARE-RACCOONS/RACCOONS"
+      repoId="R_kgDONOeDQg"
+      mapping="pathname"
+      lang="ko"
+      category="General"
+    />
+  )
+}

data/siteMetadata.js

@@ -7,7 +7,7 @@ const siteMetadata = {
   siteUrl: 'https://tailwind-nextjs-starter-blog.vercel.app',
   siteRepo: 'https://github.com/WE-ARE-RACCOONS/RACCOONS',
   siteLogo: `${process.env.BASE_PATH || ''}/static/images/logo.png`,
-  email: '706shin1728@naver.com',
+  email: 'grad.kimseonbae@gmail.com',
   analytics: {
     umamiAnalytics: {
       umamiWebsiteId: process.env.NEXT_UMAMI_ID, // e.g. 123e4567-e89b-12d3-a456-426614174000

package.json

@@ -12,6 +12,7 @@
     "prepare": "husky"
   },
   "dependencies": {
+    "@giscus/react": "^3.0.0",
     "@headlessui/react": "2.2.0",
     "@next/bundle-analyzer": "15.0.2",
     "@tailwindcss/forms": "^0.5.9",

tailwind.config.js

@@ -25,7 +25,7 @@ module.exports = {
         sans: ['var(--font-space-grotesk)', ...fontFamily.sans],
       },
       colors: {
-        primary: colors.pink,
+        primary: colors.green,
         gray: colors.gray,
       },
       zIndex: {
@@ -58,7 +58,7 @@ module.exports = {
         invert: {
           css: {
             a: {
-              color: theme('colors.primary.500'),
+              color: theme('colors.gray.400'),
               '&:hover': {
                 color: `${theme('colors.primary.400')}`,
               },