React seo skills
About
SEO skills for coding agents
Details
- Author
- daniel-amekpoagbe
- Categories
- Other, Marketing
Jump to
Setup
Install React seo skills in your MCP client (Claude Desktop, Cursor, Windsurf, and others).
Repository: https://github.com/daniel-amekpoagbe/react-seo-skills
Follow the installation instructions in the repository README, then restart your MCP client.
It covers the full workflow — keyword strategy, metadata, Open Graph, Schema.org JSON-LD, sitemaps,robots.txt, andllms.txt— with patterns tailored to your stack: Next.js App Router, Pages Router, or Vite + React.
[!IMPORTANT]This is a CLI installer, not a runtime dependency.Runnpx react-seo-skills— donotrunnpm install react-seo-skills.npm installonly downloads the package; it never copies the skill into your agent's directory, so nothing will appear to happen. If you added it to your dependencies by mistake, remove it withnpm uninstall react-seo-skillsand runnpx react-seo-skillsinstead.
- How agent skills work
- Why this exists
- Quick start
- CLI reference
- Where it installs
- Updating
- What the agent learns
- Supported stacks
- Example prompts
- Skill structure
- Requirements
- Roadmap
- Contributing
- Author
- License
This package does not add a runtime dependency to your app. It installs a set of Markdown files — anagent skill— into your AI coding agent's skill directory. When you ask the agent an SEO question, it discovers the skill from thedescriptioninSKILL.mdand reads the relevant reference files on demand.
In short, you are installingknowledge, not a library. Nothing is imported into your code and nothing ships to production. This is also why you run it withnpx(which executes the installer) instead ofnpm install(which would only download the files without copying them into place).
Most SEO advice is generic and stack-agnostic. This skill is built for how modern React apps actually ship:
- Language-aware.Detects JavaScript vs TypeScript and writes code in the matching language — no stray types in a JS project, no missing types in a TS one.
- Stack-aware.Detects Next.js App Router, Pages Router, or Vite + React and applies the correct APIs for each. It never mixes Next.js patterns into a Vite project, or vice versa.
- GEO-ready.Covers Generative Engine Optimization — making your site legible and citable to ChatGPT, Perplexity, Claude, and Google AI Overviews.
- Version-aware.Tells the agent its training data may be stale — it must check the installed framework versions and current docs before writing code, instead of implementing from memory.
- Asks, doesn't guess.The agent asks for your real site name, domain, OG image, and social handles — placeholder values never slip silently into your codebase.
- DRY by design.Metadata is defined once — through a sharedSEOcomponent, layout-level defaults, or schema helpers — never copy-pasted across pages.
- SPA-honest.Installs and configuresreact-helmet-asyncfor client-rendered apps, and warns clearly about the SEO limits of CSR.
- Audit-capable.Includes a structured SEO audit workflow the agent can run against an existing project and report back as Critical / Suggestion / OK.
Run from your project root and follow the prompts:
By default this installs the skill for all three agents (Cursor, Claude Code, and Codex) into the current project. No extra configuration is required — agents discover the skill automatically from thedescriptioninSKILL.md.
You can combine flags. A few common examples:
npx react-seo-skills --global # available in every project npx react-seo-skills --cursor --claude # only these two agents npx react-seo-skills --codex --force # reinstall for Codex, overwriting npx react-seo-skills --dry-run # preview the changes first
After installing, restartClaude CodeorCodexif the skill does not appear — they rescan their skill directories on startup. Cursor picks it up automatically.
To pull the latest version into an existing install, re-run with@latestand--force:
- @latestbypasses thenpxcache. A plainnpx react-seo-skillsmay re-run an older cached copy without checking the registry.
- --forceoverwrites the existing skill files — without it the installer detects the current install and skips with "already exists."
After updating, restartClaude CodeorCodexso they rescan the skill directory. Cursor picks up changes automatically.
See theroadmapfor details on planned stacks.
Once the skill is installed, ask your agent things like:
- "Set up SEO metadata for my Next.js app."
- "Audit the SEO on this project and report what's missing."
- "Add Schema.org JSON-LD to my blog posts."
- "Write anllms.txtso AI search engines understand my site."
- "My Vite SPA isn't ranking — what should I do?"
- "Set up a sitemap androbots.txtthat allow AI crawlers."
skill/ ├── SKILL.md Entry point — rules, detection order, audit workflow └── references/ ├── language.md JavaScript vs TypeScript detection ├── keywords.md Keyword clustering and validation ├── app-router.md Next.js App Router patterns ├── pages-router.md Next.js Pages Router patterns ├── react-vite.md Vite / SPA workflow ├── react-helmet-async.md react-helmet-async install and API reference ├── structured-data.md Schema.org JSON-LD templates ├── geo.md AI visibility (GEO) └── validation.md Post-implementation checklist
SKILL.mdstays intentionally small. It links to the reference files, which the agent loads only when they are relevant to the task.
- Node.js 18 or newer
- A project usingNext.jsorReact(Vite or CRA)
Upcoming stack support is tracked inCHANGELOG.md:
Want to help build these? SeeCONTRIBUTING.md.
Contributions are welcome — content corrections, new stack support, and installer improvements. Start withCONTRIBUTING.mdand please read theCode of Conduct.
git clone https://github.com/daniel-amekpoagbe/react-seo-skills.git cd react-seo-skills npm test
Daniel Amekpoagbe— Full-Stack Developer, Accra, Ghana.
Building fast, SEO-ready React and Next.js apps. Portfolio atamekpoagbe.com.
MIT— Copyright (c) 2026 Daniel Amekpoagbe
Free AI citation readiness checker. Score any website 0-100 across 5 dimensions using the Citation Probability Score® (CPS®) framework. Checks structured data, meta tags, content quality, technical config, and AI signals.
Connect Google Search Console to Claude or ChatGPT via Two Minute Reports MCP. Analyze top-performing queries, pages, and SEO trends to grow search visibility.
MCP server for "Audit https://example.com"
MCP server for "Audit https://example.com"
An MCP Server to Control Your AI Visibility Through Reaudit.io
Live agent tools for domains, X, Google Trends, SEO, YouTube, TikTok, and more.
SEO & GEO (Generative Engine Optimization) for websites. Optimize for AI search engines (ChatGPT, Perplexity, Gemini, Copilot, Claude) and traditional search (Google, Bing). Includes Princeton GEO research methods for +40% AI visibility
Official Ahrefs MCP server that lets AI agents securely access Ahrefs SEO data, site metrics, keyword research, and competitor analysis through the Ahrefs API.
GEO optimized content publishing engine for AI visibility
All-in-One SEO & Web Intelligence Toolkit API from FetchSERP.
Sign in to leave a review
Use Google, GitHub, or an email account so ratings stay tied to real people.
No reviews posted yet.
