새로운 프로젝트를 시작하면서, 개발 기획서를 써야할 상황이 왔다. 클라이언트 앱 개발 담당이기 때문에 클라이언트 앱 기획서를 서비스 기획서 기반으로 작성하여 보고해야하는 상황이었다. 기획과 설계를 진행하면서 클래스 다이어그램으로 같이 만든다면 보고하기도 쉽고, 피드백 받기도 좋을 것 같다는 생각이 들었다. 그리고 마침 유튜브 "생활코딩"의 이고잉님이 커뮤니티에 PlantUML을 사용하여 멋지게 UML을 그리신 것을 보고 한번 해보고 싶다는 생각이 들었다.
개발 환경
- M1 Macbook (2021)
- macOS Monterey 12.3.1
1. UML & PlantUML
1-1) UML
Unified Modeling Lanuage, 통합 모델링 언어를 뜻하는 UML은 소프트웨어 공학에서 사용되는 범용 모델링 언어이다. UML의 표준은 분산 객체에 대한 기술 표준을 제정하는 OMG(Object Management Group)에서 관리 하고 있다. UML은 소프트웨어 집약 시스템의 시각적 모델을 만들기 위한 도안 표기법을 포함한다. (출처 : 위키백과)
1-2) PlantUML
PlantUML은 다이어그램을 빠르게 작성하기 위한 오픈 소스 프로젝트이다. 사용자가 입력한 텍스트(Plain Text)를 Graphviz 를 사용하여 다이어그램으로 그려주는 도구이다. 지원하는 UML의 종류는 다음과 같다.
- 시퀀스 다이어그램
- 유스케이스 다이어그램
- 클래스 다이어그램
- 객체 다이어그램
- 액티비티 다이어그램
- 컴포넌트 다이어그램
- 배치 다이어그램
- 상태 다이어그램
- 타이밍 다이어그램
이 외에도 다양한 다이어그램들을 지원하고 있다. 추가 사항들은 공식 홈페이지 참고.
2. PlantUML 설치
PlantUML은 하나의 프로그램이기 때문에 설치 과정이 필요하다. 설치를 하지 않더라도 PlantUML이 내장된 Online Server가 있어서 사이트에 접속하면 PlantUML을 할 수 있다. 로컬에서 프로그램으로 사용하고 싶다면 다음 설치 과정을 진행하면 된다.
2-1) 환경 구축
Plant UML을 설치 및 사용하기 위해서는 "Java"와 "Graphviz" 가 필요하다. 우선, Java는 이미 설치되어 있기도 하고 구글에서 수많은 Java 설치 방법에 대한 글들이 있으니 생략한다.
Java 설치를 마친 이후에, Graphviz를 설치해준다. 만약 "시퀀스 다이어그램"과 "액티비티 다이어그램"만 사용한다면 설치하지 않아도 된다. 공식 설치 가이드에는 Window, Linux 그리고 Mac 에서 설치 방법에 대한 가이드를 각각 제공한다. 그 중에서 필자는 macOS를 사용하기 때문에 Mac 설치 가이드만 따르고, 블로그에 기술한다. 다른 환경의 설치 방법은 링크를 통해 볼 수 있다.
2-2) Mac 에서 Graphviz 설치
Mac 에서 Graphviz를 설치 할 때, Homebrew를 사용한다.
brew install libtool
brew link libtool
brew install graphviz
brew link --overwrite graphviz
위 4개의 명령어를 통해 Homebrew로 Graphviz 를 설치하였다. 이제 PlantUML을 설치한다.
2-3) PlantUML 설치
Java와 Graphviz 설치를 마쳤다면, plantuml.jar 파일을 다운 받으면 된다. 파일을 다운 받은 후에, 다운 받은 위치로 이동해서 다음 명령어를 실행한다.
java -jar plantuml.jar -testdot위 명령어는 위에서 설치했던 Graphviz가 PlantUML에서 잘 사용되는지 확인하는 명령어이다.
잘 설치되었다는 확인을 받았다. 이제 PlantUML을 사용해볼 것이다.
2-4) PlantUML 실행
PlantUML을 사용하기 전에 테스트로 사용할 PlantUML을 위한 텍스트 파일을 생성한다. 편의를 위해서 plantuml.jar 파일을 설치한 곳과 같은 위치에 텍스트 파일을 생성하였다. 텍스트 파일 안은 다음처럼 간단히 구성한다.
@startuml
Alice -> Bob: test
@enduml
이제 위 텍스트파일을 다이어그램으로 변환하는 방법은 GUI를 사용하는 방법과 CommandLine을 사용하는 방법이 있다. 먼저, PlantUML GUI는 터미널에서 다음 명령어를 실행하면 만나볼 수 있다.
java -jar plantuml.jar -gui현재 plantuml.jar 파일과 테스트용 텍스트 파일이 같은 위치에 있다. 그 상태에서 위 명령어를 실행하면 다음 사진처럼 자동으로 테스트 텍스트 파일을 인식하여 다이어그램을 그린 PNG 파일로 생성한다.
GUI에서 TestPlantUML.png 을 클릭했더니, 해당 텍스트 파일을 다이어그램으로 그려준 모습을 새 창에서 보여준다.
GUI를 사용하는 방법 외에 CommandLine 에서 바로 변환을 하는 방법이 있다. 방금 사용한 테스트용 텍스트 파일의 파일 이름은 "TestPlantUML.txt" 이다. 그러면 다음과 같이 명령어를 구성하여 입력하면 된다.
java -jar plantuml.jar TestPlantUML.txt
그러면 PlantUML을 실행하는 위치에 변환된 PNG 파일을 받을 수 있다. 이제 클래스 다이어그램을 그리기 위해서는 어떻게 해야하는지 파헤쳐보도록 한다.
3. 다이어그램의 요소(Element)
클래스 간의 관계를 표현하기에 앞서, 각 요소들을 표현하는 방법이 어떻게 되는지 정리한다.
3-1 ) 추상 클래스 (Abstract Class)
추상 클래스는 "abstract" 혹은 "abstract class" 라 앞에 명시하고, 추상 클래스의 이름을 띄어쓰고 적어주면 된다. 만약 클래스 이름 안에 공백을 넣고 싶다면, 문자열을 넣는 것처럼 ""(큰따옴표)로 추상 클래스명을 적어주면된다. 만약, ""(큰따옴표)를 쓰지 않고, 클래스 명 안에 공백을 준다면 에러가 발생한다.
@startuml
abstract abstract
abstract class "abstract class"
abstract "bas class"
abstract class aabbcc
@enduml
3-2) 어노테이션(Annotation)
어노테이션은 "annotation" 이라 정의하고, 띄어서 어노테이션 이름을 적어주면 된다.
@startuml
annotation override
annotation NonNull
annotation JavascriptInterface
annotation "aaa bbb"
@enduml
3-3) 원 (Circle)
다이어그램에서 원(Circle)은 초기 상태(Initial State), 종료 상태(End State), 접합(Juction)을 뜻한다. 종료 상태의 원은 조금 모양이 다르지만, PlantUML에서 원은 한 가지 모양만 있는 듯하다. 타입 키워드는 "circle" 혹은 "()" 이다.
@startuml
circle "Initial State"
() "End State"
circle Junction
@enduml
3-4) 클래스 (Class)
일반적인 클래스는 "class" 라 명시하고, 띄어서 클래스 명을 적어준다.
@startuml
class StartClass
class EndClass
class "Welcome Class"
@enduml
3-5) 다이아몬드 (Diamond)
다이아몬드 모양은 Choice 를 뜻한다. 조건에 따라 다른 방향을 표시할 때 사용한다. 타입 키워드는 "diamond" 혹은 "<>" 이다. 다이아몬드는 지금까지 본 요소들처럼 아래에 다이아몬드의 이름을 출력하지 않는다.
@startuml
diamond diamond
<> diamond_short_form
@enduml
3-6) 엔티티 (Entity)
자바 코드에서 데이터베이스와 매핑할 때 사용하는 Entity는 UML의 타입 키워드도 "entity" 이다. entity는 다른 요소들이 없을 때와 있을 때 다이어그램의 모양이 다르다.
@startuml
entity entity1
entity entity2
entity entity3
entity entity4
@enduml
@startuml
class aaclass
entity entity1
entity entity2
entity entity3
entity entity4
@enduml
3-7) 열거형 (enum)
보통 상수들을 열거할 때 사용하는 enum은 UML의 타입 키워드도 "enum"이다.
@startuml
enum constants
enum playState
enum "action state"
@enduml
3-8) 인터페이스 (Interface)
@startuml
interface interface
interface OnClickListener
interface OnItemClickListener
interface "note OnPlaybackListener"
@enduml
본 글에서는 PlantUML의 설치 방법, 실행, 기본적인 요소들을 그리는 코드를 정리해보았다. 다음 글에서는 각 요소들 간의 관계를 어떻게 그리는지 정리해볼 예정이다. 그와 더불어 객체지향개발에 대한 지식을 좀 더 갖고 있어야겠다는 생각을 하게 되었다. 꽤 전에 공부한터라 가물가물한 상태인데... PlantUML로 객체 간 관계를 그릴 때 많이 검색해보고 공부해야 할 것 같다.
'NotePad' 카테고리의 다른 글
| AWS CLI, AWS SAM CLI 설치하기 (on M1 Mac) (0) | 2022.06.20 |
|---|---|
| iOS 앱 배포 하려다 키체인 암호 팝업에서 막혔을 때 (1) | 2022.06.15 |
| AMD 에서 Android HAXM 오류 문제 해결 (0) | 2020.02.10 |
| [알고리즘] N-Queen (0) | 2020.01.26 |
| [알고리즘] 정렬(Sort) (0) | 2020.01.14 |