NextCloud Hub Draw.io App 상세 안내서

1. Nextcloud Draw.io 통합 개요

Nextcloud Hub 내에서 Draw.io 애플리케이션은 단순한 다이어그램 작성 도구를 넘어, 데이터 주권과 협업 효율성을 극대화하는 전략적 자산으로 기능한다. 이 통합의 진정한 가치를 이해하기 위해서는 Draw.io 자체의 핵심 철학과 Nextcloud 생태계 내에서 발생하는 시너지를 먼저 파악해야 한다.

1.1 Draw.io의 핵심 철학: 보안, 유연성, 개방성

Draw.io는 웹 기반 다이어그램 솔루션 시장에서 독보적인 위치를 차지하며, 그 기반에는 세 가지 핵심 철학이 자리 잡고 있다.

첫째, 보안 우선(Security-First) 원칙이다. 대부분의 클라우드 기반 서비스가 사용자의 데이터를 자사 서버에 저장하는 것과 달리, Draw.io는 사용자의 다이어그램 데이터를 일절 저장하지 않는다.1 편집기는 사용자의 브라우저 내에서 작동하며, 생성된 데이터는 사용자가 직접 선택한 저장소(로컬 장치, Google Drive, OneDrive, 또는 Nextcloud)에만 존재한다. 이러한 아키텍처는 데이터가 제3자의 손을 거치지 않도록 보장하며, 이는 모든 정보를 자체 인프라 내에서 통제하고자 하는 Nextcloud의 근본적인 가치와 완벽하게 일치한다. 사용자는 자신의 데이터가 어디에, 어떻게 저장되는지 명확하게 인지하고 제어할 수 있으며, 이는 민감한 정보를 다루는 기업이나 기관에 매우 중요한 요소이다.

둘째, 플랫폼 유연성이다. Draw.io는 특정 플랫폼에 종속되지 않는 강력한 독립형 편집기로 설계되었다. Atlassian Confluence 및 Jira, Google Workspace, Microsoft Office 365 등 다양한 주요 협업 플랫폼과 원활하게 통합되는 광범위한 생태계를 구축했다.1 Nextcloud 통합 역시 이 거대한 생태계의 한 축을 담당한다. 이는 조직이 여러 플랫폼을 혼용하더라도 일관된 다이어그램 작성 경험을 유지할 수 있음을 의미하며, 특정 벤더에 대한 종속성을 줄여준다.

셋째, 개방적인 접근성이다. Draw.io의 온라인 편집기는 별도의 계정 생성이나 가입 절차 없이 누구나 즉시 사용할 수 있다.1 이러한 특징은 협업의 장벽을 크게 낮춘다. 예를 들어, Nextcloud 사용자가 외부 협력자와 다이어그램을 공유할 경우, 외부 협력자는 Nextcloud 인스턴스에 가입할 필요 없이 공유받은 파일을 웹 브라우저에서 바로 열고 편집할 수 있다.1 이는 신속하고 유연한 협업을 가능하게 하는 핵심적인 장점이다.

1.2 Nextcloud Hub 내에서의 Draw.io: 시너지와 가치

Draw.io가 Nextcloud Hub에 통합되면서, 두 플랫폼의 장점은 단순한 합을 넘어 강력한 시너지를 창출한다. 이 통합은 다이어그램 파일을 단순한 결과물이 아닌, 살아있는 협업의 중심으로 변모시킨다.

가장 큰 시너지는 통합된 워크플로우에서 발생한다. 사용자는 더 이상 별도의 애플리케이션을 실행하고 파일을 수동으로 업로드할 필요가 없다. Nextcloud의 파일 인터페이스에서 직접 ‘+’ 버튼을 눌러 ‘Draw.io 다이어그램’ 또는 ’화이트보드’를 선택하는 것만으로 새로운 다이어그램 작성을 시작할 수 있다.4 생성된 .drawio 파일은 Nextcloud의 파일 시스템 내에 다른 문서나 이미지 파일과 동일하게 저장되고 관리된다.6 이는 파일 관리의 일관성을 유지하고 사용자 경험을 단순화한다.

또한, Draw.io 다이어그램은 Nextcloud의 강력한 협업 및 관리 기능을 그대로 상속받는다. 파일 공유 시스템을 통해 내부 사용자 그룹이나 개별 사용자에게 특정 권한(읽기, 쓰기)을 부여하여 안전하게 공유할 수 있다. 파일에 대한 댓글 기능을 사용하여 다이어그램의 특정 부분에 대한 피드백을 주고받거나 @멘션으로 관련 담당자를 호출하여 비동기적 소통을 원활하게 진행할 수 있다.7 모든 변경 사항은 Nextcloud의 버전 관리 시스템에 기록되어 필요시 이전 버전으로 쉽게 복원할 수 있으며, 활동(Activity) 앱을 통해 누가, 언제 파일을 수정하고 공유했는지 투명하게 추적할 수 있다.7

이 통합 환경은 순서도, 네트워크 인프라, 조직도와 같은 전통적인 다이어그램뿐만 아니라, UML 다이어그램, 개체-관계 모델(ERD), 평면도, 칸반 보드, 공격 트리 등 기술 및 비즈니스 분야의 거의 모든 시각적 문서화 요구를 충족시킨다.1 결과적으로, Nextcloud 내의 Draw.io는 단순한 다이어그램 도구가 아니라, 아이디어를 시각화하고, 시스템을 설계하며, 프로세스를 문서화하고, 그 결과물을 안전하게 관리 및 공유하는 포괄적인 시각적 협업 솔루션으로 자리매김한다.

2. 설치 및 시스템 요구사항

Draw.io 앱을 성공적으로 배포하고 안정적으로 운영하기 위해서는 Nextcloud 서버 환경에 대한 정확한 이해와 체계적인 설치 및 구성 과정이 필수적이다. 이 섹션에서는 시스템 요구사항부터 고급 구성 옵션까지 상세한 절차를 안내한다.

2.1 사전 요구사항: Nextcloud 서버 환경

Draw.io 앱은 Nextcloud 서버 위에서 실행되므로, 앱의 성능과 안정성은 전적으로 기반이 되는 서버 환경에 의존한다. 따라서 앱을 설치하기 전에 서버가 다음 요구사항을 충족하는지 반드시 확인해야 한다.

CPU 아키텍처 및 운영체제: 64비트 CPU와 64비트 운영체제는 안정적인 운영을 위해 필수적이다. 32비트 시스템도 지원은 되나, 1970년 이전 또는 2038년 이후의 날짜를 처리하지 못하는 등의 제약이 있다.9
메모리(RAM): 메모리 요구사항은 사용자 수, 설치된 앱, 파일 활동량에 따라 크게 달라진다. Nextcloud는 프로세스당 최소 128MB의 RAM을 필요로 하며, 안정적인 운영을 위해 프로세스당 최소 512MB RAM을 권장한다.9
데이터베이스: MariaDB 또는 MySQL 사용이 강력히 권장된다. 데이터베이스는 ‘InnoDB’ 스토리지 엔진을 사용해야 하며, 트랜잭션 격리 수준은 ’READ COMMITTED’로 설정되어야 한다.9
웹 서버 및 PHP: Apache 2.4 또는 Nginx와 함께 권장 PHP 버전을 사용하는 것이 좋다. 최신 PHP 버전은 보안 및 성능 면에서 이점을 제공한다.9

다음 표는 일반적인 Nextcloud 서버 환경의 최소 및 권장 사양을 요약한 것이다.

구성 요소	최소 요구사항	권장 사양
운영체제	Ubuntu 22.04 LTS, RHEL 8, Debian 12 등	Ubuntu 24.04 LTS, RHEL 9
데이터베이스	MariaDB 10.6+, MySQL 8.0+, PostgreSQL 13+	MariaDB 10.11+, MySQL 8.0+
웹 서버	Apache 2.4, Nginx	Apache 2.4 (mod_php 또는 php-fpm)
PHP 버전	8.1	8.3+
메모리	프로세스당 128MB RAM	프로세스당 512MB RAM 이상

참고: 위 표는 Nextcloud 최신 버전을 기준으로 하며, 구체적인 버전은 설치된 Nextcloud 버전에 따라 달라질 수 있다.9

2.2 Draw.io 앱 설치

요구사항이 충족되었다면 다음 두 가지 방법 중 하나를 선택하여 Draw.io 앱을 설치할 수 있다.

2.2.1 방법 1: Nextcloud 앱 스토어를 통한 자동 설치

가장 간단하고 권장되는 방법이다.

관리자 계정으로 Nextcloud에 로그인한다.
우측 상단의 프로필 아이콘을 클릭하고 ‘앱’ 메뉴로 이동한다.
좌측 메뉴에서 ‘통합(Integration)’ 또는 ‘도구(Tools)’ 카테고리를 선택하거나, 상단의 검색창에 ’Draw.io’를 입력한다.
검색된 Draw.io 앱에서 ‘다운로드 및 활성화’ 버튼을 클릭하여 설치를 완료한다.

2.2.2 방법 2: 수동 설치

서버가 인터넷에 연결되어 있지 않거나 특정 버전을 설치해야 할 경우 수동으로 설치할 수 있다.

Draw.io Nextcloud 앱의 공식 GitHub 릴리즈 페이지(Releases · jgraph/drawio-nextcloud · GitHub)로 이동한다.
설치하려는 버전의 소스 코드 압축 파일(예: drawio-vX.X.X.tar.gz)을 다운로드한다.
다운로드한 파일의 압축을 해제한다.
압축 해제된 ‘drawio’ 디렉토리를 Nextcloud 서버의 /apps/ 디렉토리로 복사한다.4
Nextcloud의 ‘앱’ 관리 페이지로 이동하여 ‘비활성화된 앱’ 목록에서 Draw.io를 찾아 ‘활성화’ 버튼을 클릭한다.4

2.3 필수 구성: MIME 타입 등록

앱 설치 후, Nextcloud가 .drawio 확장자를 가진 파일을 다이어그램으로 올바르게 인식하도록 MIME 타입을 등록하는 과정이 반드시 필요하다. 이 과정이 누락되면 파일 생성이나 열기 시 문제가 발생할 수 있다.

자동 등록 (권장):

관리자 계정으로 ’설정’으로 이동한다.
좌측 메뉴에서 ‘관리’ 섹션 아래의 ’Draw.io’를 클릭한다.
페이지에 표시된 설정 값 변경 없이 하단의 ‘저장’ 버튼을 한 번 클릭한다.4 이 작업으로 필요한 MIME 타입이 자동으로 등록된다.

수동 등록:

자동 등록이 실패하거나 특정 환경에서 직접 설정해야 할 경우, Nextcloud의 루트 디렉토리 아래 config/ 폴더에 위치한 mimetypemapping.json 파일을 직접 수정할 수 있다. 해당 파일에 다음 내용을 추가한다.11

“drawio”: [“application/x-drawio”]

수동으로 MIME 타입을 추가하면 Nextcloud의 무결성 검사에서 경고가 발생할 수 있다. 이는 예상된 동작이므로 안전하게 무시해도 된다.4

2.4 고급 구성: 자체 호스팅 Draw.io 연동

기본적으로 Nextcloud의 Draw.io 앱은 JGraph Ltd.에서 운영하는 공식 온라인 편집기 서비스(https://embed.diagrams.net)를 iframe 형태로 불러와 사용한다.4 이는 설치가 간편하고 항상 최신 버전의 편집기를 사용할 수 있다는 장점이 있다.

하지만 데이터가 외부 네트워크로 전송되는 것을 원천적으로 차단해야 하는 보안 정책을 가진 조직이나, 인터넷 연결이 없는 폐쇄망(air-gapped) 환경에서는 자체 호스팅(self-hosted) Draw.io 인스턴스를 구축하고 연동해야 한다.

자체 호스팅 Draw.io 배포: Draw.io 개발팀이 공식적으로 제공하는 Docker 이미지(jgraph/docker-drawio)를 사용하여 자체 서버에 Draw.io 인스턴스를 배포한다.12 이는 비교적 간단하게 격리된 다이어그램 편집 환경을 구축하는 방법이다.
Nextcloud 앱 설정 변경:
Nextcloud의 ‘관리 설정 > Draw.io’ 페이지로 이동한다.
‘Draw.io URL’ 필드의 값을 기본값인 https://embed.diagrams.net에서 직접 배포한 Docker 인스턴스의 주소(예: https://drawio.your-domain.com)로 변경한다.
설정을 저장한다.

이러한 자체 호스팅 구성은 데이터 통제권을 극대화하지만, 중요한 기능적 절충점이 존재한다. 실시간 공동 편집 기능은 공식 온라인 서비스에 의존하므로, 자체 호스팅 환경에서는 이 기능이 작동하지 않는다.4 따라서 조직은 완전한 데이터 격리와 실시간 협업 기능 사이에서 요구사항에 맞는 구성을 선택해야 한다.

2.5 버전 호환성 및 업데이트

Nextcloud와 그 앱 생태계는 지속적으로 발전하므로, 버전 호환성을 유지하는 것이 매우 중요하다. Draw.io 앱의 특정 버전은 특정 범위의 Nextcloud 버전에만 호환된다.14 호환되지 않는 버전을 사용하면 앱이 오작동하거나 Nextcloud 전체에 문제를 일으킬 수 있다.15

다음 표는 Draw.io 앱의 주요 버전과 호환되는 Nextcloud 서버 버전을 나타낸다.

Draw.io 앱 버전	호환 Nextcloud 버전
3.1.0	31
3.0.9	28, 29, 30
2.1.4	20, 21, 22, 23, 24, 25, 26, 27
1.0.5	11, 12, 13, 14, 15, 16, 17, 18, 19

참고: 전체 호환성 목록은 Nextcloud 앱 스토어에서 확인해야 한다.6

Nextcloud 서버를 업데이트하기 전에는 항상 사용 중인 주요 앱들이 새로운 버전과 호환되는지 앱 스토어에서 확인하는 것이 모범 사례이다.15 만약 업데이트 후 Draw.io 앱에 문제가 발생했다면, 가장 일반적인 해결책은 앱 관리 페이지에서 Draw.io 앱을 비활성화하거나 삭제한 후, 다시 설치하는 것이다.11

3. Draw.io 편집기 마스터하기: 기본 사용법

Nextcloud에 Draw.io 앱이 성공적으로 설치되었다면, 이제 강력한 편집기의 기능을 활용할 차례이다. 이 섹션에서는 Draw.io 편집기의 인터페이스를 구성하는 핵심 요소들을 살펴보고, 첫 다이어그램을 만드는 과정을 단계별로 안내한다.

3.1 사용자 인터페이스 해부

Draw.io 편집기는 직관적인 레이아웃을 가지고 있으며, 주요 기능은 다섯 가지 영역으로 나뉜다.17

메뉴 바 (Menu Bar): 화면 최상단에 위치하며 파일 관리(새로 만들기, 열기, 저장, 내보내기), 편집(실행 취소, 복사, 붙여넣기), 보기(격자, 페이지 보기), 정렬(그룹화, 순서 변경) 등 모든 기능에 접근할 수 있는 포괄적인 메뉴를 제공한다.17
도구 모음 (Toolbar): 메뉴 바 바로 아래에 위치하며, 확대/축소, 실행 취소/다시 실행, 삭제, 도형 채우기 및 선 색상 변경, 그림자 효과, 커넥터 스타일 변경, 도형 및 테이블 삽입 등 가장 자주 사용하는 기능들을 아이콘 형태로 제공하여 빠른 접근을 가능하게 한다.17
도형 라이브러리 (Shape Libraries): 편집기 좌측에 위치한 패널로, 다이어그램 작성의 핵심 요소이다. ‘일반’, ‘고급’, ‘순서도’, ‘UML’, ‘네트워크’ 등 다양한 카테고리로 분류된 수많은 도형을 제공한다. 패널 하단의 ‘+ 도형 더 보기’ 버튼을 클릭하면 수십 개의 추가 라이브러리(예: AWS, Azure, Cisco 아이콘)를 활성화하거나 불필요한 라이브러리를 비활성화하여 작업 공간을 맞춤 설정할 수 있다.17
드로잉 캔버스 (Drawing Canvas): 편집기 중앙의 가장 넓은 영역으로, 실제 다이어그램이 그려지는 작업 공간이다. Draw.io는 사실상 무한한 크기의 캔버스를 제공하여 다이어그램의 크기에 제약을 받지 않는다. 또한 눈금자, 사용자 정의 가능한 격자(Grid), 정렬을 돕는 가이드라인 등 정교한 작업을 위한 보조 도구들을 갖추고 있다.1
서식 패널 (Format Panel): 편집기 우측에 위치하며, 상황에 따라 내용이 동적으로 변경된다. 캔버스에서 특정 도형, 커넥터 또는 텍스트를 선택하면 해당 요소에 적용할 수 있는 상세한 서식 옵션이 나타난다. ‘스타일’ 탭에서는 색상, 선 두께, 그라데이션, 그림자 등을, ‘텍스트’ 탭에서는 글꼴, 크기, 정렬, 간격 등을, ‘정렬’ 탭에서는 위치, 크기, 회전 각도 등을 정밀하게 제어할 수 있다.17

3.2 첫 다이어그램 만들기: 단계별 가이드

이론적인 설명만으로는 부족하다. 간단한 순서도를 만드는 과정을 통해 Draw.io의 기본 작업 흐름을 익혀보자.19

새 다이어그램 시작: Nextcloud 파일 앱이 있는 폴더에서 상단의 ‘+’ 버튼을 클릭하고, 드롭다운 메뉴에서 ’Draw.io 다이어그램’을 선택한다. 파일 이름을 입력하고 엔터 키를 누르면 빈 캔버스와 함께 편집기가 열린다.4
도형 추가 및 조작:

추가: 좌측 도형 라이브러리에서 ‘일반’ 섹션의 사각형을 클릭하거나 캔버스로 드래그 앤 드롭하여 시작 도형을 추가한다.19
크기 조절: 추가된 도형을 클릭하면 테두리에 파란색 조절점이 나타난다. 이 조절점을 드래그하여 도형의 크기를 변경한다.
회전: 도형의 우측 상단에 있는 회전 핸들(원형 화살표)을 드래그하여 도형을 회전시킨다.
복제: 도형을 선택한 상태에서 Ctrl+D (Windows) 또는 Cmd+D (macOS)를 누르면 동일한 도형이 복제된다.18

도형 연결:

첫 번째 도형 위로 마우스를 가져가면 네 방향으로 파란색 화살표가 나타난다. 이 화살표 중 하나를 클릭하면 연결선과 함께 기본 도형(사각형)이 자동으로 추가된다.
또는, 화살표를 클릭한 채로 드래그하여 캔버스의 다른 도형 위로 가져가면 두 도형이 연결된다. 이때 대상 도형의 테두리가 녹색으로 변하면 마우스를 놓는다. 이것이 ’플로팅 커넥터’로, 도형을 이동해도 연결이 유지된다.19

텍스트 추가 및 서식 지정:

도형을 더블클릭하면 텍스트를 입력할 수 있는 커서가 나타난다. ’시작’이라고 입력해 보자.
텍스트를 입력한 후, 우측 서식 패널의 ‘텍스트’ 탭으로 이동하여 글꼴 크기를 키우거나 굵게(Bold) 설정할 수 있다.19
연결선(커넥터)의 중앙을 더블클릭하여 ‘예’, ’아니오’와 같은 레이블을 추가할 수도 있다.

스타일 적용:

도형을 선택하고 우측 서식 패널의 ‘스타일’ 탭을 연다.
상단의 색상 팔레트에서 원하는 색상 조합을 클릭하여 도형의 채우기 색과 선 색을 한 번에 변경할 수 있다.
또는 ‘채우기’, ‘선’ 옵션을 개별적으로 클릭하여 사용자 정의 색상을 지정할 수도 있다.19

3.3 저장 및 내보내기

Nextcloud 통합 환경에서는 자동 저장 기능이 활성화되어 있어 작업 내용이 주기적으로 자동 저장된다.8 하지만 중요한 변경 후에는 메뉴 바에서 ’파일 > 저장’을 눌러 수동으로 저장하는 것이 안전하다.

작업이 완료된 다이어그램은 다양한 목적으로 활용하기 위해 여러 형식으로 내보낼 수 있다.21

이미지 형식 (PNG, SVG, JPEG): 문서, 프레젠테이션, 웹사이트에 삽입하기에 적합하다. 특히 SVG는 확대해도 품질이 저하되지 않는 벡터 형식이므로 기술 다이어그램에 이상적이다.
문서 형식 (PDF): 인쇄하거나 공식적인 문서로 공유할 때 유용하다.
기타 형식 (HTML, XML): 웹에 다이어그램을 내장하거나 다른 도구와 데이터를 교환할 때 사용된다.

가장 주목할 만한 기능은 PNG, SVG, PDF 형식으로 내보낼 때 ‘다이어그램 사본 포함(Include a copy of my diagram)’ 옵션을 활성화하는 것이다.21 이 옵션을 선택하면 생성된 이미지나 PDF 파일 내에 원본 다이어그램 데이터가 함께 저장된다. 따라서 이 파일을 받은 다른 사용자는 파일을 Draw.io 편집기로 드래그 앤 드롭하는 것만으로 다이어그램을 다시 불러와 편집을 계속할 수 있다. 이는 단순한 이미지 공유를 넘어, 편집 가능한 원본을 함께 전달하는 매우 효율적인 협업 방식이다.

다음 표는 주요 내보내기 형식의 특징과 용도를 비교한 것이다.

형식	확장성	편집 가능성 (데이터 포함 시)	파일 크기	주요 용도
PNG	래스터 (확대 시 품질 저하)	예	보통	웹 페이지, 이메일, 일반 문서
SVG	벡터 (무손실 확대 가능)	예	작음	기술 문서, 고해상도 인쇄, 웹
PDF	벡터 기반	예	가변적	공식 문서 배포, 인쇄, 보관
.drawio	해당 없음	예 (기본 형식)	가변적	Draw.io에서의 저장 및 편집

4. 전문가 수준의 다이어그램 작성을 위한 고급 기능

Draw.io는 단순한 도형 그리기를 넘어, 전문가 수준의 복잡하고 정교한 다이어그램을 효율적으로 작성할 수 있는 다양한 고급 기능을 제공한다. 템플릿 활용부터 데이터 기반 자동 생성에 이르기까지, 이러한 기능들은 생산성을 극대화하고 시각적 문서의 품질을 한 차원 높여준다.

4.1 템플릿 활용

처음부터 빈 캔버스에서 시작하는 대신, 잘 구성된 템플릿을 활용하면 작업 시간을 획기적으로 단축할 수 있다.

내장 템플릿: Draw.io는 소프트웨어 개발(UML, C4 모델), 비즈니스(BPMN, SWOT 분석), 네트워크(Cisco, AWS), 디자인(와이어프레임, 평면도) 등 다양한 산업 및 목적에 맞는 수백 개의 전문적인 템플릿을 기본으로 제공한다.8 새 다이어그램을 생성할 때 템플릿 관리자에서 원하는 템플릿을 선택하기만 하면 즉시 작업을 시작할 수 있다.
AI 기반 스마트 템플릿: 최근 도입된 ‘스마트 템플릿’ 기능은 다이어그램 작성의 패러다임을 바꾼다. 사용자가 자연어(예: “사용자 로그인 프로세스에 대한 순서도 생성”)로 원하는 다이어그램을 설명하면, AI가 이를 해석하여 적절한 구조와 요소를 갖춘 다이어그램의 초안을 자동으로 생성해준다.1 이는 브레인스토밍 초기 단계나 다이어그램 구조가 명확하지 않을 때 특히 유용하다.
사용자 지정 템플릿: 팀이나 조직 내에서 반복적으로 사용되는 특정 형식의 다이어그램(예: 버그 리포트 순서도, 신규 입사자 온보딩 프로세스)이 있다면, 이를 사용자 지정 템플릿으로 저장하여 일관성을 유지하고 생산성을 높일 수 있다. 잘 만들어진 다이어그램을 특정 위치에 저장하고 설정 파일을 통해 템플릿 라이브러리에 등록하면, 팀원 누구나 해당 템플릿을 쉽게 불러와 사용할 수 있다.26

4.2 도형 라이브러리 관리

Draw.io의 방대한 도형 라이브러리는 그 자체로 강력한 자산이지만, 이를 효과적으로 관리하고 확장할 때 진정한 잠재력이 발휘된다.

추가 라이브러리 활성화: 기본적으로 표시되는 라이브러리 외에도 수많은 전문 라이브러리가 내장되어 있다. 좌측 패널 하단의 ’+ 도형 더 보기’를 클릭하면 클라우드 서비스(AWS, Azure, GCP), 네트워킹 장비(Cisco, Arista), UI 목업 등 특정 분야에 특화된 라이브러리를 찾아 활성화할 수 있다.28
사용자 지정 라이브러리: 자주 사용하는 도형, 회사 로고, 특정 아이콘, 심지어는 다이어그램의 일부 조각까지 ’사용자 지정 라이브러리’로 만들어 관리할 수 있다.1 ’파일 > 새 라이브러리’를 선택하여 새 라이브러리를 생성하고, 캔버스에서 원하는 요소를 라이브러리 패널로 드래그 앤 드롭하기만 하면 된다. 이렇게 만들어진 라이브러리 파일(

.xml)은 팀원들과 공유하여 모두가 동일한 시각적 요소를 사용하도록 표준화할 수 있다.30

외부 라이브러리 가져오기: GitHub 등 웹에 공개된 수많은 고품질 아이콘 및 도형 라이브러리를 URL을 통해 직접 가져올 수 있다.30 ‘파일 > 라이브러리 열기 > URL’ 메뉴에 라이브러리

.xml 파일의 주소를 입력하면 해당 라이브러리가 즉시 좌측 패널에 추가되어 사용할 수 있게 된다.31

4.3 레이어를 이용한 복잡한 다이어그램 관리

복잡한 다이어그램을 작성할 때, 모든 요소를 하나의 평면에 두는 것은 비효율적이다. 레이어는 포토샵과 같은 그래픽 편집 도구처럼, 다이어그램의 구성 요소를 논리적인 층으로 분리하여 체계적으로 관리할 수 있게 해준다.

레이어 패널: Ctrl+Shift+L 단축키 또는 ‘보기 > 레이어’ 메뉴를 통해 레이어 패널을 열 수 있다.34 기본적으로 모든 다이어그램은 ’Background’라는 단일 레이어를 가진다.
레이어 관리: 패널 하단의 ‘+’ 버튼으로 새 레이어를 추가하고, 레이어 이름을 더블클릭하여 변경할 수 있다. 레이어 순서를 드래그하여 위아래로 조정함으로써 객체의 표시 순서(Z-index)를 제어할 수 있다. 눈 아이콘을 클릭하여 특정 레이어를 숨기거나, 자물쇠 아이콘으로 레이어를 잠가 실수로 편집하는 것을 방지할 수 있다.31
레이어 활용: 예를 들어, 건물 평면도를 그릴 때, 1층 구조, 2층 구조, 전기 배선, 가구 배치를 각각 별도의 레이어에 그릴 수 있다. 이를 통해 특정 정보(예: 전기 배선)만 보거나, 여러 정보를 겹쳐서 볼 수 있어 다이어그램의 가독성과 활용도가 크게 향상된다. 선택한 도형을 특정 레이어로 이동시키는 기능은 기존 다이어그램을 재구성할 때 매우 유용하다.31 더 나아가, 레이어의 보이기/숨기기 기능을 버튼과 연결하여 사용자가 직접 정보를 제어하는 대화형 다이어그램을 제작하는 것도 가능하다.38

4.4 데이터 기반 다이어그램 자동 생성

수동으로 다이어그램을 그리는 방식은 시간이 많이 걸리고 데이터가 변경될 때마다 수정하기 어렵다. Draw.io는 텍스트나 데이터 소스로부터 다이어그램을 자동으로 생성하는 ‘Diagrams as Code’ 패러다임을 지원하여 이러한 문제를 해결한다.

CSV에서 생성: 특정 형식으로 구성된 CSV(쉼표로 구분된 값) 파일과 스타일 정보를 입력하면, 조직도, 순서도, 네트워크 토폴로지 등을 자동으로 생성할 수 있다.1 각 행은 다이어그램의 노드(도형)를 나타내고, 특정 열은 노드 간의 연결 관계를 정의한다. 이 방식은 스프레드시트나 데이터베이스에 이미 존재하는 데이터를 시각화하는 데 매우 강력하다.40
Mermaid 구문에서 생성: Mermaid는 마크다운과 유사한 간단한 텍스트 구문을 사용하여 다이어그램을 정의하는 도구이다. Draw.io는 이 Mermaid 구문을 직접 지원한다. ‘정렬 > 삽입 > 고급 > Mermaid’ 메뉴에 텍스트 코드를 붙여넣으면 즉시 해당 다이어그램이 캔버스에 그려진다.1 개발 문서에 다이어그램을 코드로 포함하여 버전 관리하기에 이상적이다.
SQL에서 생성: 데이터베이스 설계를 시각화할 때, CREATE TABLE과 같은 SQL DDL(데이터 정의 언어) 구문을 ‘정렬 > 삽입 > 고급 > SQL’ 메뉴에 붙여넣으면 해당 테이블 구조를 바탕으로 ERD(개체-관계 다이어그램)가 자동으로 생성된다.1 이는 데이터베이스 스키마를 문서화하는 작업을 극적으로 간소화한다.

이러한 자동 생성 기능들은 다이어그램을 수동 작업의 결과물이 아닌, 신뢰할 수 있는 데이터 소스(Source of Truth)의 시각적 표현으로 전환시킨다. 데이터가 변경되면, 해당 소스를 수정하고 다이어그램을 다시 생성하기만 하면 되므로, 문서의 정확성과 최신성을 유지하는 데 드는 노력이 크게 줄어든다.

4.5 수식 조판: LaTeX 지원

기술 문서나 학술 자료에 포함되는 다이어그램에는 정확한 수학적 표기가 필수적이다. Draw.io는 전문적인 수식 조판 시스템인 LaTeX를 지원하여 이러한 요구를 충족시킨다.

MathJax 활성화: ‘기타 기능(Extras) > 수식 조판(Mathematical Typesetting)’ 메뉴를 활성화하면, Draw.io가 텍스트 내의 LaTeX 코드를 인식하여 MathJax 라이브러리를 통해 아름다운 수식으로 렌더링한다.45
수식 입력 구문:
인라인(Inline) 수식: 문단 흐름 속에 수식을 자연스럽게 포함시키려면, LaTeX 코드를 $와 $로 감싼다. 예를 들어, ’피타고라스의 정리는 $a^2 + b^2 = c^2$ 이다.’와 같이 입력하면 된다.46
블록(Block) 수식: 수식을 별도의 줄에 중앙 정렬하여 강조하려면, LaTeX 코드를 $$와 $$로 감싼다.46 예를 들어, 맥스웰 방정식 중 하나를 다음과 같이 입력할 수 있다:

\nabla \cdot \mathbf{E} = \frac{\rho}{\varepsilon_0}

$\nabla \cdot \mathbf{E} = \frac{\rho}{\varepsilon_0}$

다음 표는 다이어그램 작성 시 자주 사용되는 LaTeX 수식 구문의 예시이다.

설명	LaTeX 구문	렌더링 예시
분수	`\frac{a}{b}`	$\frac{a}{b}$
위/아래 첨자	`X_{i}^{n}`	$X_{i}^{n}$
제곱근	`\sqrt[n]{x}`	$\sqrt[n]{x}$
합산 (시그마)	`\sum_{k=1}^{n} k`	$\sum_{k=1}^{n} k$
적분	`\int_{a}^{b} f(x)dx`	$\int_{a}^{b} f(x)dx$
행렬	`\begin{pmatrix} a & b \\ c & d \end{pmatrix}`	$\begin{pmatrix} a & b \\ c & d \end{pmatrix}$
그리스 문자	`\alpha, \beta, \gamma`	$\alpha, \beta, \gamma$
관계 연산자	`x \leq y \neq z`	$x \leq y \neq z$
테이블 내 수식	`a_{11}x_1 + a_{12}x_2 = b_1`	$\vert a_{11}x_1 + a_{12}x_2 \vert = \vert b_1 \vert$

이 기능을 통해 연구원, 엔지니어, 학생들은 별도의 수식 편집기 없이도 Draw.io 내에서 직접 전문적인 수준의 수식이 포함된 다이어그램을 작성할 수 있다.

V. 협업 기능 및 Nextcloud 생태계 연동

Nextcloud 환경에서 Draw.io 다이어그램을 활용한 협업은 두 가지 뚜렷한 계층에서 이루어진다. 하나는 Draw.io 편집기 자체에 내장된 실시간 동기 편집 기능이며, 다른 하나는 Nextcloud 플랫폼이 제공하는 비동기 협업 기능이다. 이 두 가지 방식의 특징과 제약 사항을 명확히 이해하는 것은 효과적인 팀 워크플로우를 구축하는 데 매우 중요하다.

5.1. 실시간 공동 편집

Draw.io는 여러 사용자가 동시에 하나의 다이어그램을 편집할 수 있는 실시간 공동 편집 기능을 제공한다.

작동 방식: 이 기능이 활성화되면, 각 사용자의 마우스 커서가 고유한 색상으로 표시되어 다른 참여자의 작업 위치를 직관적으로 파악할 수 있다.1 한 사용자가 도형을 선택하면 해당 도형의 테두리가 그 사용자의 커서 색상으로 강조 표시되어, 누가 무엇을 편집하고 있는지 명확하게 보여준다.48 이는 원격으로 진행되는 브레인스토밍이나 디자인 검토 회의에서 매우 효과적이다.
핵심 제약 사항: 이 실시간 공동 편집 기능은 JGraph Ltd.가 운영하는 공식 온라인 서비스(https://embed.diagrams.net)에 전적으로 의존한다.3 따라서 Nextcloud Draw.io 앱이 기본 설정으로 운영될 때만 이 기능을 사용할 수 있다. 만약 보안상의 이유로 자체 호스팅 Docker 인스턴스를 사용하도록 설정을 변경한 경우, 이 실시간 협업 기능은 비활성화된다.13 또한, 이 기능이 원활하게 작동하기 위해서는 모든 참여자의 Draw.io 설정에서 ‘자동 저장(Autosave)’ 옵션이 활성화되어 있어야 한다.4

결론적으로, 실시간 협업은 외부 서비스와의 통신이 허용되는 환경에서만 가능한 기능이며, 완전한 데이터 격리를 추구하는 자체 호스팅 환경과는 양립할 수 없는 절충 관계에 있다.

5.2. Nextcloud를 통한 비동기 협업

실시간 편집 기능의 제약과 무관하게, 모든 Nextcloud 환경에서는 플랫폼 자체의 강력한 비동기 협업 기능을 Draw.io 다이어그램 파일에 활용할 수 있다. .drawio 파일은 Nextcloud 내에서 다른 모든 파일(문서, 이미지 등)과 동일하게 취급되기 때문이다.

파일 공유 및 접근 제어: Nextcloud의 정교한 파일 공유 시스템을 사용하여 다이어그램 파일을 내부 사용자, 그룹, 또는 외부 게스트에게 공유 링크를 통해 전달할 수 있다. 공유 시 읽기 전용, 편집 허용, 암호 설정, 만료일 지정 등 세밀한 접근 제어가 가능하다.6
댓글 및 토론: 다이어그램 파일의 세부 정보 창에서 댓글을 통해 비동기적인 논의를 진행할 수 있다. 특정 변경 사항에 대한 피드백을 요청하거나, 아이디어를 제안하고, @멘션 기능을 사용하여 특정 팀원의 주의를 환기시킬 수 있다.7 이 모든 대화는 파일과 함께 기록으로 남아 컨텍스트를 보존한다.
버전 관리 및 활동 추적: 사용자가 다이어그램을 수정하고 저장할 때마다 Nextcloud는 자동으로 새 버전을 생성한다. 이를 통해 변경 이력을 쉽게 추적하고, 필요한 경우 몇 번의 클릭만으로 이전 상태로 다이어그램을 복원할 수 있다. ‘활동’ 피드에서는 파일에 대한 모든 이벤트(생성, 수정, 삭제, 공유, 댓글)를 시간 순서대로 확인할 수 있어 프로젝트 진행 상황을 투명하게 파악할 수 있다.7

이처럼 Nextcloud의 비동기 협업 기능은 다이어그램 파일 자체를 중심으로 이루어진다. 실시간 편집이 동기적인 아이디어 발산과 빠른 수정을 위한 것이라면, 비동기 협업은 시간과 장소에 구애받지 않고 체계적인 검토, 피드백, 승인 절차를 진행하는 데 적합하다. 효과적인 팀은 이 두 가지 협업 계층의 차이를 이해하고, 작업의 성격에 따라 적절한 도구를 조합하여 사용한다. 예를 들어, 초기 기획 단계에서는 화상 회의와 함께 실시간 편집을 사용하고, 이후 검토 단계에서는 Nextcloud 댓글 기능을 통해 상세한 피드백을 주고받는 워크플로우를 구축할 수 있다.

VI. 문제 해결 및 모범 사례

Draw.io 앱을 운영하다 보면 예기치 않은 문제에 직면할 수 있다. 이 섹션에서는 자주 발생하는 문제들의 원인과 해결 방안을 제시하고, 앱의 활용도를 극대화하기 위한 모범 사례를 제안한다.

6.1. 자주 발생하는 문제 및 해결 방안

문제: Nextcloud 서버 업데이트 후 앱이 작동하지 않음
원인: Draw.io 앱이 새로 업데이트된 Nextcloud 버전과 호환되지 않을 수 있다. 이는 가장 빈번하게 발생하는 문제 중 하나이다.15
해결 방안:

예방: Nextcloud 서버를 업데이트하기 전에, 반드시 앱 스토어에서 Draw.io 앱이 해당 버전과 호환되는지 확인한다.15
조치: 문제가 발생했다면, ‘앱’ 관리 페이지에서 Draw.io 앱을 ’비활성화’했다가 다시 ’활성화’한다. 문제가 지속되면 앱을 완전히 ’제거’한 후 앱 스토어에서 최신 호환 버전으로 재설치한다.11

문제: 오프라인 환경에서 다이어그램 편집이 불가능함
원인: 기본 설정에서 Draw.io 앱은 온라인 편집기(embed.diagrams.net)를 로드하므로 인터넷 연결이 필요하다. ’오프라인’으로 설정하더라도 일부 JavaScript 파일을 외부에서 로드하려는 시도가 있을 수 있다.12
해결 방안: 완전한 오프라인(폐쇄망) 환경을 위해서는 반드시 자체 호스팅 Docker 인스턴스(jgraph/docker-drawio)를 구축하고, Nextcloud 앱 설정에서 Draw.io URL을 해당 인스턴스 주소로 지정해야 한다.12
문제: Draw.io가 모든 XML 파일의 기본 뷰어로 지정됨
원인: 초기 버전의 앱에서 .xml 파일의 MIME 타입 처리 방식으로 인해, 다른 용도의 XML 파일을 열 때도 Draw.io 편집기가 실행되는 문제가 보고된 바 있다.6
해결 방안: 이 문제는 앱의 최신 버전에서 개선되었을 가능성이 높다. 문제가 지속된다면, Nextcloud의 MIME 타입 설정을 확인하거나 앱 개발자에게 이슈를 보고하는 것을 고려해야 한다.
문제: PDF로 내보내기 시 품질이 낮거나 불필요한 정보가 포함됨
원인: 브라우저의 기본 ‘인쇄’ 기능을 사용하여 ’PDF로 인쇄’를 선택하면, 웹 페이지의 주소 표시줄이나 바닥글과 같은 불필요한 요소가 함께 인쇄될 수 있다.6
해결 방안: 항상 Draw.io 메뉴의 파일 > 내보내기 > PDF 기능을 사용해야 한다. 이 기능을 사용하면 다이어그램에 최적화된 고품질의 PDF 파일을 생성할 수 있으며, 편집 가능한 데이터 포함 여부 등 다양한 옵션을 제어할 수 있다.21
문제: LaTeX 수식이 제대로 렌더링되지 않음
원인: 다른 곳에서 텍스트를 복사하여 붙여넣을 때, 눈에 보이지 않는 HTML 서식 태그(예: <span>, <div>)가 함께 포함되어 MathJax가 수식 코드를 올바르게 파싱하지 못하는 경우가 많다.46
해결 방안: 수식이 포함된 텍스트 상자를 선택하고, 툴바의 </> 아이콘을 클릭하여 HTML 소스 코드를 확인한다. LaTeX 코드 주변에 불필요한 태그가 있다면 모두 제거하고 다시 시도한다.46

6.2. 모범 사례

데이터 백업 및 복원 계획: 다이어그램은 중요한 지적 자산이다. Nextcloud 서버에 대한 정기적인 전체 백업 정책을 수립하고, 재해 발생 시 이를 복원하는 절차를 마련해야 한다. Draw.io 파일도 이 백업 정책에 자연스럽게 포함된다.15
보안 강화: 민감한 정보(예: 네트워크 아키텍처, 개인 정보 흐름)를 담고 있는 다이어그램의 경우, Nextcloud의 보안 기능을 적극적으로 활용해야 한다.
파일 접근 제어(File Access Control): 특정 사용자 그룹이나 IP 주소 대역에서만 민감한 다이어그램에 접근할 수 있도록 규칙을 설정할 수 있다.7
종단 간 암호화(E2EE): 최고 수준의 보안이 필요한 경우, 특정 폴더에 종단 간 암호화를 활성화하여 서버 관리자조차 파일 내용을 볼 수 없도록 보호할 수 있다.7
성능 최적화:
페이지 분할: 하나의 다이어그램이 지나치게 복잡하고 커지면 편집기 성능이 저하될 수 있다. 관련된 부분을 논리적으로 묶어 여러 페이지로 분할하여 관리하면 성능을 유지하는 데 도움이 된다.
라이브러리 최소화: 현재 작업에 필요하지 않은 도형 라이브러리는 비활성화하여 편집기 로딩 시간을 단축하고 인터페이스를 깔끔하게 유지한다.
팀 협업 워크플로우 정립:
템플릿 및 라이브러리 표준화: 팀에서 공통으로 사용하는 다이어그램 형식이나 아이콘이 있다면, 이를 사용자 지정 템플릿과 라이브러리로 만들어 공유한다. 이는 다이어그램의 일관성을 보장하고, 팀원들이 불필요한 작업에 시간을 낭비하지 않도록 돕는다.1
목적에 맞는 협업 방식 선택: 빠른 브레인스토밍이나 페어 프로그래밍과 같은 동기적 작업에는 실시간 공동 편집을, 공식적인 검토나 피드백 수집과 같은 비동기적 작업에는 Nextcloud의 댓글 및 버전 관리 기능을 사용하는 등 명확한 가이드라인을 수립한다.

이러한 문제 해결 방안과 모범 사례를 숙지하고 적용함으로써, 관리자와 사용자는 Nextcloud Hub 내에서 Draw.io 앱을 더욱 안정적이고 효율적으로 활용하여 조직의 시각적 커뮤니케이션과 문서화 역량을 강화할 수 있다.

참고 자료

Features of draw.io, 9월 7, 2025에 액세스, https://www.drawio.com/features
The ecosystem of draw.io integrations, 9월 7, 2025에 액세스, https://drawio-app.com/blog/integrations-ecosystem/
draw.io Integrations, 9월 7, 2025에 액세스, https://www.drawio.com/integrations
jgraph/drawio-nextcloud: Fork from 2022 nextcloud repo - GitHub, 9월 7, 2025에 액세스, https://github.com/jgraph/drawio-nextcloud
Integration with Nextcloud - Feature Suggestions - dbdiagram Community, 9월 7, 2025에 액세스, https://community.dbdiagram.io/t/integration-with-nextcloud/423
Draw.io - Nextcloud App Store, 9월 7, 2025에 액세스, https://apps.nextcloud.com/apps/drawio
Nextcloud features that put you in control, 9월 7, 2025에 액세스, https://nextcloud.com/features/
10 reasons why you should use draw.io, 9월 7, 2025에 액세스, https://drawio-app.com/blog/10-reasons-why-you-should-use-draw-io/
System requirements — Nextcloud latest Administration Manual latest documentation, 9월 7, 2025에 액세스, https://docs.nextcloud.com/server/latest/admin_manual/installation/system_requirements.html
System requirements — Nextcloud latest Administration Manual latest documentation, 9월 7, 2025에 액세스, https://docs.nextcloud.com/server/22/admin_manual/installation/system_requirements.html
pawelrojek/nextcloud-drawio: Draw.io intergration app - GitHub, 9월 7, 2025에 액세스, https://github.com/pawelrojek/nextcloud-drawio
Draw.io - really offline mode? - ℹ️ Support - Nextcloud community, 9월 7, 2025에 액세스, https://help.nextcloud.com/t/draw-io-really-offline-mode/178106
Collaborative Editing · Issue #14 · pawelrojek/nextcloud-drawio - GitHub, 9월 7, 2025에 액세스, https://github.com/pawelrojek/nextcloud-drawio/issues/14
Releases - Draw.io - Nextcloud App Store, 9월 7, 2025에 액세스, https://apps.nextcloud.com/apps/drawio/releases?platform=29
Draw.io doesn’t work anymore - ℹ️ Support - Nextcloud community, 9월 7, 2025에 액세스, https://help.nextcloud.com/t/draw-io-doesnt-work-anymore/87925
Draw.io doesnt work after update - ℹ️ Support - Nextcloud community, 9월 7, 2025에 액세스, https://help.nextcloud.com/t/draw-io-doesnt-work-after-update/219761
Use the draw.io editor, 9월 7, 2025에 액세스, https://www.drawio.com/doc/getting-started-editor
User Guide For Draw.io - Medium, 9월 7, 2025에 액세스, https://medium.com/@sajanahewapathirana/user-guide-for-draw-io-7e6f4afa41f8
Draw a basic flow chart in draw.io, 9월 7, 2025에 액세스, https://www.drawio.com/doc/getting-started-basic-flow-chart
Create a new diagram using draw.io, 9월 7, 2025에 액세스, https://www.drawio.com/doc/faq/new-diagram
Export a diagram to various file formats - draw.io, 9월 7, 2025에 액세스, https://www.drawio.com/doc/faq/export-diagram
Save a diagram in various formats - draw.io, 9월 7, 2025에 액세스, https://www.drawio.com/doc/faq/save-file-formats
Example draw.io diagrams and templates, 9월 7, 2025에 액세스, https://www.drawio.com/example-diagrams
Examples - draw.io, 9월 7, 2025에 액세스, https://drawio-app.com/examples/
Learn how to use diagram templates in draw.io, 9월 7, 2025에 액세스, https://www.drawio.com/blog/templates
Blog - Create and share custom template libraries with draw.io, 9월 7, 2025에 액세스, https://www.drawio.com/blog/custom-template-libraries
Blog - Configure the draw.io template library to use custom template diagrams, 9월 7, 2025에 액세스, https://www.drawio.com/blog/configure-template-library
Explore the libraries in draw.io for Confluence, 9월 7, 2025에 액세스, https://drawio-app.com/blog/explore-libraries-in-drawio-for-confluence/
draw.io Training – Exercise 9: Create your own custom library, 9월 7, 2025에 액세스, https://drawio-app.com/blog/draw-io-training-exercise-9-create-your-own-custom-library/
Use a custom shape library from the web - draw.io, 9월 7, 2025에 액세스, https://www.drawio.com/blog/public-custom-libraries
jgraph/drawio-libs: Libraries for draw.io - GitHub, 9월 7, 2025에 액세스, https://github.com/jgraph/drawio-libs
diagrams.net Libraries | drawio-libs - GitHub Pages, 9월 7, 2025에 액세스, http://jgraph.github.io/drawio-libs/
activivan/drawio-icons: Icon libraries for diagrams.net (formerly draw.io) with support for color change - GitHub, 9월 7, 2025에 액세스, https://github.com/activivan/drawio-icons
Add and remove layers in a diagram - draw.io, 9월 7, 2025에 액세스, https://www.drawio.com/doc/faq/layers-add-remove
Work with layers in draw.io, 9월 7, 2025에 액세스, https://www.drawio.com/doc/layers
Interactive Tutorials - draw.io, 9월 7, 2025에 액세스, https://drawio-app.com/tutorials/interactive-tutorials/
draw.io Training – Exercise 7: Create a diagram with layers and images, 9월 7, 2025에 액세스, https://drawio-app.com/blog/draw-io-training-exercise-7-create-a-diagram-with-layers-and-images/
Using Layers, an advanced draw.io feature - YouTube, 9월 7, 2025에 액세스, https://www.youtube.com/watch?v=zcHiDomZ9sw
Create an interactive diagram and toggle layers with custom links - draw.io, 9월 7, 2025에 액세스, https://www.drawio.com/blog/interactive-diagram-layers
Examples: Import from CSV to draw.io diagrams - draw.io, 9월 7, 2025에 액세스, https://drawio-app.com/blog/import-from-csv-to-drawio/
Insert CSV data and formatting information to generate a diagram - draw.io, 9월 7, 2025에 액세스, https://www.drawio.com/doc/faq/insert-from-csv
Blog - Insert a diagram from specially formatted CSV data - draw.io, 9월 7, 2025에 액세스, https://www.drawio.com/blog/insert-from-csv
Importing diagrams and libraries into draw.io, 9월 7, 2025에 액세스, https://www.drawio.com/blog/import
Is there currently any way to draw Entity Relation Diagrams when importing CSV? Can’t see any mention of it, I might just be dumb though - Google Groups, 9월 7, 2025에 액세스, https://groups.google.com/g/drawio/c/n4lj0PX9wYk
www.drawio.com, 9월 7, 2025에 액세스, https://www.drawio.com/doc/faq/math-typesetting#:~:text=Select%20Extras%20%3E%20Mathematical%20Typesetting%20from,the%20equation’s%20LaTeX%20or%20AsciiMath.
Use mathematical typesetting in diagrams - draw.io, 9월 7, 2025에 액세스, https://www.drawio.com/doc/faq/math-typesetting
Blog - Maths equations in diagrams - draw.io, 9월 7, 2025에 액세스, https://www.drawio.com/blog/maths-in-diagrams
Blog - Collaborate in real time using draw.io, 9월 7, 2025에 액세스, https://www.drawio.com/blog/real-time-collaboration-diagrams