---
tags: [개발/설계, template/mermaid, moc]
---

# 개발 다이어그램 인덱스 — 무엇을 그릴지 고르기

발표·설계도면에서 **로직·흐름·데이터**를 그릴 때 쓰는 Mermaid 템플릿. 인프라·클라우드 구성은 상위 폴더의 인프라 템플릿(01~06)을 쓴다.

## 목적 → 다이어그램 고르기

| 설명하려는 것 | 다이어그램 | 파일 |
|---|---|---|
| 컴포넌트 간 시간순 호출 (인증·연동·에러 경로) | 시퀀스 | [[01_시퀀스_API인증흐름]] |
| 엔티티가 거치는 상태와 전이 (승인 게이트 있는 자동화) | 상태 머신 | [[02_상태머신]] |
| 테이블·관계·카디널리티 (스키마 리뷰) | ERD | [[03_ERD_데이터모델]] |
| 조건 분기가 있는 처리 로직 | 플로우차트 | [[04_플로우차트_분기로직]] |
| 시스템 전체 구성 (누가 쓰나 / 무엇으로 구성되나) | C4 | [[05_C4_컨텍스트_컨테이너]] |
| 브랜치·머지·릴리즈 흐름 | gitGraph | [[06_gitGraph_브랜치전략]] |
| 커밋→배포 자동화 단계·게이트 | CI/CD | [[07_CICD_파이프라인]] |
| 도메인 객체·속성·관계·행위 | 클래스/도메인 | [[08_도메인_클래스모델]] |
| 사용자가 화면·단계를 거치는 경로 | 유저 플로우 | [[09_유저플로우]] |
| 작업 분해·일정·의존 | Gantt/WBS | [[10_Gantt_WBS일정]] |

## 사용법

1. 위 표에서 목적에 맞는 파일 1개를 연다.
2. `mermaid` 코드 블록을 복사해 발표 노트·설계 문서에 붙인다.
3. 예시 노드·라벨을 실제 내용으로 바꾼다.
4. 각 파일 하단의 "반드시 표기할 것"을 채웠는지 확인한다.

## 규약

- **색상·경계 표기는 [[10_지식/08_인프라/_설계_키트/표기_규칙|표기 규칙]]을 공유한다** — 파랑=요청, 주황=이벤트, 빨강=위험·경계, 보라=데이터·승인.
- 사람 승인(비가역 행동)은 항상 `✋`로 표시한다 ([[AI-DEVELOPMENT-RULES]] B-8).
- Obsidian은 Mermaid를 네이티브 렌더한다. 라이트/다크 테마에 자동 대응하므로 색을 하드코딩하지 말고 `classDef`의 투명 배경(`22` 접미사)만 쓴다.
- 발표에 이미지로 넣을 땐 렌더된 다이어그램을 캡처하거나, PPT는 아래 장표 템플릿과 함께 쓴다 → [[개발 발표 장표 구조]].

## 관련 문서

- [[10_지식/08_인프라/_설계_키트/README|설계 키트 README]] · [[10_지식/08_인프라/_설계_키트/아이콘_인덱스|아이콘 인덱스]]
- [[개발 발표 장표 구조]] — 다이어그램을 어느 장표에 배치할지