On-Page SEO

Next.js SEO with App Router: generateMetadata, Sitemap, and Robots.ts — Complete Guide

Next.js App Router has native SEO APIs — generateMetadata, sitemap.ts, robots.ts — that replace third-party plugins. Here is how to use all of them correctly.

• generateMetadata replaces next-seo for dynamic pages — it co-locates metadata with the page that fetches the same data
• app/sitemap.ts generates a fully dynamic XML sitemap at build time with zero configuration overhead
• app/robots.ts is the correct place to explicitly allow AI crawlers GPTBot, ClaudeBot, and PerplexityBot
• JSON-LD schema goes in the page component as a script element, not in generateMetadata which only outputs meta tags