next-js-patterns
Aplicar patrones de Next.js App Router
Obtén las mejores prácticas para Next.js 15 App Router, incluyendo Server Components, layouts y patrones de navegación. Construye aplicaciones React modernas con la arquitectura adecuada.
스킬 ZIP 다운로드
Claude에서 업로드
설정 → 기능 → 스킬 → 스킬 업로드로 이동
토글을 켜고 사용 시작
테스트해 보기
"next-js-patterns" 사용 중입니다. ¿Cómo creo una nueva página de dashboard?
예상 결과:
- Create app/dashboard/page.tsx
- Export default function as Server Component by default
- Use use client directive only for state or effects
- Add Link components for internal navigation
- Export metadata for SEO
"next-js-patterns" 사용 중입니다. ¿Cuándo debo usar Server Components vs Client Components?
예상 결과:
- Use Server Components by default for better performance
- Use Client Components when you need useState or useEffect
- Use Client Components for event handlers and browser APIs
- Keep client-side logic in separate components
보안 감사
안전Pure documentation skill containing markdown documentation for Next.js patterns. No executable code, network calls, or file system access. The static analyzer flagged JSON string patterns as cryptographic/network threats, but these are metadata fields in a configuration file. This skill only provides guidance documentation.
위험 요인
🌐 네트워크 접근 (2)
📁 파일 시스템 액세스 (1)
품질 점수
만들 수 있는 것
Aprender fundamentos de App Router
Comprende layouts de páginas, tipos de componentes y navegación en Next.js 15
Aplicar patrones de datos del servidor
Obtén datos en Server Components y maneja necesidades de datos del lado del cliente
Estructurar proyectos Next.js
Diseña layouts de rutas adecuados, metadata y optimización de fuentes
이 프롬프트를 사용해 보세요
Muéstrame cómo crear una nueva página en Next.js App Router con estructura de Server Component adecuada
¿Cómo creo un Client Component en Next.js App Router para gestión de estado
¿Cuál es la diferencia entre Link y useRouter para navegación en Next.js
Muéstrame las mejores prácticas para obtener datos en Server Components versus Client Components
모범 사례
- Por defecto, usa Server Components para mejor rendimiento y seguridad
- Usa Link de next/link para todos los enlaces de navegación interna
- Mantén la lógica del lado del cliente en componentes separados con la directiva use client
- Define metadata a nivel de página o layout para optimización SEO
피하기
- Evita usar useRouter cuando el componente Link sería suficiente
- No hagas todos los componentes Client Components innecesariamente
- Evita obtener datos en Client Components cuando Server Components puede manejarlo