laguagu/claude-code-nextjs-skills
21 skills6k installs1.2k starsGitHub
Install
npx skills add https://github.com/laguagu/claude-code-nextjs-skillsSkills in this repo
1Nextjs SeoThe nextjs seo skill Next.js App Router SEO optimization and auditing. Use when implementing or fixing SEO in a Next.js app - metadata and generateMetadata, viewport/themeColor, Open Graph and og/twitter images (file conventions + ImageResponse), web app manifest, favicons/icons, sitemap.xml, robots.txt, canonical URLs, hreflang/i18n alternates, JSON-LD structured data and rich results, Core Web Vitals (LCP/INP/CLS), AI search/GEO and AI crawler rules (GPTBot, OAI-SearchBot), or diagnosing Google indexing problems (Search Console, "Discovered/Crawled - currently not indexed"). Also use to run an SEO audit checklist. Not for general Next.js feature work unrelated to SEO. Documentation covers workflows, commands, and guardrails agents should follow when users invoke this capability. Key documented areas include **Check robots.txt**: `curl https://your-site.com/robots.txt`; **Check sitemap**: `curl https://your-site.com/sitemap.xml`; **Check metadata**: View page source, search for `<title>` and `<meta name="description">`; **Check JSON-LD**: View page source, search for `application/ld+json`. Use when developers or agents need structured guidance for nextjs seo tasks with evidence.1.7kinstalls2Openai Agents Sdkopenai-agents-sdk is a Claude Code skill from laguagu/claude-code-nextjs-skills for developing AI agents with the official OpenAI Agents SDK (`openai-agents` / `agents` Python package). It triggers on imports from `agents`, uses of `Runner.run_sync` and `Runner.run_streamed`, `@function_tool`, `AgentOutputSchema`, `SQLiteSession`, guardrails, multi-agent handoffs, streaming, and tracing—including Azure OpenAI via LiteLLM. Installation is `pip install openai-agents`. Developers reach for this skill when implementing production agent loops, debugging tool-calling failures, or extending sessions and guardrails beyond quick-start examples.1.3kinstalls3Nextjs Shadcnnextjs-shadcn is a frontend-focused Agent Skill from laguagu/claude-code-nextjs-skills that steers code generation toward correct Next.js App Router and shadcn/ui patterns. The skill encodes a Server-vs-Client decision tree, limits `"use client"` to leaf components, requires serializable props (plain objects or Server Actions), and prefers Tailwind v4 `globals.css` theme variables over hardcoded values. Developers reach for nextjs-shadcn when scaffolding dashboards, forms, or UI shells where AI models often hallucinate `useEffect`, pass functions as props, or misplace client boundaries. The readme documents component placement rules and explicit checks for non-serializable props such as functions and classes.708installs4React Best PracticesGuides Claude through idiomatic React and Next.js development: component composition, rendering models, caching, performance pitfalls, and maintainable patterns aligned with modern App Router projects.190installs5Next Best PracticesNext.js best-practices skill encoding App Router conventions: file-based routing, React Server Components vs client components, async data patterns, metadata, error boundaries, and bundling choices for production-grade SaaS and content sites.182installs6Ai Sdk 6ai-sdk-6 from laguagu/claude-code-nextjs-skills teaches agents to integrate Vercel AI SDK version 6 into Next.js apps with streaming chat, tool calling, and structured generations. It standardizes provider wiring, React hooks, and server route patterns so LLM features ship faster without rediscovering SDK breaking changes each release.174installs7Postgres Semantic Searchpostgres-semantic-search from laguagu/claude-code-nextjs-skills shows agents how to add semantic search in PostgreSQL using embeddings, pgvector indexes, and similarity queries with optional hybrid filters. It keeps retrieval inside Postgres for SaaS apps, avoiding premature separate vector stores while still supporting RAG and agent lookup flows.174installs8Cache Componentscache-components teaches Claude Code how to apply Next.js App Router caching primitives—component cache boundaries, fetch caching, and revalidation—to build faster SaaS frontends with predictable data freshness.168installs9Ai Appai-app from laguagu/claude-code-nextjs-skills guides Claude Code through constructing Next.js applications with integrated large-language-model features, including streaming chat, tool use, and sensible AI product architecture.155installs10Web Design Guidelinesweb-design-guidelines from laguagu/claude-code-nextjs-skills gives Claude Code practical UI/UX standards for Next.js sites—spacing, type, color, accessibility, and component consistency for credible SaaS and content experiences.146installs11Ai ElementsNext.js skill for building AI-facing UI elements: chat layouts, streaming message states, tool result cards, and prompt controls. Helps agents implement consistent agentic product surfaces in React with patterns tuned for LLM-powered SaaS apps.140installs12Skill Creatorskill-creator from laguagu/claude-code-nextjs-skills helps agents author production-grade Claude Code skills with clear triggers, progressive instructions, bundled scripts, and verification habits. It turns ad-hoc prompts into reusable, installable capabilities so teams scale agent workflows consistently across repos and contributors.135installs13Frontend Designfrontend-design is a Claude Code skill for frontend development. It helps solo builders move faster with AI-assisted development.132installs14Nextjs Chatbotnextjs-chatbot is a Claude Code skill for ai & agent building. It helps solo builders move faster with AI-assisted development.112installs15Shadcnshadcn is a Claude Code skill for ai & agent building. It helps solo builders move faster with AI-assisted development.111installs16Ai Sdkai-sdk is a Claude Code skill for ai & agent building. It helps solo builders move faster with AI-assisted development.110installs17Supabase Postgres Best Practicessupabase-postgres-best-practices is a Claude Code skill for databases. It helps solo builders move faster with AI-assisted development.101installs18Gogo is a Claude Code skill for ai & agent building. It helps solo builders move faster with AI-assisted development.73installs19Chrome Devtoolschrome-devtools is a Claude Code skill for ai & agent building. It helps solo builders move faster with AI-assisted development.70installs20Hetzner Cloudhetzner-cloud is a Claude Code skill for ai & agent building. It helps solo builders move faster with AI-assisted development.65installs21Handoffhandoff is a Claude Code skill for ai & agent building. It helps solo builders move faster with AI-assisted development.53installs