Merge pull request #47 from dnd-side-project/seo

doc: SEO 검색 최적화 작업
dnd-side-project · Sep 8, 2023 · 571224d · 571224d
2 parents 90bdab8 + 645f180
commit 571224d
Show file tree

Hide file tree

Showing 8 changed files with 141 additions and 78 deletions.
diff --git a/public/manifest.json b/public/manifest.json
@@ -1,6 +1,6 @@
 {
   "name": "PosePicker",
-  "short_name": "PosePicker",
+  "short_name": "포즈피커",
   "theme_color": "#1976d2",
   "background_color": "#fafafa",
   "display": "standalone",

diff --git a/src/app/(Main)/feed/FeedSection.tsx b/src/app/(Main)/feed/FeedSection.tsx
@@ -0,0 +1,77 @@
+'use client';
+
+import { useRouter, useSearchParams } from 'next/navigation';
+import { useCallback } from 'react';
+
+import EmptyCase from './components/EmptyCase';
+import FilterSheet from './components/FilterSheet';
+import FilterTab from './components/FilterTab';
+import PhotoList from './components/PhotoList';
+import { usePoseFeedQuery } from '@/apis';
+import { Spacing } from '@/components/Spacing';
+import { URL } from '@/constants/url';
+import useDidMount from '@/hooks/useDidMount';
+import useFilterState from '@/hooks/useFilterState';
+import useIntersect from '@/hooks/useObserver';
+
+export default function FeedSection() {
+  const params = useSearchParams();
+  const router = useRouter();
+
+  const { filterState, updateFilterState } = useFilterState();
+  const { data, fetchNextPage, hasNextPage, isLoading } = usePoseFeedQuery(filterState);
+
+  useDidMount(() => {
+    if (!params.get('filter')) return;
+    updateFilterState({
+      tags: new Array(params.get('filter') || ''),
+      frameCount: 0,
+      peopleCount: 0,
+    });
+    router.replace('/feed');
+  });
+
+  const onIntersect = useCallback(async () => {
+    if (hasNextPage && !isLoading) {
+      await fetchNextPage();
+    }
+  }, [fetchNextPage, hasNextPage, isLoading]);
+
+  const target = useIntersect(onIntersect);
+
+  return (
+    <>
+      <FilterTab />
+      <Spacing size={40} />
+      <div className="h-fit overflow-y-scroll">
+        {data?.pages[0].recommendation ? (
+          <>
+            <EmptyCase
+              title={'신비한 포즈를 찾으시는군요!'}
+              text={'찾고 싶은 포즈를 저희에게 알려주세요.'}
+              button={'문의사항 남기기'}
+              path={URL.inquiry}
+            />
+            <h4 className="mb-16">이런 포즈는 어때요?</h4>
+            <div className="columns-2	py-16">
+              {data?.pages.map((page) => (
+                <PhotoList
+                  key={page.recommendedContents.number}
+                  data={page.recommendedContents.content}
+                />
+              ))}
+            </div>
+          </>
+        ) : (
+          <div className="columns-2	py-16">
+            {data?.pages.map((page) => (
+              <PhotoList key={page.filteredContents.number} data={page.filteredContents.content} />
+            ))}
+          </div>
+        )}
+        <div ref={target} className="h-1" />
+      </div>
+      <FilterSheet />
+    </>
+  );
+}
diff --git a/src/app/(Main)/feed/page.tsx b/src/app/(Main)/feed/page.tsx
@@ -1,77 +1,10 @@
-'use client';
+import { Metadata } from 'next';
+import FeedSection from './FeedSection';
 
-import { useRouter, useSearchParams } from 'next/navigation';
-import { useCallback } from 'react';
-
-import EmptyCase from './components/EmptyCase';
-import FilterSheet from './components/FilterSheet';
-import FilterTab from './components/FilterTab';
-import PhotoList from './components/PhotoList';
-import { usePoseFeedQuery } from '@/apis';
-import { Spacing } from '@/components/Spacing';
-import { URL } from '@/constants/url';
-import useDidMount from '@/hooks/useDidMount';
-import useFilterState from '@/hooks/useFilterState';
-import useIntersect from '@/hooks/useObserver';
+export const metadata: Metadata = {
+  title: '포즈피드',
+};
 
 export default function Feed() {
-  const params = useSearchParams();
-  const router = useRouter();
-
-  const { filterState, updateFilterState } = useFilterState();
-  const { data, fetchNextPage, hasNextPage, isLoading } = usePoseFeedQuery(filterState);
-
-  useDidMount(() => {
-    if (!params.get('filter')) return;
-    updateFilterState({
-      tags: new Array(params.get('filter') || ''),
-      frameCount: 0,
-      peopleCount: 0,
-    });
-    router.replace('/feed');
-  });
-
-  const onIntersect = useCallback(async () => {
-    if (hasNextPage && !isLoading) {
-      await fetchNextPage();
-    }
-  }, [fetchNextPage, hasNextPage, isLoading]);
-
-  const target = useIntersect(onIntersect);
-
-  return (
-    <>
-      <FilterTab />
-      <Spacing size={40} />
-      <div className="h-fit overflow-y-scroll">
-        {data?.pages[0].recommendation ? (
-          <>
-            <EmptyCase
-              title={'신비한 포즈를 찾으시는군요!'}
-              text={'찾고 싶은 포즈를 저희에게 알려주세요.'}
-              button={'문의사항 남기기'}
-              path={URL.inquiry}
-            />
-            <h4 className="mb-16">이런 포즈는 어때요?</h4>
-            <div className="columns-2	py-16">
-              {data?.pages.map((page) => (
-                <PhotoList
-                  key={page.recommendedContents.number}
-                  data={page.recommendedContents.content}
-                />
-              ))}
-            </div>
-          </>
-        ) : (
-          <div className="columns-2	py-16">
-            {data?.pages.map((page) => (
-              <PhotoList key={page.filteredContents.number} data={page.filteredContents.content} />
-            ))}
-          </div>
-        )}
-        <div ref={target} className="h-1" />
-      </div>
-      <FilterSheet />
-    </>
-  );
+  return <FeedSection />;
 }
diff --git a/src/app/(Main)/pick/page.tsx b/src/app/(Main)/pick/page.tsx
@@ -1,4 +1,9 @@
 import PickSection from './components/PickSection';
+import { Metadata } from 'next';
+
+export const metadata: Metadata = {
+  title: '포즈픽',
+};
 
 export default function Pick() {
   return <PickSection />;

diff --git a/src/app/(Main)/talk/page.tsx b/src/app/(Main)/talk/page.tsx
@@ -1,6 +1,11 @@
 import TalkSection from './components/TalkSection';
 import TitleSection from './components/TitleSection';
 import { Spacing } from '@/components/Spacing';
+import { Metadata } from 'next';
+
+export const metadata: Metadata = {
+  title: '포즈톡',
+};
 
 export default function Talk() {
   return (

diff --git a/src/app/layout.tsx b/src/app/layout.tsx
@@ -6,23 +6,29 @@ import { Suspense } from 'react';
 
 import { Analytics } from '@/components/Analytics';
 import { OverlayProvider } from '@/components/Overlay/OverlayProvider';
-import { BASE_SITE_URL, GA_ID } from '@/constants';
+import { BASE_SITE_URL } from '@/constants';
 import QueryProvider from '@/provider/QueryProvider';
 import RecoilContextProvider from '@/provider/RecoilContextProvider';
 
 import type { Metadata } from 'next';
 
 const DEFAULT_OG_TITLE = 'PosePicker';
-const DEFAULT_OG_DESC = '포토부스에서 고민하는 당신을 위한 포즈 추천';
+const DEFAULT_OG_DESC = '다음 포즈 뭐하지? 포즈피커가 포즈 고민을 해결해 드릴게요!';
 const DEFAULT_OG_IMAGE = '/images/main_star.png';
 
 export const metadata: Metadata = {
   metadataBase: new URL(BASE_SITE_URL),
   title: {
-    template: DEFAULT_OG_TITLE,
     default: DEFAULT_OG_TITLE,
+    template: `${DEFAULT_OG_TITLE} | %s`,
+  },
+  description: '다음 포즈 뭐하지? 포즈피커의 포즈 추천으로 포즈 고민을 해결해 드릴게요!',
+  verification: {
+    google: 'MB7qV_Oa4G4gR0jHgjtnE6S4g4blocE2mjo7z-z2f6Q',
+  },
+  other: {
+    'naver-site-verification': '65f3aba9349cce28018ac7a97d4f87ff00709aa3',
   },
-  description: DEFAULT_OG_DESC,
   openGraph: {
     title: DEFAULT_OG_TITLE,
     description: DEFAULT_OG_DESC,

diff --git a/src/app/robots.txt b/src/app/robots.txt
@@ -0,0 +1,4 @@
+User-Agent: *
+Allow: /
+
+Sitemap: https://www.posepicker.site/sitemap.xml
diff --git a/src/app/sitemap.xml b/src/app/sitemap.xml
@@ -0,0 +1,33 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
+<url>
+  <loc>https://www.posepicker.site/pick</loc>
+  <lastmod>2023-09-08T15:55:51+00:00</lastmod>
+  <priority>1.00</priority>
+</url>
+<url>
+  <loc>https://www.posepicker.site/menu</loc>
+  <lastmod>2023-09-08T15:55:51+00:00</lastmod>
+  <priority>0.80</priority>
+</url>
+<url>
+  <loc>https://www.posepicker.site/talk</loc>
+  <lastmod>2023-09-08T15:55:51+00:00</lastmod>
+  <priority>0.80</priority>
+</url>
+<url>
+  <loc>https://www.posepicker.site/feed</loc>
+  <lastmod>2023-09-08T15:55:51+00:00</lastmod>
+  <priority>0.80</priority>
+</url>
+<url>
+  <loc>https://www.posepicker.site/bookmark</loc>
+  <lastmod>2023-09-08T15:55:51+00:00</lastmod>
+  <priority>0.80</priority>
+</url>
+<url>
+  <loc>https://www.posepicker.site/detail/undefined</loc>
+  <lastmod>2023-09-08T15:55:51+00:00</lastmod>
+  <priority>0.64</priority>
+</url>
+</urlset>