📝 docs: Update FE 개발 프로세스 문서 및 표준화 로드맵

- Removed outdated date from cover meta
- Commented out assets resource row in the table
- Revised lifecycle description for clarity
- Updated phase details and added new phases for design and verification processes
This commit is contained in:
“hyeonggkim”
2026-04-01 13:11:49 +09:00
parent 5c9b13ed19
commit 2c5cc7605e

View File

@@ -174,7 +174,6 @@
<p class="subtitle">Claude Code Skills 기반 지능형 업무 매뉴얼 — FE 개발 프로세스 표준화 로드맵</p>
<div class="cover-meta">
<span>📋 Version 1.1</span>
<span>📅 2026.03.30</span>
<span>👥 퍼블리싱웹 FE </span>
<span>🔒 팀 내부 공유용</span>
</div>
@@ -222,7 +221,7 @@
<tr><td><strong>SKILL.md</strong></td><td>핵심 지시서 (500줄 이내 권장)</td><td>트리거, 절차, 출력 포맷 정의</td></tr>
<tr><td><strong>scripts/</strong></td><td>반복 작업 자동화 스크립트</td><td>컴포넌트 생성기, 린트 검사기</td></tr>
<tr><td><strong>references/</strong></td><td>도메인별 참조 문서</td><td>Nuxt 컨벤션, API 패턴 가이드</td></tr>
<tr><td><strong>assets/</strong></td><td>템플릿, 아이콘 등 리소스</td><td>컴포넌트 보일러플레이트</td></tr>
<!-- <tr><td><strong>assets/</strong></td><td>템플릿, 아이콘 등 리소스</td><td>컴포넌트 보일러플레이트</td></tr> -->
</tbody>
</table>
@@ -234,7 +233,7 @@
<h2>전체 프로세스 Overview <small>기획 → 디자인 → FE개발 → 검증 워크플로우</small></h2>
</div>
<p>FE 개발 전체 라이프사이클<strong>4개 대단계, 6개 세부 Phase</strong>로 구분하고, 각 Phase마다 전용 Claude Code Skill을 배치합니다.</p>
<p>FE 개발 전체 라이프사이클 각 Phase마다 전용 Claude Code Skill을 배치합니다.</p>
<div class="callout warn">
<span class="callout-icon">🔄</span>
@@ -244,11 +243,15 @@
<table>
<thead><tr><th>대단계</th><th>Phase</th><th>핵심 활동</th><th>Claude Skill</th></tr></thead>
<tbody>
<tr><td><span class="phase-tag plan">기획</span></td><td>Phase 1</td><td>요구사항 정의, 플로우차트</td><td><code>nuxt-requirement-analyzer/SKILL.md<br>nuxt-requirement-analyzer/references/</code></td></tr>
<tr><td><span class="phase-tag design">디자인</span></td><td>Phase 2</td><td>HTML 마크업, Tailwind 컨벤션</td><td><code>markup/SKILL.md<br>markup/references/</code></td></tr>
<tr><td><span class="phase-tag "></span></td><td>Phase 2-1</td><td>프로모션 HTML 마크업</td><td><code>markup/promotion/SKILL.md<br>markup/promotion/references/</code></td></tr>
<tr><td><span class="phase-tag "></span></td><td>Phase 2-2</td><td>EDM HTML 마크업</td><td><code>markup/edm/SKILL.md<br>markup/edm/references/</code></td></tr>
<tr><td><span class="phase-tag dev">FE개발</span></td><td>Phase 3</td><td>Nuxt 컴포넌트 아키텍처</td><td><code>nuxt-component-architect<br>https://github.com/onmax/nuxt-skills/tree/main</code></td></tr>
<tr><td><span class="phase-tag plan">기획</span></td><td>Phase 1</td><td>요구사항 정의, 플로우차트</td><td><code>requirement-analyzer/SKILL.md<br>requirement-analyzer/references/</code></td></tr>
<tr><td><span class="phase-tag design">마크업</span></td><td>Phase 2</td><td>HTML 마크업, Tailwind 컨벤션</td><td><code>markup/SKILL.md<br>markup/references/</code></td></tr>
<tr><td><span class="phase-tag"></span></td><td>Phase 2-0</td><td>PSD -> 피그마 컨버팅</td>
<td><code>SKILL 검토 중<br>Codia AI 디자인 (PSD to Figma)<br>PSD Importer for Figma</code></td>
</tr>
<tr><td><span class="phase-tag "></span></td><td>Phase 2-1</td><td>피그마 HTML 마크업</td><td><code>markup/SKILL.md<br>markup/references/</code></td></tr>
<tr><td><span class="phase-tag "></span></td><td>Phase 2-2</td><td>프로모션 HTML 마크업</td><td><code>markup/promotion/SKILL.md<br>markup/promotion/references/</code></td></tr>
<tr><td><span class="phase-tag "></span></td><td>Phase 2-3</td><td>EDM HTML 마크업</td><td><code>markup/edm/SKILL.md<br>markup/edm/references/</code></td></tr>
<tr><td><span class="phase-tag dev">FE개발</span></td><td>Phase 3</td><td>Nuxt 컴포넌트 아키텍처</td><td><code>component-architect<br>https://github.com/onmax/nuxt-skills/tree/main</code></td></tr>
<tr><td><span class="phase-tag "></span></td>
<td>Phase 3-1</td>
<td>Nuxt 공식문서 기반</td>
@@ -264,9 +267,11 @@
</ul>
</code></td>
</tr>
<tr><td><span class="phase-tag dev">FE개발</span></td><td>Phase 4</td><td>API 연동, Pinia 상태관리</td><td><code>nuxt-api-state-manager/SKILL.md<br>nuxt-api-state-manager/references/</code></td></tr>
<tr><td><span class="phase-tag verify">검증</span></td><td>Phase 5</td><td>성능 최적화 (CWV)</td><td><code>nuxt-perf-optimizer/SKILL.md<br>nuxt-perf-optimizer/references/</code> </td></tr>
<tr><td><span class="phase-tag seo">검증</span></td><td>Phase 6 </td><td>SEO · GEO · AEO 검증</td><td><code>nuxt-seo-geo/SKILL.md<br>nuxt-seo-geo/references/</code> </td></tr>
<tr><td><span class="phase-tag dev">FE개발</span></td><td>Phase 4</td><td>API 연동</td><td><code>api-manager/SKILL.md<br>api-manager/references/</code></td></tr>
<tr><td><span class="phase-tag verify">검증</span></td><td>Phase 5</td><td>검증</td><td><code></code> </td></tr>
<tr><td><span class="phase-tag"></span></td><td>Phase 5-1</td><td>Phase 1 기획 요구사항 검증</td><td><code>requirement-optimizer/SKILL.md<br>requirement-optimizer/references/</code> </td></tr>
<tr><td><span class="phase-tag"></span></td><td>Phase 5-1</td><td>성능 최적화 (CWV)</td><td><code>perf-optimizer/SKILL.md<br>perf-optimizer/references/</code> </td></tr>
<tr><td><span class="phase-tag seo">검증</span></td><td>Phase 6 </td><td>SEO · GEO · AEO 검증</td><td><code>seo-geo/SKILL.md<br>seo-geo/references/</code> </td></tr>
</tbody>
</table>