SAP BTP 아키텍처 장표 쉽게 만들기- Draw.io 다이어그램

오늘은 SAP BTP 아키텍처 장표 만들 때 유용하게 사용할 수 있는 다이어그램, 아이콘 툴을 소개해보고자 합니다.

SAP BTP 아키텍처를 표현하는 장표를 그릴 때 기본 PPT의 도형으로는 표현이 쉽지 않습니다.

최근에는 클라우드가 대세이고, 각 프로바이더마다 서로 다른 아이덴티티의 아이콘이나 표현 방식을 갖고 있기 때문에 각각을 기본 파워포인트 도형으로 표현하는데 무리가 있습니다.

물론 각 프로바이더들은 PPT용으로도 활용할 수 있는 아이콘 에셋 패키지([예시: AWS(AWS 아키텍처 아이콘 (amazon.com))를 배포 하고 있긴 하나, 간단히 클라우드 아키텍처를 표현하고자 할 때에는 Draw.io 서비스를 활용하면 편리합니다.

참고로, Figma를 통한 SAP Fiori 앱 디자인하는 방법은 아래의 포스팅에서 참고할 수 있습니다.

SAP Fiori 디자인 Figma 툴로 SAPUI5 화면 설계하는법

Draw.io(현재는 diagrams.net) 서비스란

Draw.io 은 무료 온라인 기반의 다이어그램 도구인데요, 사용자가 Flow, 프로세스 다이어그램, UML 다이어그램, ER 다이어그램 등 다양한 유형의 다이어그램을 쉽게 생성하고 공유할 수 있는 서비스 입니다.

Draw.io는 또한 Google 드라이브, OneDrive, Dropbox와 같은 클라우드 저장 서비스와 통합되어 있어 파일을 저장하고 관리하기가 매우 편리하며, 윈도우 설치 버전을 제공하고 있고 로컬 PC에서도 빠르게 이용할 수 있습니다.

가장 좋은 점은 회사에서 Commercial Use 로 사용 가능하다는 점이며, Apache License 오픈 소스 라이센스가 적용 됩니다.

라이센스는 아래의 링크에서 확인 가능합니다.

https://www.drawio.com/doc/faq/usage-terms

https://gytni.com/new_gytni/qna.php?document_srl=25163 mode=contact mode2=view mode3=chk

하지만 해당 작업물을 구글 드라이브 혹은 One Drive 등에 올리는 경우, 소속 회사 정책에 따라 사용 여부를 결정하시면 됩니다.

물론 로컬 PC 인스톨 버전이 있기 때문에 로컬 디스크에서도 작업 및 저장이 가능합니다.

Draw.io 설치 방법

공식 홈페이지를 통해서 다운로드 받은 후 사용하면 됩니다.

공식 홈페이지 : https://app.diagrams.net/

draw io 프로그램 설치 방법

윈도우 인스톨 버전, 포터블 버전 등이 있으며 본인이 원하는 방법으로 설치하면 됩니다.

draw io는 인스톨 버전 및 포터블 버전이 있음

SAP BTP 아키텍처용 다이어그램 라이브러리 설치하기

프로그램 설치가 완료되면 Draw.io 윈도우 프로그램을 실행 한 후 새로운 다이어그램 만들기를 선택합니다.

빈 새 다이어그램 템플릿을 선택한 후 /만들기/ 버튼을 클릭합니다.

(※ 아무거나 선택해도 크게 무의미한 작업으로, 아무튼 작성 화면으로 넘어가기 위한 단계이다. )

새로운 다이어그램 만들기 선택

아래의 주소를 그냥 브라우저에 입력한 후,

우측 상단 다운로드 버튼을 누르면 zip 라이브러리 파일이 다운로드 되는데, 받은 후 일단 압축을 Extract 해놓으시면 됩니다.

다운로드 zip 링크 버튼 클릭

이제 Draw.io 메뉴에서 /라이브러리 열기/ 선택에서 각각의 xml 파일을 임포트하게 되면

메뉴에서 라이브러리 열기 선택

다음과 같이 사용 가능한 상태 좌측 패널에 SAP BTP 서비스 아이콘이 보이게 되고, 가져다 사용하면 됩니다.

Import 된 sap btp service icons

온라인 버전의 Draw.io

데스크탑 버전이 훨씬 다루기 쉽고 반응성이 빠르며, 라이브러리 설정도 덜 번거롭습니다. (데스크탑 버전 추천!)

하지만 온라인에서 할 수 밖에 없는 상황이면 아래를 참고하시면 됩니다.

diagrams.net 접속하기

아래의 url로 접속(과거에는 draw.io에서 현재 app.diagrams.net으로 리다이렉트 됨)

처음 접속을 했다면 다음과 같이 저장 위치를 지정하게 되는데요, 적절하게 다이어그램을 저장할 곳을 선택합니다.

다이어그램 저장 위치 선택

Github로부터 SAP BTP 다이어그램 라이브러리 가져오기

데스크탑 버전과 동일하게 새로운 다이어그램 등을 선택 한 후 아래의 메뉴로 이동합니다.

메뉴 > 라이브러리 열기 > Github

메뉴 - 라이브러리 열기 - github 선택

나의 gihub 로그인이 필요하며 auth를 연결해줍니다.

AHTHORIZE 앱 선택

내 github 로그인 인증이 완료되면 /입력/ 글자를 클릭 합니다.

입력 텍스트 클릭

입력 항목 창에는 아래의 주소를 입력하시면 됩니다.

rsletta/sap_btp_icons_drawio_lib

조회되는 github 목록에서 다음의 순서로 선택하면 됩니다.

main > src > libs

XML 파일 서비스 위치로 이동

조회된 XML 파일을 데스크탑과 마찬가지로 각 파일 갯수 만큼 선택 반복하면 모두 임포트 할 수 있습니다.

그러면 온라인 버전도 다음과 같이 SAP BTP 서비스 아이콘이 설정되어 다이어그램 그리는데 유용하게 사용할 수 있습니다.

웹 버전 DRAW IO에 적용된 SAP BTP 다이어그램

이상으로 SAP BTP 아키텍처를 표현할 때 유용하게 사용할 수 있는 Draw.io 서비스를 정리해 보았는데요, SAP BTP 장표 작성이나 발표, 강의 시에 유용하게 사용해 보시기 바랍니다.

함께 보면 좋은 글

SAPUI5 XML formatter 익스텐션 추천(VS Code, XML Tools)

SAP BTP Trial Free 계정 신청하는 방법

SAPUI5 SDK 설치 – VS Code 설정 핵심 요약(2023)