Adoption

Agent Skills are supported by leading AI development tools.

VS Code Gemini CLI GitHub Goose Amp Cursor Claude Code Letta OpenCode Claude OpenAI Codex Factory VS Code Gemini CLI GitHub Goose Amp Cursor Claude Code Letta OpenCode Claude OpenAI Codex Factory

junnv93/nextjs-16

Name: nextjs-16
Author: junnv93

.claude/skills/nextjs-16/SKILL.md

npx skillsauth add junnv93/equipment_management_system nextjs-16

Clean

TrivyContainer and dependency vulnerability scanner

Clean

SemgrepStatic code analysis for vulnerabilities

Clean

mcp-scan (Snyk)Model Context Protocol security validation

Skipped

Snyk (dep)Open source security scanning

Skipped

Socket.devSupply chain security analysis

Skipped

VirusTotalMulti-engine malware detection

Skipped

CrowdStrikeAdvanced threat intelligence

Skipped

OSV-ScannerOpen Source Vulnerability database check

Skipped

OWASP Dep-Check

Next.js 16 Quick Reference

Version: 16.1.1 (Jan 2025)

CRITICAL RULES (Always Enforce)

1. params are Promise

// ❌ WRONG
export default function Page({ params }: { params: { slug: string } }) {
  return <h1>{params.slug}</h1>
}

// ✅ CORRECT
export default async function Page(props: PageProps<'/blog/[slug]'>) {
  const { slug } = await props.params
  return <h1>{slug}</h1>
}

2. Use useActionState (NOT useFormState)

// ❌ DEPRECATED
import { useFormState } from 'react-dom';
// ✅ CORRECT
import { useActionState } from 'react';

3. Form Actions Return Void (use revalidation, not return)

4. NO `any` Types

5. Use PageProps/LayoutProps Helpers

6. Use 'use cache' for Cached Dynamic Content

Essential Patterns

| Pattern | Key Points | |---------|-----------| | Static Page | Default export function, export const metadata | | Dynamic Page | PageProps<'/blog/[slug]'>, await props.params, generateStaticParams | | Root Layout | { children: React.ReactNode }, <html> + <body> | | Server Action (Form) | 'use server', void return, revalidatePath | | Server Action (State) | useActionState(action, initialState), returns data | | Client Component | 'use client', useState/useEffect | | Cache Components | 'use cache', cacheLife('hours'), cacheTag('posts') | | Proxy (Middleware) | proxy.ts (root), export function proxy(), export const config |

When to Read Additional Files

| Need | Reference File | |------|---------------| | Project setup, folder conventions | reference/01-project-structure.md | | Pages, layouts, dynamic routes | reference/02-routing-pages.md | | Links, prefetching, streaming | reference/03-navigation.md | | Server vs Client Components | reference/04-server-client.md | | TypeScript patterns | reference/05-typescript.md | | Server Actions, form handling | reference/06-server-actions.md | | Metadata, SEO, OG images | reference/07-metadata-seo.md | | Cache Components, PPR | reference/08-cache-components.md | | Proxy (Middleware) | reference/09-proxy.md | | Data fetching (Server Components) | reference/10-fetching-data.md | | Data updating, revalidation | reference/11-updating-data.md | | Caching & revalidation config | reference/12-caching-revalidating.md | | Error handling (error.tsx) | reference/13-error-handling.md | | CSS & styling | reference/14-css.md | | Image optimization | reference/15-image-optimization.md | | Font optimization | reference/16-font-optimization.md | | API Routes (route.ts) | reference/17-route-handlers.md |

File Conventions

| File | Purpose | |------|---------| | page.tsx | Public route | | layout.tsx | Shared wrapper | | loading.tsx | Loading state | | error.tsx | Error boundary ('use client' required) | | not-found.tsx | 404 page | | route.ts | API endpoint | | proxy.ts | Middleware |

Common Workflows

Create New Page

Determine route type (static/dynamic)
Create page.tsx, add PageProps<'/path/[param]'> if dynamic
await props.params for dynamic segments
Add generateStaticParams if prerenderable
Export metadata, add loading.tsx

Server Action

Create actions.ts with 'use server'
Form action (void) or useActionState (returns data)
Add error handling + revalidatePath/revalidateTag

Cache Components (PPR)

Enable cacheComponents: true in next.config.ts
Add 'use cache' + cacheLife + cacheTag to cacheable components
Wrap runtime content in <Suspense>

Common Mistakes

| Mistake | Fix | |---------|-----| | Not awaiting params | const { slug } = await props.params | | Form action returns data | Use void + revalidatePath, or useActionState | | Client Component for data fetching | Use Server Component, pass data to Client | | Using <img> | Use next/image with <Image> | | Missing error boundaries | Add error.tsx with 'use client' | | No cache for dynamic content | Add 'use cache' + cacheLife |

Pre-Coding Checklist

[ ] PageProps/LayoutProps helpers?
[ ] All params handled with await?
[ ] useActionState (not useFormState)?
[ ] Form actions return void?
[ ] No any types?
[ ] Server Component unless needs interactivity?
[ ] 'use client' only when necessary?
[ ] loading.tsx for dynamic routes?
[ ] Metadata export for SEO?
[ ] Cache Components if needed?
[ ] Proxy setup for auth/routing?
[ ] Error boundaries (error.tsx)?
[ ] Image component for images?

junnv93/nextjs-16

.claude/skills/nextjs-16/SKILL.md

Next.js 16 App Router reference guide (NOT a verification skill — use /verify-nextjs for validation). Use when creating or modifying pages, layouts, routes, Server Actions, or Server Components. Covers params Promise pattern, PageProps typing, useActionState (replaces useFormState), Server/Client component boundaries, and Cache Components. 페이지/레이아웃/라우트/Server Action 작성 시 참조.

tools

Updated Apr 16, 2026

$ install --global

skillsauth

npx skillsauth add junnv93/equipment_management_system nextjs-16

Install this skill globally with one command. Works with Claude Code, Cursor, and Windsurf.

Security Scan Results

3 of 9 scanners reported clean

Some scanners were skipped, did not run, or reported a non-clean status. Review each row below.

Scanners Passed

Scanners in report

Clean

TrivyContainer and dependency vulnerability scanner

95%

Clean

SemgrepStatic code analysis for vulnerabilities

95%

Clean

mcp-scan (Snyk)Model Context Protocol security validation

95%

Skipped

Snyk (dep)Open source security scanning

50%

Skipped

Socket.devSupply chain security analysis

50%

Skipped

VirusTotalMulti-engine malware detection

50%

Skipped

CrowdStrikeAdvanced threat intelligence

50%

Skipped

OSV-ScannerOpen Source Vulnerability database check

50%

Skipped

OWASP Dep-Check

50%

Last scanned: Apr 16, 2026, 12:57 PM6.8s22 files scanned

SKILL.md

name:: nextjs-16
description:: Next.js 16 App Router reference guide (NOT a verification skill — use /verify-nextjs for validation). Use when creating or modifying pages, layouts, routes, Server Actions, or Server Components. Covers params Promise pattern, PageProps typing, useActionState (replaces useFormState), Server/Client component boundaries, and Cache Components. 페이지/레이아웃/라우트/Server Action 작성 시 참조.
allowed-tools:: Read, Write, Edit, Bash, Grep, Glob

Next.js 16 Quick Reference

Version: 16.1.1 (Jan 2025)

CRITICAL RULES (Always Enforce)

1. params are Promise

// ❌ WRONG
export default function Page({ params }: { params: { slug: string } }) {
  return <h1>{params.slug}</h1>
}

// ✅ CORRECT
export default async function Page(props: PageProps<'/blog/[slug]'>) {
  const { slug } = await props.params
  return <h1>{slug}</h1>
}

2. Use useActionState (NOT useFormState)

// ❌ DEPRECATED
import { useFormState } from 'react-dom';
// ✅ CORRECT
import { useActionState } from 'react';

3. Form Actions Return Void (use revalidation, not return)

4. NO `any` Types

5. Use PageProps/LayoutProps Helpers

6. Use 'use cache' for Cached Dynamic Content

Essential Patterns

When to Read Additional Files

File Conventions

Common Workflows

Create New Page

Determine route type (static/dynamic)
Create page.tsx, add PageProps<'/path/[param]'> if dynamic
await props.params for dynamic segments
Add generateStaticParams if prerenderable
Export metadata, add loading.tsx

Server Action

Create actions.ts with 'use server'
Form action (void) or useActionState (returns data)
Add error handling + revalidatePath/revalidateTag

Cache Components (PPR)

Enable cacheComponents: true in next.config.ts
Add 'use cache' + cacheLife + cacheTag to cacheable components
Wrap runtime content in <Suspense>

Common Mistakes

Pre-Coding Checklist

[ ] PageProps/LayoutProps helpers?
[ ] All params handled with await?
[ ] useActionState (not useFormState)?
[ ] Form actions return void?
[ ] No any types?
[ ] Server Component unless needs interactivity?
[ ] 'use client' only when necessary?
[ ] loading.tsx for dynamic routes?
[ ] Metadata export for SEO?
[ ] Cache Components if needed?
[ ] Proxy setup for auth/routing?
[ ] Error boundaries (error.tsx)?
[ ] Image component for images?

Related Skills

junnv93/verify-zod

testing

VerifiedTrustedCommunity

Verifies Zod validation pattern compliance — ZodValidationPipe usage (no class-validator), versionedSchema inclusion in state-change DTOs, controller pipe application, query DTO consistency. Run after adding/modifying DTOs or controller endpoints.

SKILL.mdUpdated Apr 16, 2026

junnv93/verify-workflows

testing

VerifiedTrustedCommunity

Verifies cross-feature workflow E2E test coverage against critical-workflows.md checklist. Checks WF-01~WF-35 coverage, step completeness, role correctness, side-effect verification, and status transition assertions. Run after adding workflow tests or before PR.

SKILL.mdUpdated Apr 16, 2026

junnv93/verify-workflows

junnv93/verify-ssot

testing

VerifiedTrustedCommunity

SSOT(Single Source of Truth) 임포트 소스를 검증합니다. 타입/enum/상수가 올바른 패키지에서 임포트되는지 확인. 타입/enum 추가/수정 후 사용.

SKILL.mdUpdated Apr 16, 2026

junnv93/verify-sql-safety

development

VerifiedTrustedCommunity

Verifies SQL safety — LIKE wildcard escaping, N+1 query pattern detection, COUNT(DISTINCT) for fan-out JOINs, RBAC INNER JOIN enforcement. Run after adding/modifying search or list API endpoints.

SKILL.mdUpdated Apr 16, 2026

junnv93/verify-sql-safety

Download

For Claude Desktop. Download once, then upload the file in the app — no terminal needed.

Need help? View full Cowork setup guide →

Install manually

Choose your platform

# Clone the repo
git clone https://github.com/junnv93/equipment_management_system.git

# Copy into Claude Code skills folder (global)
cp -r equipment_management_system/.claude/skills/nextjs-16 ~/.claude/skills/

Claude Code Skills — official skills path docs.

Repository

junnv93/equipment_management_system

Compatible with

Claude Code

OpenAI Codex CLI

ChatGPT

Adoption

junnv93/nextjs-16

$ install --global

Security Scan Results

SKILL.md

Next.js 16 Quick Reference

CRITICAL RULES (Always Enforce)

1. params are Promise

2. Use useActionState (NOT useFormState)

3. Form Actions Return Void (use revalidation, not return)

4. NO any Types

5. Use PageProps/LayoutProps Helpers

6. Use 'use cache' for Cached Dynamic Content

Essential Patterns

When to Read Additional Files

File Conventions

Common Workflows

Create New Page

Server Action

Cache Components (PPR)

Common Mistakes

Pre-Coding Checklist

Related Skills

junnv93/verify-zod

junnv93/verify-workflows

junnv93/verify-ssot

junnv93/verify-sql-safety

junnv93/nextjs-16

$ install --global

Security Scan Results

SKILL.md

Next.js 16 Quick Reference

CRITICAL RULES (Always Enforce)

1. params are Promise

2. Use useActionState (NOT useFormState)

3. Form Actions Return Void (use revalidation, not return)

4. NO any Types

5. Use PageProps/LayoutProps Helpers

6. Use 'use cache' for Cached Dynamic Content

Essential Patterns

When to Read Additional Files

File Conventions

Common Workflows

Create New Page

Server Action

Cache Components (PPR)

Common Mistakes

Pre-Coding Checklist

Related Skills

junnv93/verify-zod

junnv93/verify-workflows

junnv93/verify-ssot

junnv93/verify-sql-safety

4. NO `any` Types

4. NO `any` Types