What problem does it solve?
React applications often have poor search engine rankings and weak social sharing previews because client-side rendering does not expose critical meta tags, structured data, and sitemap information to web crawlers and social platforms.
Core Features & Use Cases
- Next.js Metadata API Integration: Implement static and dynamic metadata, Open Graph tags, Twitter cards, and canonical URLs for Next.js apps using the built-in Metadata API.
- Structured Data Implementation: Add JSON-LD schema markup for articles, products, and organizations to qualify for rich search results and improve content discoverability.
- SPA SEO Support: Use react-helmet-async or Vike SSR to add proper meta tags for Vite-based single-page applications that cannot use the Next.js Metadata API.
- Sitemap & Robots Configuration: Generate compliant sitemaps (including split sitemaps for large sites) and robots.txt files to guide search engine crawlers and control indexing.
Use this Skill when building a React blog, e-commerce store, or marketing site to ensure your content ranks higher in search results and displays rich, engaging previews when shared on social media.
Quick Start
Use the seo-metadata skill to add Open Graph tags and JSON-LD structured data to your Next.js blog post page to improve its social sharing preview and search engine visibility.
