[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill:01M6QZGGTWCQYVGX3EEF71MHJF":3,"skill-same:01M6QZGGTWCQYVGX3EEF71MHJF":102},{"skillNo":4,"name":5,"nameZh":6,"description":7,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":16,"categories":17,"keywords":23,"publishedAt":44,"linkOnly":45,"markdownContent":46,"markdownBody":47,"frontMatter":48,"refName":49,"commitSha":50,"skillDirectory":51,"forksCount":52,"repositoryHtmlUrl":53,"repositoryHomepageUrl":54,"ownerHtmlUrl":55,"ownerBlogUrl":6,"ownerDescription":56,"updatedAt":57,"install":58,"resources":71},"01M6QZGGTWCQYVGX3EEF71MHJF","nextjs-guide",null,"Next.js 스페셜리스트 트리아지 — 하이드레이션 불일치, 'use client' 번들 비대, RSC 직렬화 노출, Server Action 인증, 'use cache' 캐싱, proxy.ts(middleware), 워터폴, 이미지·폰트 CLS. 버전은 package.json·동봉 문서로 확인.\nNext.js specialist triage: hydration, client bundle, RSC serialization, Server Action security, caching, proxy.ts, waterfalls, CLS, self-hosting.\nUse when: reviewing or debugging Next.js App Router code or upgrading to Next 16.","Dokkabei97\u002Fdokkabei-harness","Dokkabei97","https:\u002F\u002Favatars.githubusercontent.com\u002Fu\u002F69792585?v=4","01M6QYPVTYK6CGF609W541QNSD","JangMK","01M6QYPVYXBP1GRYHZ7ZABCZC6",1,"Apache-2.0","https:\u002F\u002Fgithub.com\u002FDokkabei97\u002Fdokkabei-harness\u002Fblob\u002Fmain\u002Fplugins\u002Fnextjs\u002Fskills\u002Fnextjs-guide\u002FSKILL.md",[18],{"categoryNo":19,"categoryName":20,"taxonomyType":21,"taxonomyTypeDesc":22},"01JBSEEDCAT000000000000030","开发工程师","PROFESSION","适用职业",[24,25,26,27,28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43],"nextjs guide","nextjs","guide","next","when","rsc","action","이미지","middleware","app","caching","self","security","router","use","server","proxy","package","code","debugging","2026-11-10 10:12:30",false,"---\nname: nextjs-guide\ndescription: |\n  Next.js 스페셜리스트 트리아지 — 하이드레이션 불일치, 'use client' 번들 비대, RSC 직렬화 노출, Server Action 인증, 'use cache' 캐싱, proxy.ts(middleware), 워터폴, 이미지·폰트 CLS. 버전은 package.json·동봉 문서로 확인.\n  Next.js specialist triage: hydration, client bundle, RSC serialization, Server Action security, caching, proxy.ts, waterfalls, CLS, self-hosting.\n  Use when: reviewing or debugging Next.js App Router code or upgrading to Next 16.\n---\n\n# Next.js 스페셜리스트 트리아지\n\n강한 시니어도 놓치기 쉬운 Next.js(App Router) 함정을 **증상 → 레퍼런스 항목**으로 찾는 인덱스다.\n일반 튜토리얼(라우팅 파일 규칙, 컴포넌트 작성법)은 담지 않는다 — 그건 모델과 공식 문서가 이미 안다.\n\n## 0. 먼저 버전과 동봉 문서를 확인한다 (단정 금지)\n\nNext.js 는 메이저마다 규칙이 바뀌고(15: async request API, 16: proxy.ts·Cache Components·Turbopack 기본),\n학습 데이터와 어긋나기 쉽다. 코드를 쓰거나 판정하기 전에:\n\n1. **버전**: 앱의 `package.json` 의 `next`\u002F`react` 버전(모노레포면 `apps\u002F*\u002Fpackage.json`). 실제 설치본은 `node_modules\u002Fnext\u002Fpackage.json`.\n   그 버전이 보안 공지의 패치 하한 이상인지도 확인한다(GitHub Security Advisories·`npm audit` — RSC-ACT-10).\n2. **에이전트 규칙 파일**: 앱 디렉터리의 `AGENTS.md`\u002F`CLAUDE.md` 에 `nextjs-agent-rules` 블록이 있으면 그 지시를 따른다(`next dev` 가 생성·재생성).\n3. **동봉 문서(16.2+)**: `node_modules\u002Fnext\u002Fdist\u002Fdocs\u002F` — `01-app\u002F02-guides\u002Fupgrading\u002Fversion-16.md`, `01-app\u002F03-api-reference\u002F…`.\n   이 문서가 본 스킬의 레퍼런스보다 우선한다. 없으면(16.1 이하) https:\u002F\u002Fnextjs.org\u002Fdocs 의 해당 버전 문서, 또는 Context7(설치 시 `backend-shared:context7-docs-guide` 규약).\n4. **모델 판별**: `next.config.*` 의 `cacheComponents: true` 여부(캐싱 규칙이 완전히 다름), 요청 가로채기 파일이 `proxy.ts` 인지 `middleware.ts` 인지, `--webpack` 사용 여부.\n5. **배포 형태**: Vercel 인지 셀프호스팅(Docker\u002Fk8s, 레플리카 수, 앞단 nginx\u002FIngress)인지 — 운영 함정(NX-OPS, RSC-ACT-07\u002F08) 적용 여부가 갈린다.\n6. **프로젝트 컨벤션**: 기존 코드의 데이터 접근 계층(DAL), 상태·폼 라이브러리, 테스트 러너는 그대로 따른다. 이 스킬은 라이브러리를 추천하지 않는다.\n\n레퍼런스 항목의 \"적용\" 줄이 현재 버전·모델과 맞지 않으면 그 항목은 건너뛴다.\n\n## 1. 증상 → 레퍼런스\n\n| 증상 \u002F 키워드 | 먼저 볼 항목 | 파일 |\n|---|---|---|\n| Hydration failed, 날짜·시간 깜빡임, 운영에서만 불일치 | WEB-HYD-01, 03 | `references\u002Fweb-vitals.md` |\n| 번들 비대, \"이 라이브러리가 왜 클라이언트에?\", `'use client'` 가 페이지 상단, `ssr: false` | RSC-BND-01, 06 \u002F WEB-BUN-01 | `references\u002Frsc-boundary.md`, `references\u002Fweb-vitals.md` |\n| HTML\u002F페이로드가 큼, `__next_f` 스크립트 과대, 민감 필드가 DevTools 에 보임 | RSC-BND-02, 04 | `references\u002Frsc-boundary.md` |\n| 브라우저에서만 API 키가 빈 값, 서버 모듈이 클라이언트에 import | RSC-BND-03 | `references\u002Frsc-boundary.md` |\n| Date 가 문자열로 옴, \"cannot be passed to Client Components\" | RSC-BND-05 | `references\u002Frsc-boundary.md` |\n| Server Action 권한·IDOR, 페이지 인증만 있음, hidden input\u002Fbind 로 id 전달 | RSC-ACT-01, 02, 03 | `references\u002Fserver-actions-security.md` |\n| next\u002Freact 보안 패치 수준, CVE·advisory, React2Shell | RSC-ACT-10 | `references\u002Fserver-actions-security.md` |\n| 액션 병렬 호출이 느림, redirect 가 안 됨, 업로드 실패, 운영에서만 액션 거부 | RSC-ACT-04~07 | `references\u002Fserver-actions-security.md` |\n| \"Failed to find Server Action\", 배포 직후 ChunkLoadError | RSC-ACT-08 \u002F NX-OPS-03 | `references\u002Fserver-actions-security.md`, `references\u002Fself-hosting-ops.md` |\n| 저장했는데 옛 값, 캐시가 안 맞음, 파드마다 다른 데이터 | NX-CACHE-05\u002F06 \u002F NX-V16-04 \u002F NX-OPS-02 | `references\u002Fcaching-rendering.md`, `references\u002Fversion-16-changes.md`, `references\u002Fself-hosting-ops.md` |\n| `'use cache'` 에러(`next-request-in-use-cache`), 히트율 0, Date.now build 에러 | NX-CACHE-03, 04, 08 | `references\u002Fcaching-rendering.md` |\n| cacheComponents 전환 후 빌드 에러 폭증, 뒤로가기 시 UI 상태가 남음 | NX-CACHE-09, 11 | `references\u002Fcaching-rendering.md` |\n| 같은 쿼리가 요청당 여러 번, fetch 가 캐시될 거라 가정 | NX-CACHE-01, 02 | `references\u002Fcaching-rendering.md` |\n| TTFB 가 가장 느린 쿼리에 묶임, 링크 클릭 후 무반응 | NX-DATA-02, 03 \u002F NX-CACHE-10, 12 | `references\u002Fdata-waterfall.md`, `references\u002Fcaching-rendering.md` |\n| 운영에서 스트리밍 안 됨(로컬은 됨) | NX-DATA-04 | `references\u002Fdata-waterfall.md` |\n| 페이지 대부분이 SSR HTML 에 없음, `missing-suspense-with-csr-bailout`, `blocking-prerender-client-hook` | NX-DATA-05 | `references\u002Fdata-waterfall.md` |\n| middleware.ts, proxy 에서 DB 인증, 15→16 업그레이드 | NX-V16-01~12 | `references\u002Fversion-16-changes.md` |\n| 이미지 과대 다운로드, LCP 이미지 늦음, CLS | WEB-IMG-01~03 | `references\u002Fweb-vitals.md` |\n| 한글 웹폰트 CLS·LCP 지연, 폰트 중복 다운로드 | WEB-FONT-01~03 | `references\u002Fweb-vitals.md` |\n| 이미지 최적화로 파드 메모리↑, 환경별 NEXT_PUBLIC 값 오염, 종료 시 유실 | NX-OPS-01, 04 \u002F WEB-IMG-04 | `references\u002Fself-hosting-ops.md`, `references\u002Fweb-vitals.md` |\n\n## 2. 항목 인덱스 (ID · 한 줄)\n\n각 항목은 `적용 \u002F 신호 \u002F 메커니즘 \u002F 처방 \u002F 반례 \u002F 검증 \u002F 근거` 형식이다. 프로젝트 규칙(workflow:project-rules 등)으로\n선별할 때는 \"적용\" 조건이 프로젝트 버전·배포 형태와 맞는 ID 만 고른다. ID 는 안정 식별자라 항목을 병합·삭제해도 재번호하지 않는다(빈 번호 = 다른 항목에 흡수).\n\n**version-16-changes.md** — NX-V16-01 proxy.ts 개명·Node 런타임 고정 · 02 proxy 는 낙관적 체크만 · 03 동기 Request API 제거 ·\n04 revalidateTag 2인자\u002FupdateTag\u002Frefresh · 05 Turbopack 기본과 webpack 설정 충돌 · 06 next lint 제거 · 07 next\u002Fimage 기본값 4종 ·\n08 parallel route default.js 필수 · 09 runtime config 제거 · 10 scroll-behavior 미덮어쓰기 · 11 First Load JS 지표 제거 · 12 dev config 1회 로드\n\n**caching-rendering.md** — NX-CACHE-01 15+ 기본 비캐시 · 02 DB 호출은 메모이제이션 없음 → React.cache · 03 캐시 스코프 runtime API 가 start 에서만 실패 ·\n04 캐시 키에 클로저 캡처 포함 · 05 인스턴스별 in-memory LRU 50MB · 06 cacheLife 기본 프로필·클라 최소 30s · 07 캐시 함수별 React.cache 격리 ·\n08 프리렌더 동기 IO build 에러 · 09 cacheComponents 전환 시 에러 목록 · 10 Suspense 는 동적화가 아님 · 11 Activity 상태 보존 ·\n12 동적 페이지 prefetch 조건 · 13 after() 는 동적화 안 함\n\n**data-waterfall.md** — NX-DATA-02 트리 깊이 워터폴과 preload(01 흡수) · 03 런타임 데이터 layout 의 블로킹 · 04 앞단 버퍼링 · 05 useSearchParams CSR 강등\n\n**rsc-boundary.md** — RSC-BND-01 모듈 그래프 경계 · 02 props 이중 전송 · 03 env 오염(빈 문자열) · 04 DB 행 통째 전달 노출 ·\n05 직렬화 비대칭 · 06 배럴 파일 · 08 use(promise) 생성 위치 (07 ssr:false 는 01 에 흡수)\n\n**server-actions-security.md** — RSC-ACT-01 export = 공개 엔드포인트 · 02 왕복 값 불신 · 03 반환값 노출 · 04 순차 디스패치 ·\n05 redirect throw · 06 1MB 상한 · 07 Origin\u002FHost 검사 · 08 암호화 키·액션 ID 스큐 · 09 렌더 중 변이 금지 · 10 RSC 보안 패치 하한\n\n**web-vitals.md** — WEB-IMG-01 sizes 누락 · 02 LCP 우선순위(fetchPriority 단독은 lazy 유지) · 03 fill 부모 크기 · 04 셀프호스팅 최적화 부하 ·\nWEB-FONT-01 swap·폴백 보정과 CJK · 02 폰트 인스턴스 중복 · 03 CJK preload — local 은 경쟁, google 은 한글 미preload ·\nWEB-HYD-01 로캘·TZ · 03 typeof window\u002FlocalStorage(02 HTML 중첩 흡수) · WEB-BUN-01 번들 분석 도구 · 02 React Compiler\n\n**self-hosting-ops.md** — NX-OPS-01 NEXT_PUBLIC 빌드 동결 · 02 다중 인스턴스 태그 무효화 · 03 버전 스큐 · 04 SIGTERM 드레인\n\n## 3. 리뷰 시 최소 점검 순서\n\n1. 0절로 버전·모델·배포 형태 확정 → 해당 없는 항목 제외\n2. `grep -rn \"'use server'\"` → 모든 export 에 인증·인가 재검증이 있는가(RSC-ACT-01)\n3. `grep -rn \"'use client'\"` → 경계가 leaf 에 있는가, 서버 데이터가 통째로 넘어가는가(RSC-BND-01\u002F02\u002F04)\n4. 캐시 의도가 코드에 명시돼 있는가(`'use cache'`+`cacheLife` 또는 fetch 옵션) \u002F 변경 경로의 무효화 API 가 맞는가(NX-V16-04)\n5. 성능 주장에는 측정 근거(`next build && next start` 기준 Lighthouse·analyze 산출물·서버 span)를 붙인다 — dev 서버 수치 금지\n\n## 4. 인접 도구와의 경계\n\n- 시각 디자인·스타일링 품질은 공식 `frontend-design` 스킬 소관(설치 시 조합, 미설치 시 생략).\n- 코드 생성 절차는 `\u002Fnextjs-gen`·`\u002Fnextjs-page-design` 커맨드와 `nextjs-developer` 에이전트가 담당하고, 이 스킬은 판정 근거를 제공한다.\n- 백엔드 API·DB 설계는 백엔드 스택 플러그인 소관.\n","# Next.js 스페셜리스트 트리아지\n\n강한 시니어도 놓치기 쉬운 Next.js(App Router) 함정을 **증상 → 레퍼런스 항목**으로 찾는 인덱스다.\n일반 튜토리얼(라우팅 파일 규칙, 컴포넌트 작성법)은 담지 않는다 — 그건 모델과 공식 문서가 이미 안다.\n\n## 0. 먼저 버전과 동봉 문서를 확인한다 (단정 금지)\n\nNext.js 는 메이저마다 규칙이 바뀌고(15: async request API, 16: proxy.ts·Cache Components·Turbopack 기본),\n학습 데이터와 어긋나기 쉽다. 코드를 쓰거나 판정하기 전에:\n\n1. **버전**: 앱의 `package.json` 의 `next`\u002F`react` 버전(모노레포면 `apps\u002F*\u002Fpackage.json`). 실제 설치본은 `node_modules\u002Fnext\u002Fpackage.json`.\n   그 버전이 보안 공지의 패치 하한 이상인지도 확인한다(GitHub Security Advisories·`npm audit` — RSC-ACT-10).\n2. **에이전트 규칙 파일**: 앱 디렉터리의 `AGENTS.md`\u002F`CLAUDE.md` 에 `nextjs-agent-rules` 블록이 있으면 그 지시를 따른다(`next dev` 가 생성·재생성).\n3. **동봉 문서(16.2+)**: `node_modules\u002Fnext\u002Fdist\u002Fdocs\u002F` — `01-app\u002F02-guides\u002Fupgrading\u002Fversion-16.md`, `01-app\u002F03-api-reference\u002F…`.\n   이 문서가 본 스킬의 레퍼런스보다 우선한다. 없으면(16.1 이하) https:\u002F\u002Fnextjs.org\u002Fdocs 의 해당 버전 문서, 또는 Context7(설치 시 `backend-shared:context7-docs-guide` 규약).\n4. **모델 판별**: `next.config.*` 의 `cacheComponents: true` 여부(캐싱 규칙이 완전히 다름), 요청 가로채기 파일이 `proxy.ts` 인지 `middleware.ts` 인지, `--webpack` 사용 여부.\n5. **배포 형태**: Vercel 인지 셀프호스팅(Docker\u002Fk8s, 레플리카 수, 앞단 nginx\u002FIngress)인지 — 운영 함정(NX-OPS, RSC-ACT-07\u002F08) 적용 여부가 갈린다.\n6. **프로젝트 컨벤션**: 기존 코드의 데이터 접근 계층(DAL), 상태·폼 라이브러리, 테스트 러너는 그대로 따른다. 이 스킬은 라이브러리를 추천하지 않는다.\n\n레퍼런스 항목의 \"적용\" 줄이 현재 버전·모델과 맞지 않으면 그 항목은 건너뛴다.\n\n## 1. 증상 → 레퍼런스\n\n| 증상 \u002F 키워드 | 먼저 볼 항목 | 파일 |\n|---|---|---|\n| Hydration failed, 날짜·시간 깜빡임, 운영에서만 불일치 | WEB-HYD-01, 03 | `references\u002Fweb-vitals.md` |\n| 번들 비대, \"이 라이브러리가 왜 클라이언트에?\", `'use client'` 가 페이지 상단, `ssr: false` | RSC-BND-01, 06 \u002F WEB-BUN-01 | `references\u002Frsc-boundary.md`, `references\u002Fweb-vitals.md` |\n| HTML\u002F페이로드가 큼, `__next_f` 스크립트 과대, 민감 필드가 DevTools 에 보임 | RSC-BND-02, 04 | `references\u002Frsc-boundary.md` |\n| 브라우저에서만 API 키가 빈 값, 서버 모듈이 클라이언트에 import | RSC-BND-03 | `references\u002Frsc-boundary.md` |\n| Date 가 문자열로 옴, \"cannot be passed to Client Components\" | RSC-BND-05 | `references\u002Frsc-boundary.md` |\n| Server Action 권한·IDOR, 페이지 인증만 있음, hidden input\u002Fbind 로 id 전달 | RSC-ACT-01, 02, 03 | `references\u002Fserver-actions-security.md` |\n| next\u002Freact 보안 패치 수준, CVE·advisory, React2Shell | RSC-ACT-10 | `references\u002Fserver-actions-security.md` |\n| 액션 병렬 호출이 느림, redirect 가 안 됨, 업로드 실패, 운영에서만 액션 거부 | RSC-ACT-04~07 | `references\u002Fserver-actions-security.md` |\n| \"Failed to find Server Action\", 배포 직후 ChunkLoadError | RSC-ACT-08 \u002F NX-OPS-03 | `references\u002Fserver-actions-security.md`, `references\u002Fself-hosting-ops.md` |\n| 저장했는데 옛 값, 캐시가 안 맞음, 파드마다 다른 데이터 | NX-CACHE-05\u002F06 \u002F NX-V16-04 \u002F NX-OPS-02 | `references\u002Fcaching-rendering.md`, `references\u002Fversion-16-changes.md`, `references\u002Fself-hosting-ops.md` |\n| `'use cache'` 에러(`next-request-in-use-cache`), 히트율 0, Date.now build 에러 | NX-CACHE-03, 04, 08 | `references\u002Fcaching-rendering.md` |\n| cacheComponents 전환 후 빌드 에러 폭증, 뒤로가기 시 UI 상태가 남음 | NX-CACHE-09, 11 | `references\u002Fcaching-rendering.md` |\n| 같은 쿼리가 요청당 여러 번, fetch 가 캐시될 거라 가정 | NX-CACHE-01, 02 | `references\u002Fcaching-rendering.md` |\n| TTFB 가 가장 느린 쿼리에 묶임, 링크 클릭 후 무반응 | NX-DATA-02, 03 \u002F NX-CACHE-10, 12 | `references\u002Fdata-waterfall.md`, `references\u002Fcaching-rendering.md` |\n| 운영에서 스트리밍 안 됨(로컬은 됨) | NX-DATA-04 | `references\u002Fdata-waterfall.md` |\n| 페이지 대부분이 SSR HTML 에 없음, `missing-suspense-with-csr-bailout`, `blocking-prerender-client-hook` | NX-DATA-05 | `references\u002Fdata-waterfall.md` |\n| middleware.ts, proxy 에서 DB 인증, 15→16 업그레이드 | NX-V16-01~12 | `references\u002Fversion-16-changes.md` |\n| 이미지 과대 다운로드, LCP 이미지 늦음, CLS | WEB-IMG-01~03 | `references\u002Fweb-vitals.md` |\n| 한글 웹폰트 CLS·LCP 지연, 폰트 중복 다운로드 | WEB-FONT-01~03 | `references\u002Fweb-vitals.md` |\n| 이미지 최적화로 파드 메모리↑, 환경별 NEXT_PUBLIC 값 오염, 종료 시 유실 | NX-OPS-01, 04 \u002F WEB-IMG-04 | `references\u002Fself-hosting-ops.md`, `references\u002Fweb-vitals.md` |\n\n## 2. 항목 인덱스 (ID · 한 줄)\n\n각 항목은 `적용 \u002F 신호 \u002F 메커니즘 \u002F 처방 \u002F 반례 \u002F 검증 \u002F 근거` 형식이다. 프로젝트 규칙(workflow:project-rules 등)으로\n선별할 때는 \"적용\" 조건이 프로젝트 버전·배포 형태와 맞는 ID 만 고른다. ID 는 안정 식별자라 항목을 병합·삭제해도 재번호하지 않는다(빈 번호 = 다른 항목에 흡수).\n\n**version-16-changes.md** — NX-V16-01 proxy.ts 개명·Node 런타임 고정 · 02 proxy 는 낙관적 체크만 · 03 동기 Request API 제거 ·\n04 revalidateTag 2인자\u002FupdateTag\u002Frefresh · 05 Turbopack 기본과 webpack 설정 충돌 · 06 next lint 제거 · 07 next\u002Fimage 기본값 4종 ·\n08 parallel route default.js 필수 · 09 runtime config 제거 · 10 scroll-behavior 미덮어쓰기 · 11 First Load JS 지표 제거 · 12 dev config 1회 로드\n\n**caching-rendering.md** — NX-CACHE-01 15+ 기본 비캐시 · 02 DB 호출은 메모이제이션 없음 → React.cache · 03 캐시 스코프 runtime API 가 start 에서만 실패 ·\n04 캐시 키에 클로저 캡처 포함 · 05 인스턴스별 in-memory LRU 50MB · 06 cacheLife 기본 프로필·클라 최소 30s · 07 캐시 함수별 React.cache 격리 ·\n08 프리렌더 동기 IO build 에러 · 09 cacheComponents 전환 시 에러 목록 · 10 Suspense 는 동적화가 아님 · 11 Activity 상태 보존 ·\n12 동적 페이지 prefetch 조건 · 13 after() 는 동적화 안 함\n\n**data-waterfall.md** — NX-DATA-02 트리 깊이 워터폴과 preload(01 흡수) · 03 런타임 데이터 layout 의 블로킹 · 04 앞단 버퍼링 · 05 useSearchParams CSR 강등\n\n**rsc-boundary.md** — RSC-BND-01 모듈 그래프 경계 · 02 props 이중 전송 · 03 env 오염(빈 문자열) · 04 DB 행 통째 전달 노출 ·\n05 직렬화 비대칭 · 06 배럴 파일 · 08 use(promise) 생성 위치 (07 ssr:false 는 01 에 흡수)\n\n**server-actions-security.md** — RSC-ACT-01 export = 공개 엔드포인트 · 02 왕복 값 불신 · 03 반환값 노출 · 04 순차 디스패치 ·\n05 redirect throw · 06 1MB 상한 · 07 Origin\u002FHost 검사 · 08 암호화 키·액션 ID 스큐 · 09 렌더 중 변이 금지 · 10 RSC 보안 패치 하한\n\n**web-vitals.md** — WEB-IMG-01 sizes 누락 · 02 LCP 우선순위(fetchPriority 단독은 lazy 유지) · 03 fill 부모 크기 · 04 셀프호스팅 최적화 부하 ·\nWEB-FONT-01 swap·폴백 보정과 CJK · 02 폰트 인스턴스 중복 · 03 CJK preload — local 은 경쟁, google 은 한글 미preload ·\nWEB-HYD-01 로캘·TZ · 03 typeof window\u002FlocalStorage(02 HTML 중첩 흡수) · WEB-BUN-01 번들 분석 도구 · 02 React Compiler\n\n**self-hosting-ops.md** — NX-OPS-01 NEXT_PUBLIC 빌드 동결 · 02 다중 인스턴스 태그 무효화 · 03 버전 스큐 · 04 SIGTERM 드레인\n\n## 3. 리뷰 시 최소 점검 순서\n\n1. 0절로 버전·모델·배포 형태 확정 → 해당 없는 항목 제외\n2. `grep -rn \"'use server'\"` → 모든 export 에 인증·인가 재검증이 있는가(RSC-ACT-01)\n3. `grep -rn \"'use client'\"` → 경계가 leaf 에 있는가, 서버 데이터가 통째로 넘어가는가(RSC-BND-01\u002F02\u002F04)\n4. 캐시 의도가 코드에 명시돼 있는가(`'use cache'`+`cacheLife` 또는 fetch 옵션) \u002F 변경 경로의 무효화 API 가 맞는가(NX-V16-04)\n5. 성능 주장에는 측정 근거(`next build && next start` 기준 Lighthouse·analyze 산출물·서버 span)를 붙인다 — dev 서버 수치 금지\n\n## 4. 인접 도구와의 경계\n\n- 시각 디자인·스타일링 품질은 공식 `frontend-design` 스킬 소관(설치 시 조합, 미설치 시 생략).\n- 코드 생성 절차는 `\u002Fnextjs-gen`·`\u002Fnextjs-page-design` 커맨드와 `nextjs-developer` 에이전트가 담당하고, 이 스킬은 판정 근거를 제공한다.\n- 백엔드 API·DB 설계는 백엔드 스택 플러그인 소관.\n",{"name":5,"description":7},"main","e9f37e996e3d2b1b6ac9c879e9dfba1223b597c3","plugins\u002Fnextjs\u002Fskills\u002Fnextjs-guide",0,"https:\u002F\u002Fgithub.com\u002FDokkabei97\u002Fdokkabei-harness","https:\u002F\u002Fdokkabei97.github.io\u002Fdokkabei-harness\u002F","https:\u002F\u002Fgithub.com\u002FDokkabei97","Contact: wkdrn970@gmail.com","2026-10-29 06:49:16",{"source":8,"skillName":5,"commands":59,"prompt":69,"zipAvailable":70},[60,63,66],{"tool":61,"command":62},"npx","npx skills add Dokkabei97\u002Fdokkabei-harness --skill nextjs-guide",{"tool":64,"command":65},"bunx","bunx skills add Dokkabei97\u002Fdokkabei-harness --skill nextjs-guide",{"tool":67,"command":68},"pnpm","pnpm dlx skills add Dokkabei97\u002Fdokkabei-harness --skill nextjs-guide","安装技能，技能地址：https:\u002F\u002Fgithub.com\u002FDokkabei97\u002Fdokkabei-harness\u002Fblob\u002Fmain\u002Fplugins\u002Fnextjs\u002Fskills\u002Fnextjs-guide\u002FSKILL.md",true,[72,78,82,86,90,94,98],{"path":73,"resourceType":74,"resourceTypeDesc":75,"sizeBytes":76,"sourceHtmlUrl":77},"references\u002Fcaching-rendering.md","REFERENCE","参考文档",13025,"https:\u002F\u002Fgithub.com\u002FDokkabei97\u002Fdokkabei-harness\u002Fblob\u002Fmain\u002Fplugins\u002Fnextjs\u002Fskills\u002Fnextjs-guide\u002Freferences\u002Fcaching-rendering.md",{"path":79,"resourceType":74,"resourceTypeDesc":75,"sizeBytes":80,"sourceHtmlUrl":81},"references\u002Fdata-waterfall.md",5382,"https:\u002F\u002Fgithub.com\u002FDokkabei97\u002Fdokkabei-harness\u002Fblob\u002Fmain\u002Fplugins\u002Fnextjs\u002Fskills\u002Fnextjs-guide\u002Freferences\u002Fdata-waterfall.md",{"path":83,"resourceType":74,"resourceTypeDesc":75,"sizeBytes":84,"sourceHtmlUrl":85},"references\u002Frsc-boundary.md",8433,"https:\u002F\u002Fgithub.com\u002FDokkabei97\u002Fdokkabei-harness\u002Fblob\u002Fmain\u002Fplugins\u002Fnextjs\u002Fskills\u002Fnextjs-guide\u002Freferences\u002Frsc-boundary.md",{"path":87,"resourceType":74,"resourceTypeDesc":75,"sizeBytes":88,"sourceHtmlUrl":89},"references\u002Fself-hosting-ops.md",4785,"https:\u002F\u002Fgithub.com\u002FDokkabei97\u002Fdokkabei-harness\u002Fblob\u002Fmain\u002Fplugins\u002Fnextjs\u002Fskills\u002Fnextjs-guide\u002Freferences\u002Fself-hosting-ops.md",{"path":91,"resourceType":74,"resourceTypeDesc":75,"sizeBytes":92,"sourceHtmlUrl":93},"references\u002Fserver-actions-security.md",10789,"https:\u002F\u002Fgithub.com\u002FDokkabei97\u002Fdokkabei-harness\u002Fblob\u002Fmain\u002Fplugins\u002Fnextjs\u002Fskills\u002Fnextjs-guide\u002Freferences\u002Fserver-actions-security.md",{"path":95,"resourceType":74,"resourceTypeDesc":75,"sizeBytes":96,"sourceHtmlUrl":97},"references\u002Fversion-16-changes.md",11711,"https:\u002F\u002Fgithub.com\u002FDokkabei97\u002Fdokkabei-harness\u002Fblob\u002Fmain\u002Fplugins\u002Fnextjs\u002Fskills\u002Fnextjs-guide\u002Freferences\u002Fversion-16-changes.md",{"path":99,"resourceType":74,"resourceTypeDesc":75,"sizeBytes":100,"sourceHtmlUrl":101},"references\u002Fweb-vitals.md",13134,"https:\u002F\u002Fgithub.com\u002FDokkabei97\u002Fdokkabei-harness\u002Fblob\u002Fmain\u002Fplugins\u002Fnextjs\u002Fskills\u002Fnextjs-guide\u002Freferences\u002Fweb-vitals.md",[103,133,159,181,202,225],{"skillNo":104,"name":105,"nameZh":6,"description":106,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":107,"categories":108,"keywords":114,"publishedAt":44},"01M6QZQTNF815AWYMAMJ3B25GY","sync-claude-md","커밋·푸시·PR\u002FMR 직전에 이번 변경이 프로젝트 CLAUDE.md 를 낡게 만드는지 검토하고, 필요할 때만 갱신 diff 를 제안한다 — 아키텍처·디렉터리 구조, 새 통합\u002FMCP, 컨벤션, 빌드·CI·도구, 주요 의존성 변화가 대상. 해당 없으면 한 줄로 끝낸다.\nReviews whether pending changes make the project CLAUDE.md stale (architecture, integrations, conventions, build\u002FCI\u002Ftooling, major dependencies) and proposes a minimal update diff only when needed.\nUse when: \"CLAUDE.md 갱신 필요해?\", \"CLAUDE.md 동기화\", 커밋\u002F푸시\u002FMR 전에 구조·도구가 바뀐 변경을 정리할 때, sync CLAUDE.md, check CLAUDE.md before commit or PR.","https:\u002F\u002Fgithub.com\u002FDokkabei97\u002Fdokkabei-harness\u002Fblob\u002Fmain\u002Fplugins\u002Fworkflow\u002Fskills\u002Fsync-claude-md\u002FSKILL.md",[109],{"categoryNo":110,"categoryName":111,"taxonomyType":112,"taxonomyTypeDesc":113},"01JBSEEDCAT000000000000023","Skill与智能体开发","SCENARIO","使用场景",[115,116,117,118,119,120,121,122,123,124,38,125,126,127,128,129,130,131,132,28],"sync","claude md","sync claude md","MCP","commit","architecture","pr","update","ci","integrations","diff","only","minimal","project","make","reviews","pending","mr",{"skillNo":134,"name":135,"nameZh":6,"description":136,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":137,"categories":138,"keywords":141,"publishedAt":44},"01M6QZQEK94G00N955VQH9EFQN","spec-driven-dev","새 기능·프로젝트·큰 변경을 코드보다 스펙 먼저로 진행하는 게이트 워크플로(SPECIFY → PLAN → TASKS → IMPLEMENT) — 가정 명시, 측정 가능한 성공 기준, Always\u002FAsk\u002FNever 경계, 단계별 사람 검토로 범위 이탈과 재작업을 줄인다.\nSpec-before-code gated workflow for new features or significant changes: explicit assumptions, measurable success criteria, boundaries, and a human review between stages.\nUse when: \"스펙 먼저\", \"기능 명세\", \"요구사항 정리\", starting a new feature or project, a significant change with vague requirements. 단순 버그 수정·1~2줄 변경엔 불필요.","https:\u002F\u002Fgithub.com\u002FDokkabei97\u002Fdokkabei-harness\u002Fblob\u002Fmain\u002Fplugins\u002Fworkflow\u002Fskills\u002Fspec-driven-dev\u002FSKILL.md",[139,140],{"categoryNo":110,"categoryName":111,"taxonomyType":112,"taxonomyTypeDesc":113},{"categoryNo":19,"categoryName":20,"taxonomyType":21,"taxonomyTypeDesc":22},[142,143,144,145,146,147,148,149,150,42,151,152,153,154,128,155,156,157,158,28],"spec","spec driven","dev","spec driven dev","driven","review","workflow","change","tasks","plan","ask","never","human","feature","for","vague","features",{"skillNo":160,"name":161,"nameZh":6,"description":162,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":163,"categories":164,"keywords":165,"publishedAt":44},"01M6QZQA9F6QVGTVDMJ28YQGDV","shipping-guide","프로덕션 배포 전후 가이드 — 배포 전 체크리스트, 피처 플래그 수명주기, 단계적 롤아웃과 진행\u002F보류\u002F롤백 임계값, 롤백 계획 템플릿, 배포 후 모니터링.\nProduction shipping guide: pre-launch checklist, feature-flag lifecycle, staged rollout with go\u002Fhold\u002Frollback thresholds, rollback plan template, post-launch monitoring.\nUse when: \"배포 준비\", \"릴리즈 전 점검\", \"롤아웃 계획\", \"롤백 계획\", preparing a production deploy, staged rollout, feature flags.","https:\u002F\u002Fgithub.com\u002FDokkabei97\u002Fdokkabei-harness\u002Fblob\u002Fmain\u002Fplugins\u002Fworkflow\u002Fskills\u002Fshipping-guide\u002FSKILL.md",[],[166,26,167,168,169,170,171,151,172,173,38,174,175,155,176,177,178,179,180,28],"shipping","shipping guide","launch","monitoring","lifecycle","feature flags","template","rollback","rollout","flags","thresholds","post","with","pre-launch","rollback plan",{"skillNo":182,"name":183,"nameZh":6,"description":184,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":185,"categories":186,"keywords":187,"publishedAt":44},"01M6QZQ3M962PCWYM6YH62D76Z","retro","세션 회고·교훈 컴파운딩 — 이번 세션의 교정·실수·발견을 추출해 품질 기준(재현·일반화·판정 가능성)으로 거르고, 컨벤션 변화는 sync-claude-md 위임, 반복 실수는 tasks\u002Flessons.md(#가드-훅-후보 태그), 스킬 지식 갱신은 수정 제안으로 나눈다. 모든 적용은 승인 후.\nSession retrospective that turns corrections, mistakes, and discoveries into vetted lessons routed to CLAUDE.md sync, tasks\u002Flessons.md, or skill-edit proposals, with user approval before any write.\nUse when: \"회고\", \"레트로\", \"교훈 정리\", \"같은 실수 반복\", \"재발 방지 규칙\", retrospective, lessons learned, wrapping up a task, review, or loop. 여러 실행에 걸친 하네스 개선은 harness:evolve.","https:\u002F\u002Fgithub.com\u002FDokkabei97\u002Fdokkabei-harness\u002Fblob\u002Fmain\u002Fplugins\u002Fworkflow\u002Fskills\u002Fretro\u002FSKILL.md",[],[183,147,115,150,188,189,190,191,192,193,194,195,126,196,197,198,199,200,201,28],"run","harness","loop","evolve","write","edit","proposals","session","up","dry","learned","Session Retrospective","lessons","mistakes",{"skillNo":203,"name":204,"nameZh":6,"description":205,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":206,"categories":207,"keywords":209,"publishedAt":44},"01M6QZPPDATJ7DAGNP0JCXFGRV","project-rules","현재 프로젝트의 스택(빌드 파일 버전, 마이그레이션 도구, ORM 유무, ES 사용, git 호스트)을 감지해 프로젝트 루트 AGENTS.md 의 마커 블록(스택 사실 + 항상 적용되는 스페셜리스트 핵심 ≤15줄 — Claude Code·Codex·Antigravity 공통)과 CLAUDE.md 의 `@AGENTS.md` 연결, Claude 전용 경로 한정 .claude\u002Frules\u002F\u003Cstack>-specialist.md(해당 버전에 실제로 맞는 상세 함정)를 diff 로 제안하고, 스택 플러그인을 런타임별로 프로젝트 범위에서 켜는 법을 안내한다. 이전 버전 출력(CLAUDE.md 블록·specialist-core.md)은 AGENTS.md 로 이전을 제안. --check 는 버전 불일치·사라진 ID·크기 한도·연결 누락을 점검.\nDetects the project's stack and proposes a cross-runtime AGENTS.md block (stack facts + always-on specialist core) linked from CLAUDE.md via @AGENTS.md, plus Claude-only path-scoped specialist rules; migrates the older CLAUDE.md-block layout; --check audits drift.\nUse when: \"이 프로젝트 세팅\", \"프로젝트 규칙 생성\", \"AGENTS.md\u002FCLAUDE.md 점검\", project setup, generate project rules, audit AGENTS.md or CLAUDE.md drift.","https:\u002F\u002Fgithub.com\u002FDokkabei97\u002Fdokkabei-harness\u002Fblob\u002Fmain\u002Fplugins\u002Fworkflow\u002Fskills\u002Fproject-rules\u002FSKILL.md",[208],{"categoryNo":19,"categoryName":20,"taxonomyType":21,"taxonomyTypeDesc":22},[210,128,211,212,213,42,214,215,216,217,125,126,218,219,220,221,222,223,224,28],"Rules","project rules","core","generate","git","audit","stack","orm","es","drift","layout","runtime","-specialist","path","scoped",{"skillNo":226,"name":227,"nameZh":6,"description":228,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":229,"categories":230,"keywords":235,"publishedAt":44},"01M6QZPF3S8YAM27F297F6GVD7","post-merge","MR 머지 완료 후 Plane 이슈 종료와 Outline 문서 업데이트를 자동으로 처리하는 오케스트레이터 스킬입니다.\nissue-tracker와 document-latest 스킬을 연계 실행하여 머지 후 후속 작업을 일괄 처리합니다.\nOrchestrates post-merge follow-up after an MR is merged: chains the issue-tracker and document-latest skills to close the Plane issue and update Outline wiki docs in a single batch. Use when: an MR was just merged, closing tickets and syncing documentation after a merge, post-merge cleanup.","https:\u002F\u002Fgithub.com\u002FDokkabei97\u002Fdokkabei-harness\u002Fblob\u002Fmain\u002Fplugins\u002Fworkflow\u002Fskills\u002Fpost-merge\u002FSKILL.md",[231,234],{"categoryNo":232,"categoryName":233,"taxonomyType":112,"taxonomyTypeDesc":113},"01JBSEEDCAT000000000000002","文档处理",{"categoryNo":110,"categoryName":111,"taxonomyType":112,"taxonomyTypeDesc":113},[236,237,177,238,239,122,240,241,242,196,243,244,245,246,247,248,249,250,132,28],"merge","post merge","documentation","cleanup","batch","wiki","just","issue","tracker","close","closing","follow-up","true","plane","single"]