배포 직전 sitemap·robots 핸들러를 뒤늦게 추가한 이유

sitemap.ts + robots.ts 두 파일을 만들었다. SEO 쪽 기초 파일인데, 프로젝트 막바지에 이걸 추가하는 상황이 어떻게 만들어졌는지 좀 풀어봐야겠다.

왜 지금이었나

pdf2api 프로젝트는 초반에 기능 구현에 집중하다 보니 SEO 관련 설정이 뒤로 밀려 있었다. 실제로 팀 안에서도 "일단 기능 먼저, SEO는 나중에" 라는 암묵적 합의가 있었던 게 사실이다. 근데 이게 꼭 나쁜 선택이라고 할 수는 없다 — 아직 라우팅 구조가 확정되지 않은 시점에 sitemap을 미리 만들어봤자 계속 수정해야 하니까.

문제는 "나중에"가 항상 예상보다 더 늦게 온다는 거다. 이번에도 배포 직전이 돼서야 "sitemap이랑 robots 아직 없죠?" 라는 이야기가 나왔다. 이런 상황이 반복되면 팀 입장에선 기술 부채처럼 쌓이기 때문에, 이번엔 내가 직접 핀포인트로 처리했다.

sitemap.ts + robots.ts, 뭘 한 거냐

Next.js App Router 기준으로 두 파일 모두 src/app/ 아래에 넣으면 프레임워크가 알아서 /sitemap.xml, /robots.txt 경로로 서빙해준다. 수동으로 public/ 폴더에 정적 파일 넣는 방식 대비 이점이 명확하다.

sitemap.ts는 MetadataRoute.Sitemap 타입을 반환하는 함수를 export 하는 구조고, robots.ts는 MetadataRoute.Robots를 반환한다. 두 파일 모두 TypeScript 타입 덕분에 오탈자나 잘못된 필드명은 컴파일 타임에 잡힌다는 게 장점이다.

// sitemap.ts 기본 패턴
import { MetadataRoute } from 'next'

export default function sitemap(): MetadataRoute.Sitemap {
  return [
    {
      url: 'https://example.com',
      lastModified: new Date(),
      changeFrequency: 'monthly',
      priority: 1,
    },
  ]
}

// robots.ts 기본 패턴
import { MetadataRoute } from 'next'

export default function robots(): MetadataRoute.Robots {
  return {
    rules: {
      userAgent: '*',
      allow: '/',
    },
    sitemap: 'https://example.com/sitemap.xml',
  }
}

robots.ts에서 sitemap URL을 명시적으로 연결해두는 게 포인트다. 크롤러 입장에서 robots.txt 안에 sitemap 위치가 적혀 있으면 별도로 sitemap을 발견하지 않아도 되니까 인덱싱 속도 면에서 유리하다.

회고

작업 자체는 파일 두 개, 코드 몇 줄이지만 이 타이밍에 넣는 의사결정이 중요했다고 생각한다. SEO 파일은 배포 직전에 급히 넣으면 사이트맵 URL이 잘못 들어가거나, robots에서 특정 경로를 의도치 않게 막는 실수가 생기기 쉽다. 특히 Disallow 경로를 잘못 설정하면 크롤러가 핵심 페이지를 아예 못 읽는 상황이 생기는데, 이런 건 배포 후에 발견하기가 어렵다.

앞으로 프로젝트 초기 세팅 체크리스트에 "sitemap / robots 핸들러 파일 스캐폴딩"을 기본으로 넣어두는 게 맞겠다는 생각을 다시 했다. 내용은 나중에 채워도 되니까, 파일 구조는 처음부터 잡아두는 쪽이 팀 전체 흐름에 더 낫다.

다음

🛒 이 글과 어울리는 추천 상품

• 기계식키보드 쿠팡에서 보기 →
• 외장SSD 쿠팡에서 보기 →
• 모니터암 쿠팡에서 보기 →

*위 링크는 쿠팡파트너스 활동의 일환이며, 일정액의 수수료를 제공받을 수 있습니다.