diff --git a/frontend/src/app/(with-header)/(home)/nearby/page.tsx b/frontend/src/app/(with-header)/(home)/nearby/page.tsx index be84ec8a8..cb9245552 100644 --- a/frontend/src/app/(with-header)/(home)/nearby/page.tsx +++ b/frontend/src/app/(with-header)/(home)/nearby/page.tsx @@ -3,8 +3,22 @@ import MapComponent from '@/app/_components/naver-map/MapComponent'; import ViewTravelMap from '@/app/_components/near/ViewTravelMap'; import { getMySpotIds } from '@/app/_components/near/hooks/nearActions'; import { myInfoSchema } from '@/types/response'; +import { Metadata } from 'next'; import React from 'react'; +export const metadata: Metadata = { + title: '장소/코스 검색', + description: `원하는 장소/코스를 검색해보세요.`, + openGraph: { + title: '장소/코스 검색', + description: `원하는 장소/코스를 검색해보세요.`, + }, + twitter: { + title: '장소/코스 검색', + description: `원하는 장소/코스를 검색해보세요.`, + }, +}; + export default async function NearbyPage() { const res = await authenticateUser(); const user = myInfoSchema.safeParse(res); diff --git a/frontend/src/app/(with-header)/(home)/places/popular/page.tsx b/frontend/src/app/(with-header)/(home)/places/popular/page.tsx index aae731189..eccde86f4 100644 --- a/frontend/src/app/(with-header)/(home)/places/popular/page.tsx +++ b/frontend/src/app/(with-header)/(home)/places/popular/page.tsx @@ -5,6 +5,20 @@ import { myInfoSchema } from '@/types/response'; import { Place } from '@/app/_components/place/places'; import { getPlaces } from '@/app/_components/place/places/action'; +import { Metadata } from 'next'; + +export const metadata: Metadata = { + title: '인기 장소/코스', + description: `현재 인기있는 장소/코스를 만나보세요.`, + openGraph: { + title: '인기 장소/코스', + description: `현재 인기있는 장소/코스를 만나보세요.`, + }, + twitter: { + title: '인기 장소/코스', + description: `현재 인기있는 장소/코스를 만나보세요.`, + }, +}; export default async function PopularPlacesPage() { const memberJson = await authenticateUser(); diff --git a/frontend/src/app/(with-header)/(home)/places/recommended/page.tsx b/frontend/src/app/(with-header)/(home)/places/recommended/page.tsx index 8b2b021d3..bd93f2a9e 100644 --- a/frontend/src/app/(with-header)/(home)/places/recommended/page.tsx +++ b/frontend/src/app/(with-header)/(home)/places/recommended/page.tsx @@ -3,6 +3,20 @@ import { myInfoSchema } from '@/types/response'; import { Place } from '@/app/_components/place/places'; import { getPlaces } from '@/app/_components/place/places/action'; +import { Metadata } from 'next'; + +export const metadata: Metadata = { + title: '맞춤 추천', + description: `개인별 맞춤 추천 지역의 장소/코스를 만나보세요.`, + openGraph: { + title: '맞춤 추천', + description: `개인별 맞춤 추천 지역의 장소/코스를 만나보세요.`, + }, + twitter: { + title: '맞춤 추천', + description: `개인별 맞춤 추천 지역의 장소/코스를 만나보세요.`, + }, +}; export default async function RecommendedPlacesPage() { const memberJson = await authenticateUser(); diff --git a/frontend/src/app/(with-header)/(home)/places/regions/[id]/page.tsx b/frontend/src/app/(with-header)/(home)/places/regions/[id]/page.tsx index 9ae4220ad..09d5e5de2 100644 --- a/frontend/src/app/(with-header)/(home)/places/regions/[id]/page.tsx +++ b/frontend/src/app/(with-header)/(home)/places/regions/[id]/page.tsx @@ -7,6 +7,20 @@ import { getInterestedRegions, getRegionPlaces } from '../../../action'; import DummyPlace from '@/app/_components/place/dummy/DummyPlace'; import { RegionPlaces } from '@/app/_components/place/places'; +import { Metadata } from 'next'; + +export const metadata: Metadata = { + title: '관심 지역', + description: `관심 지역을 설정하고 관심 지역의 장소/코스를 만나보세요.`, + openGraph: { + title: '관심 지역', + description: `관심 지역을 설정하고 관심 지역의 장소/코스를 만나보세요.`, + }, + twitter: { + title: '관심 지역', + description: `관심 지역을 설정하고 관심 지역의 장소/코스를 만나보세요.`, + }, +}; export default async function RegionsPlacePage({ params, diff --git a/frontend/src/app/(with-header)/(home)/search/page.tsx b/frontend/src/app/(with-header)/(home)/search/page.tsx index 5e3192985..40c7aef9f 100644 --- a/frontend/src/app/(with-header)/(home)/search/page.tsx +++ b/frontend/src/app/(with-header)/(home)/search/page.tsx @@ -6,6 +6,12 @@ import { myInfoSchema } from '@/types/response'; import type { TMemberStatus } from '@/context/MemberContext'; import BackendSearchBar from '@/app/_components/place/BackendSearchBar'; import TravelSearchResult from '@/app/_components/search/TravelSearchResult'; +import { Metadata } from 'next'; + +export const metadata: Metadata = { + title: '이길로그 검색 페이지', + description: '원하는 장소/코스를 검색해보세요.', +}; export default async function SearchPage({ searchParams, diff --git a/frontend/src/app/(with-header)/detail/[travel]/[id]/page.tsx b/frontend/src/app/(with-header)/detail/[travel]/[id]/page.tsx index c7f6767a5..1039795cc 100644 --- a/frontend/src/app/(with-header)/detail/[travel]/[id]/page.tsx +++ b/frontend/src/app/(with-header)/detail/[travel]/[id]/page.tsx @@ -32,7 +32,16 @@ export async function generateMetadata({ title: '장소 상세 페이지', description: '장소 상세 설명', openGraph: { - images: ['/logo/og-logo.png'], + images: { + url: '/logo/og-logo.png', + alt: '이길로그 로고', + }, + }, + twitter: { + images: { + url: '/logo/og-logo.png', + alt: '이길로그 로고', + }, }, }; } else { @@ -50,7 +59,16 @@ export async function generateMetadata({ title: '코스 상세 페이지', description: '코스 상세 설명', openGraph: { - images: ['/logo/favicon.svg'], + images: { + url: '/logo/og-logo.png', + alt: '이길로그 로고', + }, + }, + twitter: { + images: { + url: '/logo/og-logo.png', + alt: '이길로그 로고', + }, }, }; } diff --git a/frontend/src/app/(with-header)/place/[id]/page.tsx b/frontend/src/app/(with-header)/place/[id]/page.tsx index ddeddab97..acb980470 100644 --- a/frontend/src/app/(with-header)/place/[id]/page.tsx +++ b/frontend/src/app/(with-header)/place/[id]/page.tsx @@ -1,6 +1,20 @@ import PlaceDetailWithMySpot from '@/app/_components/place/detail/PlaceDetailWithMySpot'; +import { getPlaceDetail } from '@/app/_components/place/detail/action'; +import { createMetadata } from '@/utils'; +export async function generateMetadata({ params }: { params: { id: number } }) { + const detailResult = await getPlaceDetail(params.id); + if (detailResult.success) { + const data = { + title: detailResult.data.place_name, + description: detailResult.data.address, + image: detailResult.data.thumbnail_image_url, + url: `https://yigil.co.kr/place/${params.id}`, + }; + return createMetadata(data); + } +} export default async function PlaceDetailPage({ params, diff --git a/frontend/src/app/(without-header)/login/page.tsx b/frontend/src/app/(without-header)/login/page.tsx index caab35977..b58494e68 100644 --- a/frontend/src/app/(without-header)/login/page.tsx +++ b/frontend/src/app/(without-header)/login/page.tsx @@ -10,8 +10,20 @@ import { naverOAuthEndPoint } from '@/app/endpoints/api/auth/callback/naver/cons import GoogleLoginButton from '@/app/_components/ui/button/GoogleLoginButton'; import NaverLoginButton from '@/app/_components/ui/button/NaverLoginButton'; import { googleOAuthEndPoint } from '@/app/endpoints/api/auth/callback/google/constants'; +import { Metadata } from 'next'; - +export const metadata: Metadata = { + title: '로그인', + description: `로그인 후 이길로그의 여러 기능을 만나보세요`, + openGraph: { + title: '로그인', + description: `로그인 후 이길로그의 여러 기능을 만나보세요`, + }, + twitter: { + title: '로그인', + description: `로그인 후 이길로그의 여러 기능을 만나보세요`, + }, +}; export default async function LoginPage() { const { KAKAO_ID, GOOGLE_CLIENT_ID, NAVER_SEARCH_ID } = process.env; diff --git a/frontend/src/app/layout.tsx b/frontend/src/app/layout.tsx index 0b26b017b..e613e0534 100644 --- a/frontend/src/app/layout.tsx +++ b/frontend/src/app/layout.tsx @@ -14,26 +14,24 @@ const Pretendard = localFont({ }); export const metadata: Metadata = { + metadataBase: new URL('https://yigil.co.kr'), title: '이길로그', - icons: { icon: [{ url: '/logo/favicon.svg', href: '/logo/favicon.svg' }], }, - description: '지도 기반 장소 기록·공유 서비스', openGraph: { title: '이길로그 홈페이지', description: '지도 기반 장소 기록·공유 서비스', - images: ['/logo/og-logo.png'], + images: { url: '/logo/og-logo.png', alt: '이길로그 로고 이미지' }, type: 'website', siteName: '이길로그', - url: 'https://yigil.co.kr', locale: 'ko-KR', }, twitter: { title: '이길로그 홈페이지', description: '지도 기반 장소 기록·공유 서비스', - images: ['/logo/og-logo.png'], + images: { url: '/logo/og-logo.png', alt: '이길로그 로고 이미지' }, }, }; diff --git a/frontend/src/utils.ts b/frontend/src/utils.ts index e9daf15e3..88dfd6f29 100644 --- a/frontend/src/utils.ts +++ b/frontend/src/utils.ts @@ -108,14 +108,11 @@ export async function createMetadata(data: { title: title, description: description, openGraph: { - siteName: '이길로그', url: url, - locale: 'ko-KR', images: { url: image, - alt: title, + alt: `${title}-이미지`, }, - type: 'website', }, twitter: { title: title,