nextjs-seo

Optimize Next.js App Router SEO with metadata, sitemaps, and JSON-LD.

Updated Feb 21, 2026
One-click install
npx skills add https://github.com/HCMUTE-RTIC/fit-hcmute --skill nextjs-seo-hcmute-rtic
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: nextjs-seo
Source: https://github.com/HCMUTE-RTIC/fit-hcmute/tree/main/.claude/skills/laguagu-claude-code-nextjs-skills-nextjs-seo
Command: npx skills add https://github.com/HCMUTE-RTIC/fit-hcmute --skill nextjs-seo-hcmute-rtic

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill provides comprehensive guidance and tools to ensure your Next.js applications are discoverable and rank well in search engine results.

Core Features & Use Cases

  • Metadata Optimization: Implement essential SEO tags like title, description, Open Graph, and Twitter Cards.
  • Sitemap & Robots.txt: Generate and configure sitemaps and robots.txt files for effective crawling.
  • Structured Data: Integrate JSON-LD for rich results and better search engine understanding.
  • Use Case: You've built a new Next.js e-commerce site and need to ensure all product pages are indexed correctly by Google, appear with rich snippets, and are easily found by potential customers.

Quick Start

Use the nextjs-seo skill to generate the basic metadata, sitemap, and robots.txt files for a new Next.js application.

Frequently Asked Questions about nextjs-seo

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I optimize my Next.js App Router application for search engines?

Optimize Next.js for search engines by implementing dynamic metadata, generating sitemaps and robots.txt files, and integrating JSON-LD structured data to ensure effective crawling and indexing. The App Router supports these technical SEO requirements natively.

How do I generate a sitemap and robots.txt in Next.js?

Generate a sitemap and robots.txt in Next.js using built-in App Router conventions to configure file rules for effective crawling. This ensures search engines can discover and access your application pages without manual configuration.

How do I add JSON-LD structured data to Next.js pages?

Add JSON-LD structured data to Next.js pages to provide search engines with explicit context about your content. This integration enables rich results in search engine listings and improves content understanding for better discoverability.

Can I implement dynamic metadata for e-commerce product pages in Next.js?

Implement dynamic metadata in Next.js for e-commerce product pages by defining title, description, Open Graph, and Twitter Card tags. This ensures all product pages are indexed correctly and appear with rich snippets in search results.

Does the Next.js App Router support core web vitals optimization?

The Next.js App Router supports core web vitals optimization by addressing technical SEO requirements within your rendering strategies. This approach ensures your application maintains performance metrics while remaining discoverable to search engines.

What's the best way to configure Open Graph and Twitter Card tags in Next.js?

Configure Open Graph and Twitter Card tags in Next.js through the App Router metadata API to optimize social sharing. This implementation provides essential SEO tags that control how your links appear across social platforms.