mermaid 란? 사용방법은?

 

 

 

Mermaid는 개발할 때 많이 쓰는 다이어그램 도구

---

✔️ Mermaid가 뭐냐

👉 Mermaid
= 텍스트로 다이어그램을 그리는 도구

---

✔️ 한 줄 설명

👉 코드로
👉 순서도 / ERD / 시퀀스 다이어그램 등을 자동 생성

---

✔️ 어디서 쓰냐

• GitHub (README)
• Notion
• Obsidian
• Markdown 문서
• 개발 문서

👉 즉
👉 문서 안에서 그림 대신 코드로 그림 그림

---

✔️ 기본 사용법

1️⃣ 코드 작성

예: 순서도

graph TD
A[시작] --> B[로그인]
B --> C{성공?}
C -->|Yes| D[메인화면]
C -->|No| E[에러]

---

2️⃣ 렌더링

👉 지원되는 곳에 붙이면 자동으로 그림으로 변환됨

---

✔️ 자주 쓰는 종류

1️⃣ 순서도 (Flowchart)

graph LR
A --> B --> C

---

2️⃣ 시퀀스 다이어그램

sequenceDiagram
User->>Server: 요청
Server-->>User: 응답

---

3️⃣ ERD (DB 구조)

erDiagram
USER ||--o{ ORDER : has

---

4️⃣ 간트차트

gantt
title 프로젝트 일정
dateFormat  YYYY-MM-DD
Task1 : 2024-01-01, 3d

---

✔️ 장점

• 그림 툴 필요 없음
• 수정 쉬움 (코드만 바꾸면 끝)
• Git으로 버전 관리 가능

---

✔️ 단점

• 복잡한 디자인은 한계 있음
• 처음엔 문법 익혀야 함

---

✔️ 한 줄 정리

👉 Mermaid = “코드로 다이어그램 그리는 도구”