Next.js Server vs. Client Components
Skill ยืนยันแล้วGuide for choosing between Server Components and Client Components in Next.js App Router. CRITICAL for useSearchParams (requires Suspense + 'use client'), navigation (Link, redirect, useRouter), cookies/headers access, and 'use client' directive. Activates when prompt mentions useSearchParams, Suspense, navigation, routing, Link component, redirect, pathname, searchParams, cookies, headers, async components, or 'use client'. Essential for avoiding mixing server/client APIs.
This skill provides detailed explanations and code examples for differentiating between Next.js Server and Client Components. It covers critical patterns like data fetching, hook usage, navigation, and the React 'use' API, along with common anti-patterns to avoid.
การติดตั้ง
npx skills add wsimmonds/claude-nextjs-skillsเรียกใช้ Vercel skills CLI (skills.sh) ผ่าน npx — ต้องติดตั้ง Node.js ในเครื่อง และมี agent ที่รองรับ skills อย่างน้อยหนึ่งตัว (Claude Code, Cursor, Codex, …) ทั้งนี้สมมติว่า repo ใช้รูปแบบ agentskills.io
ส่วนขยายที่คล้ายกัน
Next.js Server Component Navigation Pattern
98Guide for implementing navigation in Next.js Server Components using Link component and redirect() function. Covers the difference between server and client navigation methods. Use when adding links, redirects, or navigation logic in server components without converting them to client components unnecessarily.
Tandem Panel Scaffold
100Scaffold an editable Tandem control panel app
ESLint Plugin React Hooks
99ESLint rules for React Hooks
Frontend Design
99Create distinctive, production-grade frontend interfaces with high design quality. Provides analysis tools for auditing existing designs and generation tools for creating color palettes, typography systems, design tokens, and component templates. Supports React, Vue, Svelte, and vanilla HTML/CSS. Use when building web components, pages, or applications. Keywords: design, UI, frontend, CSS, components, palette, typography, tokens, accessibility.
Next.js App Router Fundamentals
98Guide for working with Next.js App Router (Next.js 13+). Use when migrating from Pages Router to App Router, creating layouts, implementing routing, handling metadata, or building Next.js 13+ applications. Activates for App Router migration, layout creation, routing patterns, or Next.js 13+ development tasks.
React Doctor
98Extension from millionco/react-doctor