사용자: 전체 사용자
플랜: 모든 플랜
플랫폼: 브라우저, 데스크톱
Mermaid 앱을 사용하면 코드를 기반으로 한 풍부한 다이어그램을 Miro 보드에 쉽게 생성하고 임베드할 수 있습니다. 이 기능을 통해 간단한 텍스트 기반 문법을 사용해 복잡한 시스템, 워크플로, 데이터 구조를 시각화하여 협업과 이해도를 높일 수 있습니다.
다이어그램 코드를 변경하고 실시간 미리 보기를 업데이트하는 중
Mermaid 앱 설치
Miro 마켓플레이스에서 Mermaid 앱을 설치하거나 Miro 보드 내의 작성 툴바에서 직접 설치할 수 있습니다.
Miro 마켓플레이스에서 설치하려면:
- Miro 마켓플레이스로 이동하거나 Miro 마켓플레이스 또는 Mermaid 앱으로 직접 연결되는 이 링크를 따르세요.
- 설치를 완료하려면 Miro 팀을 선택하세요.
작성 툴바에서 앱을 설치할 수도 있습니다:
- 보드 왼쪽의 작성 툴바에서 툴, 미디어 및 통합(+)을 선택하세요. 툴, 미디어, 통합 패널이 열립니다.
- 도구 탭에서 Mermaid 다이어그램을 검색하고 선택하세요.
- Mermaid Diagrams 앱 패널이 열리고, 앱이 툴바에 추가됩니다.
✏️ 메모: 관리자가 팀 설정에서 앱 설치를 제한한 경우, 비관리자 사용자는 앱을 설치할 수 없습니다.
다이어그램을 만들어 Miro 보드에 추가
설치를 완료하면 Mermaid 앱을 사용해 텍스트 기반 코드를 이용하여 다이어그램을 생성하고 이미지를 보드에 추가할 수 있습니다.
설치 후, 작성 툴바에서 Mermaid 앱을 찾을 수 있습니다. 앱은 기본 샘플 코드로 열립니다. 코드를 수정하여 다이어그램을 빌드하면 오른쪽의 미리보기 영역에서 새로고침되므로 변경사항을 실시간으로 확인할 수 있습니다.
Mermaid 앱에는 여러 샘플 다이어그램이 포함되어 있으며, 앱 패널의 왼쪽 하단 모서리에서 액세스할 수 있습니다. 이 샘플 중 하나를 선택한 다음 필요에 맞게 사용자 지정할 수 있습니다.
코드 편집기 창의 크기를 오른쪽 가장자리를 드래그하여 변경할 수 있습니다.
Mermaid 다이어그램용 코드 편집 패널 크기 조정." >
코드 편집기 창 크기 변경
다이어그램 작성을 마쳤다면 보드에 추가를 클릭하세요. 다이어그램이 이미지로 보드에 추가됩니다.
보드에 다이어그램 추가하기
기존 다이어그램 편집
미로 보드에 이미 있는 Mermaid 다이어그램도 수정할 수 있습니다.
- 보드에서 인어 다이어그램 이미지를 클릭하여 선택하세요.
- 표시되는 컨텍스트 메뉴에서 Mermaid 아이콘을 클릭하거나 작성 툴바에서 찾으세요.
- Mermaid 편집자가 다이어그램의 코드와 함께 열립니다. 코드 편집기에서 변경하세요.
- 다이어그램 업데이트를 클릭합니다.
- 귀하의 Miro 보드로 돌아가며, 보드의 다이어그램이 변경 사항으로 업데이트됩니다.
추가 정보
여기 Miro에서 Mermaid 다이어그램 작업을 위한 추가 자료와 세부 정보가 있습니다.
Mermaid 구문 및 문서
Mermaid 앱은 텍스트로부터 다이어그램을 생성하기 위해 특정 구문을 사용합니다. 지원되는 다이어그램 유형 및 옵션을 포함하여 구문에 대한 자세한 정보는 공식 Mermaid 문서를 참조하세요. Miro의 Mermaid 앱 패널 왼쪽 하단 모서리에서 이 문서 링크에 접속할 수도 있습니다.
다이어그램 공유 및 내보내기
Mermaid 다이어그램이 보드에 추가되면 이미지로 작동합니다. 필요시 보드에서 직접 이 이미지를 다운로드할 수 있습니다. 다른 사람과 협업하려면 다이어그램이 포함된 Miro 보드를 공유할 수 있습니다.