Next.js 에서 sitemap.xml 만드는 방법

sitemap.xml 이란?

검색엔진 크롤러가 웹 사이트를 효율적으로 크롤링 하기 위해 정보를 작성해둔 파일입니다.

페이지 url, 최근 업데이트 날짜, 업데이트 주기, 우선순위 등을 작성합니다.

 

Google에 자신의 웹사이트가 검색되기를 원하면 sitemap이 있으면 좋습니다.

 

Next 13 에서 sitemap.xml 만들기

정적 sitemap 만들기

app/sitemap.xml

<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
   <url>
      <loc>https://powerku.tistory.com</loc>
      <lastmod>2023-10-24T22:21:12+09:00</lastmod>
      <priority>1.0</priority>
   </url>
   <url>
      <loc>https://powerku.tistory.com/category</loc>
   </url>
</urlset>

동적 stiemap 만들기

app/sitemap.ts

import { MetadataRoute } from 'next'
 
export default function sitemap(): MetadataRoute.Sitemap {
  return [
    {
      url: 'https://powerku.tistory.com',
      lastModified: new Date(),
      changeFrequency: 'yearly',
      priority: 1,
    },
    {
      url: 'https://powerku.tistory.com/about',
      lastModified: new Date(),
      changeFrequency: 'monthly',
      priority: 0.8,
    }
  ]
}

 

위 두가지 방법 중 하나를 사용하시면 됩니다.

해당 파일을 만들고, localhost:3000/sitemap.xml 로 접속하면, 만들어진 sitemap을 확인할 수 있습니다.

 

Metadata Files: sitemap.xml | Next.js