next-js-patterns
Aplicar padrões do Next.js App Router
Obtenha as melhores práticas para Next.js 15 App Router, incluindo Server Components, layouts e padrões de navegação. Construa aplicações React modernas com arquitetura adequada.
스킬 ZIP 다운로드
Claude에서 업로드
설정 → 기능 → 스킬 → 스킬 업로드로 이동
토글을 켜고 사용 시작
테스트해 보기
"next-js-patterns" 사용 중입니다. How do I create a new dashboard page?
예상 결과:
- 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" 사용 중입니다. When should I use 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 do App Router
Entenda layouts de páginas, tipos de componentes e navegação no Next.js 15
Aplicar padrões de dados no servidor
Busque dados em Server Components e gerencie necessidades de dados no lado do cliente
Estruturar projetos Next.js
Projete layouts de rotas adequados, metadados e otimização de fontes
이 프롬프트를 사용해 보세요
Mostre-me como criar uma nova página no Next.js App Router com estrutura adequada de Server Component
Como criar um Client Component no Next.js App Router para gerenciamento de estado
Qual é a diferença entre Link e useRouter para navegação no Next.js
Mostre as melhores práticas para buscar dados em Server Components versus Client Components
모범 사례
- Priorize Server Components por padrão para melhor desempenho e segurança
- Use Link de next/link para todos os links de navegação interna
- Mantenha a lógica do lado do cliente em componentes separados com diretiva use client
- Defina metadados no nível da página ou layout para otimização de SEO
피하기
- Evite usar useRouter quando o componente Link seria suficiente
- Não transforme todos os componentes em Client Components desnecessariamente
- Evite buscar dados em Client Components quando Server Components podem lidar com isso