칸반 보드
Mermaid 칸반 다이어그램은 작업이 워크플로의 여러 단계를 거쳐 흐르는 시각적 표현을 만들 수 있게 해주며, 아래에서는 칸반 다이어그램 문법을 올바르게 사용하는 방법을 설명합니다.
기본
칸반 다이어그램은 kanban 문법으로 시작하고, 그다음 열과 해당 열의 작업을 정의합니다.
복사
임베드
kanban
column1[Column Title]
task1[Task Description]
열 정의
열은 워크플로의 여러 단계(예: "할 일", "진행 중", "완료" 등)를 나타냅니다. 각 열은 고유 식별자와 대괄호로 감싼 제목으로 정의됩니다.
문법:
복사
임베드
columnId[Column Title]
- columnId: 열의 고유 식별자입니다.
- [Column Title]: 열 머리글에 표시되는 제목입니다.
比如 id1[Todo]
열에 작업 추가
작업은 각자의 열에 표시되며 들여쓰기가 있습니다. 각 작업은 고유 식별자와 대괄호로 감싼 설명으로 구성됩니다.
문법:
복사
임베드
taskId[Task Description]
taskId: 작업의 고유 식별자입니다.,[Task Description]: 작업의 설명입니다.
예:
복사
임베드
docs[Create Documentation]
작업에 메타데이터 추가
@{ ... } 문법을 사용하여 각 작업에 추가 메타데이터를 추가할 수 있습니다. 메타데이터에는 assigned, ticket, priority 등의 키-값 쌍이 포함될 수 있으며, 이는 노드 렌더링에 표시됩니다.
지원되는 메타데이터 키
assigned: 해당 작업을 누가 담당하는지 지정합니다.,ticket: 작업을 티켓이나 이슈 번호에 연결합니다.,priority: 작업의 긴급도를 나타냅니다. 허용되는 값: 매우 높음, 높음, 낮음 및 매우 낮음.
복사
임베드
kanban
todo[Todo]
id3[Update Database Function]@{ ticket: MC-2037, assigned: 'knsv', priority: 'High' }
구성 옵션
markdown 파일 시작 부분의 구성 블록을 사용하여 칸반 다이어그램을 사용자 정의할 수 있습니다. 이는 전역 설정(예: 티켓의 기본 URL)을 설정하는 데 유용합니다. 현재 칸반 다이어그램 <code>ticketBaseUrl</code> 이는 전역 설정을 설정하는 데 매우 유용합니다(예: 티켓의 기본 URL). 현재 칸반 차트에는 ticketBaseUrl 이라는 하나의 구성 옵션이 있습니다. 다음 예와 같이 설정할 수 있습니다:
복사
임베드
---
config:
kanban:
ticketBaseUrl: 'https://yourproject.atlassian.net/browse/#TICKET#'
---
칸반 항목에 지정된 티켓 번호가 있으면 차트의 티켓 번호에 해당 티켓을 정의하는 외부 시스템으로 향하는 링크가 포함됩니다. ticketBaseUrl 은 외부 시스템을 가리키는 기본 URL을 설정하고, #TICKET# 은 작업 메타데이터의 티켓 값으로 대체되어 유효한 링크를 생성합니다.
전체 예시
다음은 전체 칸반 다이어그램 코드 예시입니다:
복사
임베드
---
config:
kanban:
ticketBaseUrl: 'https://mermaidchart.atlassian.net/browse/#TICKET#'
---
kanban
Todo
[Create Documentation]
docs[Create Blog about the new diagram]
[In progress]
id6[Create renderer so that it works in all cases. We also add some extra text here for testing purposes. And some more just for the extra flare.]
id9[Ready for deploy]
id8[Design grammar]@{ assigned: 'knsv' }
id10[Ready for test]
id4[Create parsing tests]@{ ticket: MC-2038, assigned: 'K.Sveidqvist', priority: 'High' }
id66[last item]@{ priority: 'Very Low', assigned: 'knsv' }
id11[Done]
id5[define getData]
id2[Title of diagram is more than 100 chars when user duplicates diagram with 100 char]@{ ticket: MC-2036, priority: 'Very High'}
id3[Update DB function]@{ ticket: MC-2037, assigned: knsv, priority: 'High' }
id12[Can't reproduce]
id3[Weird flickering in Firefox]
요약하면, Mermaid 에서 칸반 다이어그램을 만드는 것은 워크플로를 효과적으로 시각화할 수 있는 간단한 과정입니다.
@{ ... } 문법을 사용하여 작업에 선택적 메타데이터를 추가하여 차트를 강화할 수 있으며, 이 문법은 담당자, 티켓 번호 및 우선순위와 같은 추가 맥락 정보를 포함할 수 있게 합니다. 추가 사용자 정의를 위해서는 파일 상단의 구성 블록을 사용하여 ticketBaseUrl 과 같은 전역 옵션을 설정하여 차트에서 직접 티켓을 연결할 수 있습니다.
이러한 지침을 따르고, 고유 식별자, 올바른 들여쓰기를 확인하고, 메타데이터와 구성 옵션을 활용하면 프로젝트의 워크플로를 효과적으로 매핑하는 포괄적이고 맞춤화된 칸반 다이어그램을 만들 수 있습니다.
