상현에 하루하루
개발자의 하루

UML (nomnoml)

( 업데이트: )

포토샵과 피그마등 여러가지 디자인툴을 이용해서 UML 관계형 지식? 다이어그램 등을 만들기 번거로웠다.

  • 시중에있는 서비스를 쓰자니 해당 서비스에 종속되어서 나중에 데이터를 관리하지 못하지 않을까?
  • 비용적인 문제

그래서 UML에 대해서 오픈소스나 간단하게 쓸만한 라이브러리가 없을까? 찾아보게되었다.

🥳 nomnoml을 찾게되었다.

nomnoml은 간단한 구문을 기반으로 UML 다이어그램을 그리는 도구입니다. nomnoml은 자바스크립트 라이브러리로 렌더링 됩니다. 유일한 종속성은 graphre입니다.

사용하기 편한점은 다이어그램을 만들고 svg로 export가능하고 해당 패턴을가진 상태로 URL을 공유할 수도 있다. png로 내보내기도 지원합니다.

그중에서 저는 svg와 해당 URL을 주로 사용합니다.

self-hosting

이렇게 아주 awesome한 라이브러리를 찾았고 프로젝트에 설치해서 사용하기 보다는 따로 Docker를 통해서 공유할수있는 was를 만들어서 관리하고싶었기 때문에 해당 방법을 찾아봤습니다.

soulteary/docker-nomnoml: Docker Nomnoml is a simple but elegant self-hosted UML Generator & UML Sharing solution.

해당 저장소의 docker 이미지를 사용하였는데 nomnoml@1.3.1 버전을 사용하고있었기에 버전관리가 지속적으로 되지않는구나? 판단하고 해당 저장소를 포크해서 최신버전을 바로바로 만들수있게 설정하였습니다.

Hansanghyeon/docker-nomnoml: Docker Nomnoml is a simple but elegant self-hosted UML Generator & UML Sharing solution.

제 저장소를 참고하면되고 docker 이미지는

docker run --rm -it -p 8080:80 ghcr.io/hansanghyeon/docker-nomnoml:latest

Github packages에 업로드된 nomnoml 도커 이미지를 사용하면 1.4.0 최신버전을 반영한 이미지로 사용할 수 있습니다.

✨ Feature

self-hosting

  • nomnoml의 저장소를 체크해서 해당 버전이 올라왔을 때 자동으로 그게 맞는 버전으로 이미지를 자동으로 빌드하기