Claude skills for Next.js
50 of 193 public skills on GitHub that mention Next.js: skills named for it first, then by stars, at most 3 from one repository. Each links to its folder; copy it into ~/.claude/skills/ to use it.
nextjs app router patterns
Master Next.js 14+ App Router with Server Components, streaming, parallel routes, and advanced data fetching. Use when building Next.js applications, implementing SSR/SSG, or optimizing React Server Components.
wshobson/agents★ 42kMITFolder:
nextjs-app-router-patternsnextjs developer
Use when building Next.js 14+ applications with App Router, server components, or server actions. Invoke to configure route handlers, implement middleware, set up API routes, add streaming SSR, write generateMetadata for SEO, scaffold loading.tsx/error.tsx…
Jeffallan/claude-skills★ 12kMITFolder:
nextjs-developerhunt nextjs
Hunt Next.js specific vulnerabilities — Server Actions arbitrary function execution, Middleware auth bypass via static asset paths, ISR cache poisoning, Image Optimization SSRF (/_next/image), RSC payload leakage, getServerSideProps injection, source map…
elementalsouls/Claude-BugHunter★ 5.3kMITFolder:
hunt-nextjsnextjs on cloudflare
Build, migrate, and deploy Next.js apps on Cloudflare Workers with vinext. Use when starting a Next.js project on Cloudflare, moving an existing app to Workers, choosing between vinext and OpenNext, or setting up vinext for Workers. For setup, migration,…
fcakyon/claude-codex-settings★ 1.2kApache-2.0Folder:
nextjs-on-cloudflarenextjs supabase vercel
Set up the current empty folder with the AI App Starter, so the agent builds a Next.js, Supabase and Vercel app with the owner step by step, from idea to launch.
TechNomadCode/AI-Product-Development-Toolkit★ 1kMITFolder:
nextjs-supabase-vercelnextjs app router
Provides patterns and code examples for building Next.js 16+ applications with App Router architecture. Use when creating projects with App Router, implementing Server Components and Client Components ("use client"), creating Server Actions for forms,…
giuseppe-trisciuoglio/developer-kit★ 366MITFolder:
nextjs-app-routernextjs authentication
Provides authentication implementation patterns for Next.js 15+ App Router using Auth.js 5 (NextAuth.js). Use when setting up authentication flows, implementing protected routes, managing sessions in Server Components and Server Actions, configuring OAuth…
giuseppe-trisciuoglio/developer-kit★ 366MITFolder:
nextjs-authenticationnextjs code review
Provides comprehensive code review capability for Next.js applications, validates Server Components, Client Components, Server Actions, caching strategies, metadata, API routes, middleware, and performance patterns. Use when reviewing Next.js App Router…
giuseppe-trisciuoglio/developer-kit★ 366MITFolder:
nextjs-code-reviewnextjs seo booster
A complete SEO toolkit for Next.js applications, including structured data (Schema.org), dynamic sitemap generation, and meta tags.
kennyzir/7deer_skills★ 331MITFolder:
nextjs-seo-boosternextjs seo foundations
Next.js 14 应用的生产级 SEO 工程化规范 (Metadata, Schema, Performance)
kennyzir/7deer_skills★ 331MITFolder:
nextjs-seo-foundationsnextjs react redux typescript cursor rules
Comprehensive Next.js, React, Redux, and TypeScript development guidelines covering SOLID principles, component architecture, and best practices.
Mindrally/skills★ 288Apache-2.0Folder:
nextjs-react-redux-typescript-cursor-rulesnextjs react typescript
Expert in TypeScript, Node.js, Next.js App Router, React, Shadcn UI, Radix UI and Tailwind
Mindrally/skills★ 288Apache-2.0Folder:
nextjs-react-typescriptnextjs typescript tailwindcss supabase
Full-stack Next.js 14 development with TypeScript, TailwindCSS, and Supabase for building production-ready web applications.
Mindrally/skills★ 288Apache-2.0Folder:
nextjs-typescript-tailwindcss-supabasebun nextjs
This skill should be used when the user asks about "Next.js with Bun", "Bun and Next", "running Next.js on Bun", "Next.js development with Bun", "create-next-app with Bun", or building Next.js applications using Bun as the runtime.
secondsky/claude-skills★ 240MITFolder:
bun-nextjscloudflare nextjs
Deploy Next.js to Cloudflare Workers via the OpenNext adapter (@opennextjs/cloudflare). Use for SSR/ISR/SSG/App or Pages Router, getCloudflareContext, bindings (D1/R2/KV/AI/Hyperdrive), caching tiers, skew protection, multi-worker, custom worker, env vars,…
secondsky/claude-skills★ 240MITFolder:
cloudflare-nextjsnextjs
Next.js 16 with App Router, Server Components, Server Actions, Cache Components. Use for React 19.2 apps, SSR, or encountering async params, proxy.ts migration, use cache errors.
secondsky/claude-skills★ 240MITFolder:
nextjsscaffold nextjs
Scaffolds a Next.js turborepo with Blode UI, icons, Ultracite (oxlint/shadcn), workspace hooks, and GitHub/Vercel setup. Use when asked to \"create a Next.js project\", \"bootstrap a turborepo\", or \"start a new web app\".
mblode/agent-skills★ 172MITFolder:
scaffold-nextjsnextjs app router routing
Implement App Router trees and navigation.
TheGoat395/Codex-Skills★ 135MITFolder:
nextjs-app-router-routingnextjs server client boundaries
Set use client and Server Function boundaries.
TheGoat395/Codex-Skills★ 135MITFolder:
nextjs-server-client-boundariesnextjs site architecture
Coordinate the Next.js foundation and ownership.
TheGoat395/Codex-Skills★ 135MITFolder:
nextjs-site-architecturenextjs app router expert
Expert guide for Next.js 15 App Router: RSC, React 19 Server Actions, Async Request APIs, 'use cache', PPR, Streaming, and Caching strategies / Panduan ahli untuk Next.js 15 App Router.
roedyrustam/vibes-plug★ 116MITFolder:
nextjs-app-router-expertnextjs ops
Next.js App Router operations - the server/client boundary, the two caching models, Server Actions security, streaming, proxy.ts and deployment. Use for: next.js, nextjs, app router, use cache, cacheComponents, Cache Components, cacheLife, cacheTag,…
0xDarkMatter/claude-mods★ 78MITFolder:
nextjs-opsnextjs patterns
Comprehensive Next.js development patterns for App Router, Server Components, TypeScript, and Tailwind CSS. Covers foundational principles, data fetching, routing, performance, and an 8-phase development workflow. Also includes Server Actions and Metadata…
tranhieutt/software_development_department★ 74MITFolder:
nextjs-patternsstitch nextjs components
Converts a Stitch screen, a local HTML file, or a URL into production-ready Next.js 15 App Router components — Server vs Client split, dark mode via CSS variables, TypeScript strict, ARIA, and responsive mobile-first layout. Only the Stitch route needs an…
gabelul/stitch-kit★ 47Apache-2.0Folder:
stitch-nextjs-componentsnew feature nextjs
Pre-flight checklist for adding a new feature to a Next.js 15 + TypeScript app. Load when creating a new page, route, server action, or feature module. Forces feature-driven colocation, RSC-first thinking, and the typed cache-tag pattern from line one —…
yerdaulet-damir/vibe-coding-rules★ 34MITFolder:
new-feature-nextjsnextjs 16
Use when building Next.js 16 apps — Turbopack, App Router, Cache Components, proxy.ts, v15 migration. Not for stack scaffolding (nextjs-stack) or React SPA (react-expert).
Fusengine/claude-plugins★ 34MITFolder:
nextjs-16nextjs server components
Use when deciding Server vs Client Component boundaries in Next.js 16, fetching data directly in components, or streaming with Suspense.
Fusengine/claude-plugins★ 34MITFolder:
nextjs-server-componentsnextjs i18n
Use when implementing i18n in Next.js 16 — next-intl or DIY dictionaries, locale routing, language switch, or formatters.
Fusengine/claude-plugins★ 34MITFolder:
nextjs-i18nnextjs senior dev
Senior Next.js 15+/16 Engineer skill for App Router. Use when scaffolding production apps, enforcing RSC patterns, auditing codebases, or optimizing performance.
georgekhananaev/claude-skills-vault★ 30MITFolder:
nextjs-senior-devtypescript react nextjs patterns
Production-grade TypeScript reference for React & Next.js frontend development. Covers type narrowing, component Props, generic hooks, discriminated unions, as const, satisfies, Zod validation, TanStack Query, server/client boundaries, forms, state…
leejpsd/typescript-react-nextjs-patterns★ 22MITFolder:
typescript-react-nextjs-patternsfec nextjs project standard
用于创建或审查 Next.js 14+ App Router 项目、文件路由、layout、服务端/客户端组件边界、SSR/SSG/ISR、streaming、metadata、middleware、server actions 或 Next 特定数据获取。通用客户端 React 组件架构另按项目 React 约定处理;中文触发词包括 Next.js、App Router。
bovinphang/frontend-craft★ 22MITFolder:
fec-nextjs-project-standardnextjs development
Next.js 16.2.4 with TypeScript — App Router, Server Components, use cache directive, Turbopack dev, Server Actions, ISR, SSR, SSG, MCP devtools, metadata API, route handlers, instrumentation.
bg-szy/TOP-SKILLS★ 6No licence statedFolder:
nextjs-developmentnextjs i18n seo
Audit/fix Next.js i18n SEO for the App Router — crawlability, 307→301 redirects, locale URLs, sitemap, hreflang. Use when diagnosing lost PageRank or i18n redirect bugs in middleware.
augchan42/inkstone★ 5MITFolder:
nextjs-i18n-seovercel react best practices
React and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React/Next.js code to ensure optimal performance patterns. Triggers on tasks involving React components,…
CherryHQ/cherry-studio★ 53kAGPL-3.0Folder:
vercel-react-best-practicesreact expert
Use when building React 18+ applications in .jsx or .tsx files, Next.js App Router projects, or create-react-app setups. Creates components, implements custom hooks, debugs rendering issues, migrates class components to functional, and implements state…
Jeffallan/claude-skills★ 12kMITFolder:
react-expertnear dapp
Build NEAR Protocol dApps. Use for: (1) creating new NEAR dApps with `create-near-app` (Vite+React, Next.js), (2) adding NEAR wallet connection to existing apps with `@hot-labs/near-connect` and `near-connect-hooks`, (3) building frontend UI for NEAR smart…
internet-court/internet-court-skill★ 7kLicence: see repoFolder:
near-dappplaywright core
Battle-tested Playwright patterns for E2E, API, component, visual, accessibility, and security testing. Covers locators, assertions, fixtures, network mocking, auth flows, debugging, and framework recipes for React, Next.js, Vue, and Angular. TypeScript…
zebbern/claude-code-guide★ 4.7kMITFolder:
coreplaywright skill
Battle-tested Playwright patterns for E2E, API, component, visual, accessibility, and security testing. Covers locators, fixtures, POM, network mocking, auth flows, debugging, CI/CD (GitHub Actions, GitLab, CircleCI, Azure, Jenkins), framework recipes…
zebbern/claude-code-guide★ 4.7kMITFolder:
playwrightdesign code
Generate production-ready, accessible, token-driven component code for ANY framework (React+Tailwind, Next.js, SwiftUI, Vue, Svelte, Angular, Solid, Web Components/Lit, React Native, Flutter, Jetpack Compose, vanilla CSS, or CSS-in-JS). Use when the user…
plugin87/ux-ui-agent-skills★ 3.1kMITFolder:
design-codesenior frontend
Frontend development skill for React, Next.js, TypeScript, and Tailwind CSS applications. Use when building React components, optimizing Next.js performance, analyzing bundle sizes, scaffolding frontend projects, implementing accessibility, or reviewing…
composio-community/awesome-claude-plugins★ 2kNo licence statedFolder:
senior-frontendoma frontend
Implement or modify web UI in React, Next.js, or Angular. Use for components, pages, styles, forms, and frontend state or data flows.
first-fluke/oh-my-agent★ 1.4kMITFolder:
oma-frontendsupabase
Use when doing ANY task involving Supabase. Triggers: Supabase products (Database, Auth, Edge Functions, Realtime, Storage, Vectors, Cron, Queues); client libraries and SSR integrations (supabase-js, @supabase/ssr) in Next.js, React, SvelteKit, Astro,…
fcakyon/claude-codex-settings★ 1.2kApache-2.0Folder:
supabasevercel deployments
Deploy frontend and full-stack apps on Vercel with previews, edge functions, environment promotion, and production guardrails. Use when shipping Next.js, SvelteKit, or static sites with zero-config CI/CD.
BagelHole/DevOps-Security-Agent-Skills★ 1.2kMITFolder:
vercel-deploymentsawwwards
Build award-caliber websites from a one-line prompt such as "make me a portfolio, my name is Ana". Uses the bar of sites that win Awwwards Site of the Day as a quality standard. Covers concept, art direction, typography, motion choreography, WebGL, page…
juliobsz/skills★ 1kMITFolder:
awwwardssaas scaffolder
Generate SaaS boilerplate with auth, database schemas, Stripe billing, multi-tenancy, API routes, and dashboard UI on a Next.js/TypeScript/Tailwind stack. Use when starting a new SaaS product, subscription app, or multi-tenant platform.
borghei/Claude-Skills★ 1kLicence: see repoFolder:
saas-scaffoldersenior fullstack
Fullstack development toolkit with project scaffolding for Next.js/FastAPI/MERN/Django stacks and code quality analysis. Use when scaffolding new projects, analyzing codebase quality, or implementing fullstack architecture patterns.
borghei/Claude-Skills★ 1kLicence: see repoFolder:
senior-fullstacksenior qa
Testing for React/Next.js with Jest, React Testing Library, and Playwright. Use when generating tests, writing unit tests, analyzing coverage, scaffolding E2E tests, configuring Jest, or improving test quality.
borghei/Claude-Skills★ 1kLicence: see repoFolder:
senior-qaslide deck
When you want to draft, update, convert, or export a slide deck for a React/Next.js slide system (${SLIDE_DECK_REPO:-$HOME/code/your-slide-deck-site}/src/app/slides/). Writes TypeScript Slide[] arrays using your primitives (Eyebrow, Heading, Accent, Body,…
coreyhaines31/makerskills★ 876MITFolder:
slide-decktoolify
When you want to integrate an external tool, API, MCP server, or service into a project — the wizard walks you through auth, config, env vars, client wrapper code, example usage, and an optional smoke test. Scoped to Next.js and Rails projects. Interactive…
coreyhaines31/makerskills★ 876MITFolder:
toolifyprivacy kr
한국 서비스용 처리방침·이용약관·회원가입 동의 모달·쿠키 배너 자동 생성. 개인정보보호법 §30, 2025.4.21 작성지침, 2026.3 개정법, 공정위 전자상거래 표준약관 10023호 반영. Next.js 13~16 프로젝트 대상.
kimlawtech/korean-privacy-terms★ 592Apache-2.0Folder:
privacy-kr
Claude skills for Next.js: common questions
What's the best Claude skill for Next.js?
There are 193 of them, spread over 84 repositories on GitHub. Named for it and most starred: nextjs app router patterns (wshobson/agents, ★ 42k), nextjs developer (Jeffallan/claude-skills, ★ 12k) and hunt nextjs (elementalsouls/Claude-BugHunter, ★ 5.3k). Stars rate the repository a skill sits in, not the skill.
How do I install a Claude skill for Next.js?
For Next.js, take the nextjs-app-router-patterns folder from wshobson/agents (the folder that holds SKILL.md) into ~/.claude/skills/ to use it in every Claude Code project, or into .claude/skills/ for one project. In the Claude apps, zip that folder and upload it as a custom skill in settings.
What should I check before installing a Next.js skill?
A Next.js skill is instructions Claude follows, and it can bundle scripts Claude runs, so read SKILL.md and every script first: for nextjs app router patterns, that is everything in the nextjs-app-router-patterns folder. 2 of the 50 here, nextjs development and nextjs i18n seo, come from repositories with under 10 stars, so few people have looked at them. Red flags: piping a download into a shell, sending files to a URL, and instructions to hide what it does from you.
Are these Next.js skills maintained?
123 of the 193 Next.js skills sit in repositories that changed in the 30 days before 31 Oct 2026.
Are these Next.js skills official?
No. None of the 193 Next.js skills comes from Anthropic's own skills repository, so all of them are community-made across 84 repositories.
Can I use these Next.js skills at work?
Of the 50 Next.js skills listed here, 43 sit in repositories under an open licence such as MIT or Apache 2.0, and 2, such as nextjs development and senior frontend, state no licence at all, which legally means you may not reuse them. Check the licence file before you copy one into company work.
More topics: every “Claude skills for…” page.