From 9c95c2ee58abda9ca0494734d11b17781cffe7a3 Mon Sep 17 00:00:00 2001 From: doyoonear Date: Tue, 21 Apr 2026 20:32:45 +0900 Subject: [PATCH 1/5] =?UTF-8?q?feat:=20=EC=BB=A4=EB=B2=84=EB=A6=AC?= =?UTF-8?q?=EC=A7=80=20=EB=A7=B5=20+=20=ED=95=98=EB=84=A4=EC=8A=A4=20?= =?UTF-8?q?=ED=8C=8C=EC=9D=B4=ED=94=84=EB=9D=BC=EC=9D=B8=20=EB=8B=A4?= =?UTF-8?q?=EC=9D=B4=EC=96=B4=EA=B7=B8=EB=9E=A8=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit diagram-design 스킬(cathrynlavery/diagram-design)의 editorial 디자인 시스템을 따라 SVG 다이어그램 2종을 추가했어요. - `ChapterMap`: 소개 페이지에서 35장 중 20장 커버리지를 3개 테마로 시각화 - `HarnessPipeline`: README에서 6-에이전트 퍼블리싱 하네스 구조를 시각화 - `static/diagrams/*.svg`: GitHub README용 독립 SVG. prefers-color-scheme 쿼리로 다크 모드에 대응해요. - `src/css/custom.css`: `--cc2-*` 다이어그램 토큰(light/dark) 추가. 프로젝트 그린(#16A34A)을 accent로, amber(#D97706)를 피드백 루프 강조로 매핑했어요. MDX 인라인 컴포넌트는 Docusaurus CSS 변수를 상속해 light/dark 토글에 자동으로 반응해요. --- README.md | 14 + docs/index.mdx | 3 + src/components/ChapterMap.module.css | 16 + src/components/ChapterMap.tsx | 412 +++++++++++ src/components/HarnessPipeline.module.css | 16 + src/components/HarnessPipeline.tsx | 822 ++++++++++++++++++++++ src/css/custom.css | 28 + static/diagrams/chapter-map.svg | 121 ++++ static/diagrams/harness-pipeline.svg | 185 +++++ 9 files changed, 1617 insertions(+) create mode 100644 src/components/ChapterMap.module.css create mode 100644 src/components/ChapterMap.tsx create mode 100644 src/components/HarnessPipeline.module.css create mode 100644 src/components/HarnessPipeline.tsx create mode 100644 static/diagrams/chapter-map.svg create mode 100644 static/diagrams/harness-pipeline.svg diff --git a/README.md b/README.md index 6906e20..870b613 100644 --- a/README.md +++ b/README.md @@ -140,6 +140,10 @@ Code Complete는 30년이 지난 지금도 유효한 소프트웨어 구현 원 ## 챕터 구성 +

+ Code Complete 2판 35장 중 다룬 20장 커버리지 맵 +

+ | 파트 | 챕터 | 주제 | |------|------|------| | 🧭 구현의 기초 | 1–4장 | 소프트웨어 구현 기초, 메타포, 선행 조건 | @@ -151,6 +155,16 @@ Code Complete는 30년이 지난 지금도 유효한 소프트웨어 구현 원
+## 퍼블리싱 하네스 + +Notion 산출물을 Docusaurus로 옮기는 작업은 6개 에이전트가 3-Zone YAML을 주고받는 파이프라인으로 자동화돼 있어요. 자세한 구조는 [`CLAUDE.md`](./CLAUDE.md)에서 확인할 수 있어요. + +

+ 6-에이전트 하네스 파이프라인 — Notion DB에서 Docusaurus MDX까지 +

+ +
+ ## 로컬 개발 ```bash diff --git a/docs/index.mdx b/docs/index.mdx index 40f779f..9bcf057 100644 --- a/docs/index.mdx +++ b/docs/index.mdx @@ -7,6 +7,7 @@ hide_title: true import HeroSection from '@site/src/components/HeroSection'; import MemberGrid from '@site/src/components/MemberGrid'; +import ChapterMap from '@site/src/components/ChapterMap'; @@ -35,6 +36,8 @@ McConnell이 2004년에 쓴 책이지만 핵심 원칙(복잡도 관리·정보 총 35장 중 **20장**을 커버했어요. 사이드바는 책 내용의 흐름(구현 전 준비 → 좋은 코드 → 완성과 성장)에 맞춰 3개 테마로 묶었어요. + + | 테마 | 책 챕터 | 주제 | | ----------------- | ---------------- | ------------------------------------------------------------------- | | 🧭 구현의 기초 | 1-4장, 5-6장 | 구현이란 · 비유 · 문제 정의 · 요구사항 / 구현 설계 · 클래스 설계 | diff --git a/src/components/ChapterMap.module.css b/src/components/ChapterMap.module.css new file mode 100644 index 0000000..4305eb8 --- /dev/null +++ b/src/components/ChapterMap.module.css @@ -0,0 +1,16 @@ +.wrapper { + margin: 1rem 0; + padding: 0; + background: transparent; + border: 0; + overflow-x: auto; +} + +.svg { + display: block; + width: 100%; + height: auto; + min-width: 720px; + max-width: 1200px; + margin: 0 auto; +} diff --git a/src/components/ChapterMap.tsx b/src/components/ChapterMap.tsx new file mode 100644 index 0000000..9cd4025 --- /dev/null +++ b/src/components/ChapterMap.tsx @@ -0,0 +1,412 @@ +import styles from './ChapterMap.module.css'; + +export default function ChapterMap() { + return ( +
+ + Code Complete 2판 35장 커버리지 맵 + + 세 테마(구현의 기초, 좋은 코드 쓰기, 완성과 성장)에 걸쳐 35장 중 20장이 다뤄졌고 15장이 + 미커버임을 보여주는 nested containment 다이어그램 + + + + + + + + + + + + {/* Theme 1 — 구현의 기초 */} + + + + + THEME · 기초 + + + 🧭 구현의 기초 + + + 구현이란 무엇인가 · 비유 · 사전 준비 · 설계 + + + + 1~4장 · 구현 · 비유 · 요구사항 · 결정 + + + WEEK 8 · COVERED + + + + 5~6장 · 구현 설계 · 클래스 설계 + + + WEEK 6 · COVERED + + + + 10~19장 · 변수 · 조건문 · 제어 + + + 데이터 타입 · 변수 · 기본 제어 구조 등 + + + 언어 메커니즘에 해당해 프레임워크 시대 + + + FE에선 우선순위를 낮춰 선정 제외됐어요 + + + 10 CHAPTERS · NOT COVERED + + + + {/* Theme 2 — 좋은 코드 쓰기 */} + + + + + THEME · 좋은 코드 + + + ✏️ 좋은 코드 쓰기 + + + 루틴 · 방어적 프로그래밍 · 품질 · 테스트 · 디버깅 + + + + 7~9장 · 루틴 · 방어 · 의사코드(PPP) + + + WEEK 7 · COVERED + + + + 20~23장 · 품질 · 협력 · 테스트 · 디버깅 + + + WEEK 3~4 · COVERED + + + + 27~30장 · 시스템 고려사항 + + + 프로그램 규모 · 관리 · 생산성 도구 등 + + + 조직·관리 영역이 많아 개발자 관점 학습의 + + + 우선순위에서 뒤로 밀렸어요 + + + 4 CHAPTERS · NOT COVERED + + + + {/* Theme 3 — 완성과 성장 */} + + + + + THEME · 완성 + + + 🔧 완성과 성장 + + + 리팩터링 · 코드 튜닝 · 레이아웃 · 장인정신 + + + + 24~26장 · 리팩터링 · 튜닝 전략·기법 + + + WEEK 5 · COVERED + + + + 31~34장 · 레이아웃 · 자기 설명 · 장인정신 + + + WEEK 2 · COVERED + + + + 35장 · 추가 도서와 자원 + + + McConnell이 권하는 다음 읽을 거리 모음 + + + 본문 원칙 학습 대상이 아니라 부록 성격이라 + + + 스터디 범위에서 제외됐어요 + + + 1 CHAPTER · NOT COVERED + + + + {/* Legend */} + + + LEGEND + + + + 다룬 장 (20) + + + + 미커버 (15) + + + COVERAGE 20/35 · 57% + + +
+ ); +} diff --git a/src/components/HarnessPipeline.module.css b/src/components/HarnessPipeline.module.css new file mode 100644 index 0000000..f9a23c8 --- /dev/null +++ b/src/components/HarnessPipeline.module.css @@ -0,0 +1,16 @@ +.wrapper { + margin: 1rem 0; + padding: 0; + background: transparent; + border: 0; + overflow-x: auto; +} + +.svg { + display: block; + width: 100%; + height: auto; + min-width: 860px; + max-width: 1200px; + margin: 0 auto; +} diff --git a/src/components/HarnessPipeline.tsx b/src/components/HarnessPipeline.tsx new file mode 100644 index 0000000..a9fff1d --- /dev/null +++ b/src/components/HarnessPipeline.tsx @@ -0,0 +1,822 @@ +import styles from './HarnessPipeline.module.css'; + +export default function HarnessPipeline() { + return ( +
+ + code-complete-2 하네스 6-에이전트 파이프라인 + + Notion DB를 입력으로 받아 6개 에이전트(notion-extractor, chapter-editor, + fe-content-enhancer, mdx-writer, aggregator, voice-validator)를 거쳐 Docusaurus MDX + 페이지와 대시보드 부록을 생성하는 데이터 파이프라인 + + + + + + + + + + + + + + + + + + {/* Main flow arrows */} + + + + FETCH + + + + + + 3-ZONE YAML + + + + + + EDITED YAML + + + + + + ENHANCED + + + + + + WRITE + + + {/* Branch to aggregator */} + + + + ALL YAML + + + + + + DASHBOARD + + + {/* voice-validator: write → validate */} + + + + VALIDATE + + + {/* Feedback loop */} + + + + SLOP DETECTED · REWORK + + + {/* Notion DB (external) */} + + + + + SOURCE + + + Notion DB + + + 산출물 워크스페이스 + + + {/* 1. notion-extractor */} + + + + + AGENT + + + notion-extractor + + + raw → 3-Zone YAML + + + {/* 2. chapter-editor ★ FOCAL */} + + + + + ★ LEAD + + + chapter-editor + + + 9섹션 재배치 + + + + 브릿지 문장 + + + {/* 3. fe-content-enhancer */} + + + + + AGENT + + + fe-content-enhancer + + + Java/C++ → React/TS + + + {/* 4. mdx-writer */} + + + + + AGENT + + + mdx-writer + + + YAML → MDX + + + {/* MDX output */} + + + + + OUTPUT + + + docs/*.mdx + + + 6 페이지 + + + {/* 5. aggregator */} + + + + + AGENT + + + aggregator + + + 판정·투표·토론 집계 + + + {/* Dashboard output */} + + + + + OUTPUT + + + dashboard + + + 부록 + + + {/* 6. voice-validator (feedback loop) */} + + + + + FEEDBACK + + + voice-validator + + + AI 슬롭 탐지 · 재작성 유도 + + + {/* Legend */} + + + LEGEND + + + + 주역 · 결과물 + + + + 주 흐름 + + + + 피드백 루프 (슬롭 재작성) + + + 6 AGENTS · 10 SKILLS + + +
+ ); +} diff --git a/src/css/custom.css b/src/css/custom.css index a35f1a6..bae1e63 100644 --- a/src/css/custom.css +++ b/src/css/custom.css @@ -25,6 +25,20 @@ /* 산악회 amber 강조색 */ --ham-accent: #D97706; --ham-accent-light: #FCD34D; + + /* diagram-design 토큰 (static/diagrams SVG + src/components/ChapterMap·HarnessPipeline에서 사용) */ + --cc2-paper: #ffffff; + --cc2-paper-2: #f6f8fa; + --cc2-ink: #1F2328; + --cc2-muted: #57534e; + --cc2-soft: #78716c; + --cc2-rule: rgba(31, 35, 40, 0.12); + --cc2-rule-solid: rgba(120, 113, 108, 0.35); + --cc2-accent: #16A34A; + --cc2-accent-tint: rgba(22, 163, 74, 0.10); + --cc2-accent-2: #D97706; + --cc2-arrow-default: #78716c; + --cc2-arrow-feedback: #D97706; } [data-theme='dark'] { @@ -42,6 +56,20 @@ --ifm-navbar-background-color: #161B22; --ifm-navbar-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.06); --ifm-card-background-color: #161B22; + + /* diagram-design 토큰 · 다크 */ + --cc2-paper: #0D1117; + --cc2-paper-2: #161B22; + --cc2-ink: #f0f6fc; + --cc2-muted: #a8a29e; + --cc2-soft: #8e8680; + --cc2-rule: rgba(240, 246, 252, 0.18); + --cc2-rule-solid: rgba(168, 162, 158, 0.35); + --cc2-accent: #4ADE80; + --cc2-accent-tint: rgba(74, 222, 128, 0.14); + --cc2-accent-2: #FCD34D; + --cc2-arrow-default: #a8a29e; + --cc2-arrow-feedback: #FCD34D; } /* 사이드바 메뉴 폰트 크기 */ diff --git a/static/diagrams/chapter-map.svg b/static/diagrams/chapter-map.svg new file mode 100644 index 0000000..69de547 --- /dev/null +++ b/static/diagrams/chapter-map.svg @@ -0,0 +1,121 @@ + + Code Complete 2판 35장 커버리지 맵 + 세 테마에 걸쳐 35장 중 20장이 다뤄졌고 15장이 미커버임을 보여주는 nested containment 다이어그램 + + + + + + + + + + THEME · 기초 + 🧭 구현의 기초 + 구현이란 무엇인가 · 비유 · 사전 준비 · 설계 + + + 1~4장 · 구현 · 비유 · 요구사항 · 결정 + WEEK 8 · COVERED + + + 5~6장 · 구현 설계 · 클래스 설계 + WEEK 6 · COVERED + + + 10~19장 · 변수 · 조건문 · 제어 + 데이터 타입 · 변수 · 기본 제어 구조 등 + 언어 메커니즘에 해당해 프레임워크 시대 + FE에선 우선순위를 낮춰 선정 제외됐어요 + 10 CHAPTERS · NOT COVERED + + + + + + + THEME · 좋은 코드 + ✏️ 좋은 코드 쓰기 + 루틴 · 방어적 프로그래밍 · 품질 · 테스트 · 디버깅 + + + 7~9장 · 루틴 · 방어 · 의사코드(PPP) + WEEK 7 · COVERED + + + 20~23장 · 품질 · 협력 · 테스트 · 디버깅 + WEEK 3~4 · COVERED + + + 27~30장 · 시스템 고려사항 + 프로그램 규모 · 관리 · 생산성 도구 등 + 조직·관리 영역이 많아 개발자 관점 학습의 + 우선순위에서 뒤로 밀렸어요 + 4 CHAPTERS · NOT COVERED + + + + + + + THEME · 완성 + 🔧 완성과 성장 + 리팩터링 · 코드 튜닝 · 레이아웃 · 장인정신 + + + 24~26장 · 리팩터링 · 튜닝 전략·기법 + WEEK 5 · COVERED + + + 31~34장 · 레이아웃 · 자기 설명 · 장인정신 + WEEK 2 · COVERED + + + 35장 · 추가 도서와 자원 + McConnell이 권하는 다음 읽을 거리 모음 + 본문 원칙 학습 대상이 아니라 부록 성격이라 + 스터디 범위에서 제외됐어요 + 1 CHAPTER · NOT COVERED + + + + + LEGEND + + + 다룬 장 (20) + + + 미커버 (15) + + COVERAGE 20/35 · 57% + diff --git a/static/diagrams/harness-pipeline.svg b/static/diagrams/harness-pipeline.svg new file mode 100644 index 0000000..346e0b9 --- /dev/null +++ b/static/diagrams/harness-pipeline.svg @@ -0,0 +1,185 @@ + + code-complete-2 하네스 6-에이전트 파이프라인 + Notion DB를 입력으로 받아 6개 에이전트가 3-Zone YAML을 다듬어 Docusaurus MDX를 생성하는 데이터 파이프라인 + + + + + + + + + + + + + + + + + + FETCH + + + + 3-ZONE YAML + + + + EDITED YAML + + + + ENHANCED + + + + WRITE + + + + + ALL YAML + + + + DASHBOARD + + + + + VALIDATE + + + + + SLOP DETECTED · REWORK + + + + + + SOURCE + Notion DB + 산출물 워크스페이스 + + + + + + AGENT + notion-extractor + raw → 3-Zone YAML + + + + + + ★ LEAD + chapter-editor + 9섹션 재배치 + + 브릿지 문장 + + + + + + AGENT + fe-content-enhancer + Java/C++ → React/TS + + + + + + AGENT + mdx-writer + YAML → MDX + + + + + + OUTPUT + docs/*.mdx + 6 페이지 + + + + + + AGENT + aggregator + 판정·투표·토론 집계 + + + + + + OUTPUT + dashboard + 부록 + + + + + + FEEDBACK + voice-validator + AI 슬롭 탐지 · 재작성 유도 + + + + LEGEND + + + 주역 · 결과물 + + + 주 흐름 + + + 피드백 루프 (슬롭 재작성) + + 6 AGENTS · 10 SKILLS + From e88b2b174348aa1436bcec1eae8fe8aee51f1a3c Mon Sep 17 00:00:00 2001 From: doyoonear Date: Tue, 21 Apr 2026 20:33:02 +0900 Subject: [PATCH 2/5] =?UTF-8?q?docs:=20=EC=86=8C=EA=B0=9C=20=ED=8E=98?= =?UTF-8?q?=EC=9D=B4=EC=A7=80=20=ED=85=8C=EB=A7=88=20=ED=85=8C=EC=9D=B4?= =?UTF-8?q?=EB=B8=94=20=EC=A0=9C=EA=B1=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit `ChapterMap` 다이어그램이 같은 정보(3개 테마 × 책 챕터 × 주제)를 공간적으로 표현하므로, 바로 아래 중복되는 테이블은 제거했어요. --- docs/index.mdx | 6 ------ 1 file changed, 6 deletions(-) diff --git a/docs/index.mdx b/docs/index.mdx index 9bcf057..0c85cf9 100644 --- a/docs/index.mdx +++ b/docs/index.mdx @@ -38,12 +38,6 @@ McConnell이 2004년에 쓴 책이지만 핵심 원칙(복잡도 관리·정보 -| 테마 | 책 챕터 | 주제 | -| ----------------- | ---------------- | ------------------------------------------------------------------- | -| 🧭 구현의 기초 | 1-4장, 5-6장 | 구현이란 · 비유 · 문제 정의 · 요구사항 / 구현 설계 · 클래스 설계 | -| ✏️ 좋은 코드 쓰기 | 7-9장, 20-23장 | 좋은 루틴 · 방어적 프로그래밍 · PPP / 품질 · 협력 · 테스트 · 디버깅 | -| 🔧 완성과 성장 | 24-26장, 31-34장 | 리팩터링 · 코드 튜닝 / 레이아웃 · 자기 설명 · 성격 · 장인정신 | - ## 기여하고 싶다면 오타·번역 제안·다른 시각의 의견은 [GitHub From 10503427d2d822453d1d2f50861e64273632545d Mon Sep 17 00:00:00 2001 From: doyoonear Date: Tue, 21 Apr 2026 21:15:15 +0900 Subject: [PATCH 3/5] =?UTF-8?q?feat:=20=EB=8C=80=EC=8B=9C=EB=B3=B4?= =?UTF-8?q?=EB=93=9C=20=EC=A7=84=ED=96=89=20=ED=83=80=EC=9E=84=EB=9D=BC?= =?UTF-8?q?=EC=9D=B8=20=EB=8B=A4=EC=9D=B4=EC=96=B4=EA=B7=B8=EB=9E=A8=20?= =?UTF-8?q?=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit `ProgressTimeline` 컴포넌트로 6개 주차의 누적 학습 곡선을 시각화해서 기존 표를 대체했어요. - 가로 타임라인에 6개 이벤트 노드(2주차 → 8주차)를 실제 주차 간격에 비례해 배치해요 — 3~4주차는 간격이 2배 더 넓게 표현돼요. - 각 노드에 주차·파트·챕터·테마가 모두 담겨서 기존 표의 모든 정보를 한눈에 볼 수 있어요. - 8주차 노드는 accent-tint로 focal 처리해서 "현재 지점"을 강조했어요. - 누적 수치(4 → 8 → 11 → 13 → 16 → 20 / 35)는 베이스라인 옆에 모노 폰트로 노출해요. --- docs/appendix/dashboard.mdx | 12 +- src/components/ProgressTimeline.module.css | 16 + src/components/ProgressTimeline.tsx | 404 +++++++++++++++++++++ static/diagrams/progress-timeline.svg | 104 ++++++ 4 files changed, 526 insertions(+), 10 deletions(-) create mode 100644 src/components/ProgressTimeline.module.css create mode 100644 src/components/ProgressTimeline.tsx create mode 100644 static/diagrams/progress-timeline.svg diff --git a/docs/appendix/dashboard.mdx b/docs/appendix/dashboard.mdx index 5a5485a..9230ccc 100644 --- a/docs/appendix/dashboard.mdx +++ b/docs/appendix/dashboard.mdx @@ -8,6 +8,7 @@ unlisted: true import VerdictDistribution from '@site/src/components/VerdictDistribution'; import BestDiscussions from '@site/src/components/BestDiscussions'; +import ProgressTimeline from '@site/src/components/ProgressTimeline'; ## 📖 스터디 개요 @@ -109,16 +110,7 @@ import BestDiscussions from '@site/src/components/BestDiscussions'; ## 📅 진행 타임라인 -스터디는 책 챕터 순서가 아니라 주차 순서로 진행됐어요. 누적 챕터 수는 다음과 같이 쌓였어요. - -| 순서 | 주차 | 책 챕터 | 파트 레이블 | 판정 상태 | 누적 | -| ---- | ------- | -------------- | ----------------------------------------- | --------- | ---- | -| 1 | 2주차 | 31, 32, 33, 34 | Part 7 (레이아웃·자기 설명·성격·장인정신) | complete | 4장 | -| 2 | 3~4주차 | 20, 21, 22, 23 | Part 5 (품질·협력·테스트·디버깅) | complete | 8장 | -| 3 | 5주차 | 24, 25, 26 | Part 5 (리팩터링·튜닝 전략·튜닝 기법) | complete | 11장 | -| 4 | 6주차 | 5, 6 | Part 2 (구현 설계·클래스 설계) | complete | 13장 | -| 5 | 7주차 | 7, 8, 9 | Part 2 (루틴·방어적 프로그래밍·PPP) | complete | 16장 | -| 6 | 8주차 | 1, 2, 3, 4 | Part 1 (개요·비유·사전준비·핵심결정) | complete | 20장 | + ## ⚠️ 경고 diff --git a/src/components/ProgressTimeline.module.css b/src/components/ProgressTimeline.module.css new file mode 100644 index 0000000..053de4d --- /dev/null +++ b/src/components/ProgressTimeline.module.css @@ -0,0 +1,16 @@ +.wrapper { + margin: 1rem 0; + padding: 0; + background: transparent; + border: 0; + overflow-x: auto; +} + +.svg { + display: block; + width: 100%; + height: auto; + min-width: 820px; + max-width: 1200px; + margin: 0 auto; +} diff --git a/src/components/ProgressTimeline.tsx b/src/components/ProgressTimeline.tsx new file mode 100644 index 0000000..fe7ffc6 --- /dev/null +++ b/src/components/ProgressTimeline.tsx @@ -0,0 +1,404 @@ +import styles from './ProgressTimeline.module.css'; + +export default function ProgressTimeline() { + return ( +
+ + 스터디 진행 타임라인 + + 2주차부터 8주차까지 6개 페이지에 걸쳐 누적 4장 → 8장 → 11장 → 13장 → 16장 → 20장으로 쌓인 + 진행 경과 타임라인 + + + + + + + + + + + + {/* Baseline */} + + + {/* Progress fill — full range covered (2주차 ~ 8주차 모두 complete) */} + + + {/* ─────────── Node 1 · 2주차 (label above) ─────────── */} + + + + 2주차 · PART 7 + + + 31 · 32 · 33 · 34 + + + 레이아웃 · 자기 설명 + + {/* Cumulative below */} + + 4 / 35 + + + {/* ─────────── Node 2 · 3~4주차 (label below) ─────────── */} + + + + 3~4주차 · PART 5 + + + 20 · 21 · 22 · 23 + + + 품질 · 협력 · 테스트 + + {/* Cumulative above (flipped position for below-label nodes) */} + + 8 / 35 + + + {/* ─────────── Node 3 · 5주차 (label above) ─────────── */} + + + + 5주차 · PART 5 + + + 24 · 25 · 26 + + + 리팩터링 · 튜닝 + + + 11 / 35 + + + {/* ─────────── Node 4 · 6주차 (label below) ─────────── */} + + + + 6주차 · PART 2 + + + 5 · 6 + + + 구현 설계 · 클래스 + + + 13 / 35 + + + {/* ─────────── Node 5 · 7주차 (label above) ─────────── */} + + + + 7주차 · PART 2 + + + 7 · 8 · 9 + + + 루틴 · 방어 · PPP + + + 16 / 35 + + + {/* ─────────── Node 6 · 8주차 FOCAL (label below) ─────────── */} + + + + + 8주차 · PART 1 + + + 1 · 2 · 3 · 4 + + + 개요 · 비유 · 결정 + + + 20 / 35 + + + {/* Editorial aside */} + + 책 챕터 순서가 아니라 주차 순서로 진행했어요 — 가장 최근에 읽은 1~4장이 맨 오른쪽. + + + {/* Legend */} + + + LEGEND + + + + 완료 주차 + + + + 현재 지점 + + + 6 SESSIONS · 20 CHAPTERS + + +
+ ); +} diff --git a/static/diagrams/progress-timeline.svg b/static/diagrams/progress-timeline.svg new file mode 100644 index 0000000..aa4c126 --- /dev/null +++ b/static/diagrams/progress-timeline.svg @@ -0,0 +1,104 @@ + + 스터디 진행 타임라인 + 2주차부터 8주차까지 누적 4장→8장→11장→13장→16장→20장으로 쌓인 진행 경과 + + + + + + + + + + + + + + 2주차 · PART 7 + 31 · 32 · 33 · 34 + 레이아웃 · 자기 설명 + 4 / 35 + + + + + 3~4주차 · PART 5 + 20 · 21 · 22 · 23 + 품질 · 협력 · 테스트 + 8 / 35 + + + + + 5주차 · PART 5 + 24 · 25 · 26 + 리팩터링 · 튜닝 + 11 / 35 + + + + + 6주차 · PART 2 + 5 · 6 + 구현 설계 · 클래스 + 13 / 35 + + + + + 7주차 · PART 2 + 7 · 8 · 9 + 루틴 · 방어 · PPP + 16 / 35 + + + + + + 8주차 · PART 1 + 1 · 2 · 3 · 4 + 개요 · 비유 · 결정 + 20 / 35 + + + 책 챕터 순서가 아니라 주차 순서로 진행했어요 — 가장 최근에 읽은 1~4장이 맨 오른쪽. + + + + LEGEND + + + 완료 주차 + + + 현재 지점 + + 6 SESSIONS · 20 CHAPTERS + From d4562bfe28fb8f1d13031b0abef2b3d4aebb3e0f Mon Sep 17 00:00:00 2001 From: doyoonear Date: Tue, 21 Apr 2026 21:35:03 +0900 Subject: [PATCH 4/5] =?UTF-8?q?fix:=20=ED=95=98=EB=84=A4=EC=8A=A4=20?= =?UTF-8?q?=ED=8C=8C=EC=9D=B4=ED=94=84=EB=9D=BC=EC=9D=B8=20=EB=85=B8?= =?UTF-8?q?=EB=93=9C=20=ED=8F=AD=20=ED=99=95=EB=8C=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 노드 텍스트가 박스 경계에 딱 붙어 읽기 어렵던 문제를 고쳤어요. - `fe-content-enhancer` 128 → 160 (가장 긴 라벨) - `notion-extractor`·`chapter-editor`·`mdx-writer`·`aggregator`·`voice-validator` 128 → 144 - `docs/*.mdx`·`dashboard` 출력 박스 64 → 88 - 나머지 x 좌표·화살표·피드백 path 모두 새 레이아웃에 맞춰 재배치 --- src/components/HarnessPipeline.tsx | 217 ++++++++++++++------------- static/diagrams/harness-pipeline.svg | 154 +++++++++---------- 2 files changed, 186 insertions(+), 185 deletions(-) diff --git a/src/components/HarnessPipeline.tsx b/src/components/HarnessPipeline.tsx index a9fff1d..1dae89b 100644 --- a/src/components/HarnessPipeline.tsx +++ b/src/components/HarnessPipeline.tsx @@ -40,19 +40,19 @@ export default function HarnessPipeline() { - {/* Main flow arrows */} + {/* ─── Main-row arrows ─── */} - + - + - + - + - + - {/* Branch to aggregator */} + {/* ─── Branch to aggregator (enhancer → aggregator) ─── */} - + + {/* aggregator → dashboard */} - + - {/* voice-validator: write → validate */} + {/* writer → voice-validator */} - + - {/* Feedback loop */} + {/* Feedback loop — voice-validator → chapter-editor */} - + - {/* Notion DB (external) */} + {/* ─── Notion DB ─── */} - {/* 1. notion-extractor */} - + {/* ─── 1. notion-extractor ─── */} + - {/* 2. chapter-editor ★ FOCAL */} - + {/* ─── 2. chapter-editor ★ FOCAL ─── */} + - {/* 3. fe-content-enhancer */} - + {/* ─── 3. fe-content-enhancer ─── */} + - {/* 4. mdx-writer */} - + {/* ─── 4. mdx-writer ─── */} + - {/* MDX output */} - + {/* ─── MDX output ─── */} + - {/* 5. aggregator */} - + {/* ─── 5. aggregator ─── */} + - {/* Dashboard output */} - + {/* ─── Dashboard output ─── */} + - {/* 6. voice-validator (feedback loop) */} - + {/* ─── 6. voice-validator (feedback) ─── */} + - {/* Legend */} + {/* ─── Legend ─── */} - - - - FETCH + + + + FETCH - - - 3-ZONE YAML + + + 3-ZONE YAML - - - EDITED YAML + + + EDITED YAML - - - ENHANCED + + + ENHANCED - - - WRITE + + + WRITE - - - ALL YAML + + + ALL YAML - - - DASHBOARD + + + DASHBOARD - - - VALIDATE + + + VALIDATE - - - SLOP DETECTED · REWORK + + + SLOP DETECTED · REWORK @@ -104,69 +104,69 @@ 산출물 워크스페이스 - - - - AGENT - notion-extractor - raw → 3-Zone YAML + + + + AGENT + notion-extractor + raw → 3-Zone YAML - - - - ★ LEAD - chapter-editor - 9섹션 재배치 - + 브릿지 문장 + + + + ★ LEAD + chapter-editor + 9섹션 재배치 + + 브릿지 문장 - - - - AGENT - fe-content-enhancer - Java/C++ → React/TS + + + + AGENT + fe-content-enhancer + Java/C++ → React/TS - - - - AGENT - mdx-writer - YAML → MDX + + + + AGENT + mdx-writer + YAML → MDX - - - - OUTPUT - docs/*.mdx - 6 페이지 + + + + OUTPUT + docs/*.mdx + 6 페이지 - - - - AGENT - aggregator - 판정·투표·토론 집계 + + + + AGENT + aggregator + 판정·투표·토론 집계 - - - - OUTPUT - dashboard - 부록 + + + + OUTPUT + dashboard + 부록 - - - - FEEDBACK - voice-validator - AI 슬롭 탐지 · 재작성 유도 + + + + FEEDBACK + voice-validator + AI 슬롭 탐지 · 재작성 유도 From 60ef516ae803facc51f494744b4cb07f72407e8c Mon Sep 17 00:00:00 2001 From: doyoonear Date: Tue, 21 Apr 2026 21:37:38 +0900 Subject: [PATCH 5/5] =?UTF-8?q?refactor:=20=ED=95=98=EB=84=A4=EC=8A=A4=20?= =?UTF-8?q?=ED=8C=8C=EC=9D=B4=ED=94=84=EB=9D=BC=EC=9D=B8=20=ED=99=94?= =?UTF-8?q?=EC=82=B4=ED=91=9C=20=EB=A0=88=EC=9D=B4=EB=B8=94=20=EC=A0=9C?= =?UTF-8?q?=EA=B1=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 노드 이름과 흐름 방향이 이미 정보를 전달하고 있어서 화살표 위의 단계 레이블은 소음에 가까웠어요. 다음 9개 레이블과 배경 마스크를 모두 제거했어요. - FETCH · 3-ZONE YAML · EDITED YAML · ENHANCED · WRITE - ALL YAML · DASHBOARD · VALIDATE - SLOP DETECTED · REWORK 피드백 루프 의미는 amber dashed 화살표 + 레전드로 유지돼요. --- src/components/HarnessPipeline.tsx | 112 --------------------------- static/diagrams/harness-pipeline.svg | 23 ------ 2 files changed, 135 deletions(-) diff --git a/src/components/HarnessPipeline.tsx b/src/components/HarnessPipeline.tsx index 1dae89b..7102b7b 100644 --- a/src/components/HarnessPipeline.tsx +++ b/src/components/HarnessPipeline.tsx @@ -50,19 +50,6 @@ export default function HarnessPipeline() { strokeWidth="1.2" markerEnd="url(#h-arrow)" /> - - - FETCH - - - - - 3-ZONE YAML - - - - - EDITED YAML - - - - - ENHANCED - - - - - WRITE - {/* ─── Branch to aggregator (enhancer → aggregator) ─── */} - - - ALL YAML - {/* aggregator → dashboard */} - - - DASHBOARD - {/* writer → voice-validator */} - - - VALIDATE - {/* Feedback loop — voice-validator → chapter-editor */} - - - SLOP DETECTED · REWORK - {/* ─── Notion DB ─── */} diff --git a/static/diagrams/harness-pipeline.svg b/static/diagrams/harness-pipeline.svg index 2e4f30f..0fd3337 100644 --- a/static/diagrams/harness-pipeline.svg +++ b/static/diagrams/harness-pipeline.svg @@ -57,43 +57,20 @@ - - FETCH - - - 3-ZONE YAML - - - EDITED YAML - - - ENHANCED - - - WRITE - - ALL YAML - - - DASHBOARD - - VALIDATE - - SLOP DETECTED · REWORK