refactor: ♻️ meta tags

apps/web/src/app/(routes)/all/page.tsx

@@ -88,6 +88,10 @@ interface Section {
   items: SectionItem[];
 }
 
+export const metadata = {
+  title: "전체",
+};
+
 export default function All() {
   const items = [
     {

apps/web/src/app/(routes)/benefit/page.tsx

@@ -1,5 +1,6 @@
 "use client";
 
+import { useTitle } from "ahooks";
 import clsx from "clsx";
 import { useAnimate, useMotionValueEvent, useScroll } from "framer-motion";
 import {
@@ -27,6 +28,7 @@ import { formatNumber } from "~/utils/number";
 const scrollState = proxy({ scrollY: 0, direction: 0 });
 
 export default function Benefit() {
+  useTitle("혜택 | Doss");
   const { direction } = useSnapshot(scrollState);
   const router = useRouter();
   const { scrollY } = useScroll();

apps/web/src/app/(routes)/page.tsx

@@ -11,7 +11,7 @@ import {
 } from "~/components/main";
 
 export const metadata = {
-  title: "Doss | 홈",
+  title: "홈",
 };
 
 export default function Home() {

apps/web/src/app/(routes)/pay/page.tsx

@@ -9,7 +9,7 @@ import {
 } from "~/components/pay";
 
 export const metadata = {
-  title: "Doss | 도스페이",
+  title: "도스페이",
 };
 
 export default function Pay() {

apps/web/src/app/(routes)/stock/page.tsx

@@ -8,7 +8,7 @@ import {
 import StockHeader from "~/components/stock/StockHeader";
 
 export const metadata = {
-  title: "Doss | 주식",
+  title: "주식",
 };
 
 export default function Stock() {

apps/web/src/app/layout.tsx

@@ -9,14 +9,47 @@ import type { ReactNode } from "react";
 import type { Metadata, Viewport } from "next";
 import { TRPCReactProvider } from "~/trpc/react";
 
+const APP_NAME = "Doss";
+const APP_TITLE_TEMPLATE = "%s | Doss";
+const APP_DESCRIPTION = "Duplicated version of Toss";
+
 const notoSansKR = Noto_Sans_KR({
   subsets: ["latin"],
   variable: "--font-sans",
 });
 
 export const metadata: Metadata = {
-  title: "Doss",
-  description: "Duplicated version of Toss",
+  applicationName: APP_NAME,
+  title: {
+    default: APP_NAME,
+    template: APP_TITLE_TEMPLATE,
+  },
+  description: APP_DESCRIPTION,
+  appleWebApp: {
+    capable: true,
+    statusBarStyle: "default",
+    title: APP_NAME,
+  },
+  formatDetection: {
+    telephone: false,
+  },
+  openGraph: {
+    type: "website",
+    siteName: APP_NAME,
+    title: {
+      default: APP_NAME,
+      template: APP_TITLE_TEMPLATE,
+    },
+    description: APP_DESCRIPTION,
+  },
+  twitter: {
+    card: "summary",
+    title: {
+      default: APP_NAME,
+      template: APP_TITLE_TEMPLATE,
+    },
+    description: APP_DESCRIPTION,
+  },
   icons: [
     { rel: "icon", url: "/favicon.ico" },
     { rel: "icon", url: "/favicon-16x16.png", sizes: "16x16" },

apps/web/src/app/manifest.ts

@@ -22,5 +22,23 @@ export default function manifest(): MetadataRoute.Manifest {
     start_url: "/?pwa=1",
     display: "standalone",
     orientation: "portrait",
+    screenshots: [
+      {
+        src: "demo1.png",
+        sizes: "390x844",
+      },
+      {
+        src: "demo2.png",
+        sizes: "390x844",
+      },
+      {
+        src: "demo3.png",
+        sizes: "390x844",
+      },
+      {
+        src: "demo4.png",
+        sizes: "390x844",
+      },
+    ],
   };
 }