레슨 2 / 8·15분
시퀀스 다이어그램
시퀀스 다이어그램의 개념
시퀀스 다이어그램은 시스템의 구성 요소들이 시간 순서에 따라 어떻게 메시지를 주고받는지를 보여줍니다. API 호출 흐름, 사용자 인터랙션 시나리오, 마이크로서비스 간 통신 등을 문서화하는 데 매우 유용합니다.
mermaid
sequenceDiagram
participant U as 사용자
participant C as 클라이언트
participant S as 서버
participant DB as 데이터베이스
U->>C: 로그인 버튼 클릭
C->>S: POST /api/login
S->>DB: 사용자 조회
DB-->>S: 사용자 정보 반환
S-->>C: JWT 토큰 발급
C-->>U: 대시보드 화면 표시화살표 종류
- •->> : 실선 화살표 (동기 요청)
- •-->> : 점선 화살표 (응답)
- •-) : 비동기 메시지 (열린 화살표)
- •Note right of A : 메모를 추가할 수 있음
반복문과 조건분기
loop, alt/else, opt 같은 제어 블록을 사용하면 반복 동작이나 조건부 흐름을 다이어그램에 표현할 수 있습니다.
mermaid
sequenceDiagram
participant Client as 클라이언트
participant Server as 서버
Client->>Server: 데이터 요청
alt 인증 성공
Server-->>Client: 200 OK + 데이터
else 인증 실패
Server-->>Client: 401 Unauthorized
end
loop 5초마다 갱신
Client->>Server: GET /api/status
Server-->>Client: 현재 상태
end
Note over Client,Server: WebSocket으로 전환 가능activate / deactivate
mermaid
sequenceDiagram
participant A as 프론트엔드
participant B as 백엔드
A->>+B: 요청 시작
Note right of B: 처리 중...
B-->>-A: 응답 완료💡
+와 -를 화살표에 붙이면 activate/deactivate를 간결하게 표현할 수 있습니다. A->>+B 는 B를 활성화하고, B-->>-A 는 B를 비활성화합니다.