背景
ChatGPTが出てきて大きく変わったところの一つに、概念モデルでのアセット管理があげられます。概念モデルさえ管理しておけば、そこからプログラムコードを作成したり、レンダリングツールで表示させたり、編集したりといった幅広い使い方ができるわけです。
つまりモデリングした時点での情報。何かといえばUMLだったりER図だったり。その図の状態を保持しておけば。そこからRDBMSだろうが、NoSQLだろうが。C#だろうが、Javaだろうが、Pythonだろうが。Azureだろうが、AWSだろうが、GCPだろうが。ChatGPT君がドラフト生成してくれますよね。
概念モデル大事!😊
Mermaid と PlantUMLが、このLLM時代に強力なソフトウェアエンジニアである私を助けてくれるツールになると思うんですね。なぜかといえば、テキストの情報だからです。バイナリーじゃない。しかもベンダーに依存してませんよね。PlantUML自体が。テキストですからバージョン管理も簡単ですよね。GitHubなどが即座に使えるわけです。
PlantUMLにどっぷりつかってもいいんですが。概念モデルの表現方法の一つに過ぎませんので。これに拘り過ぎないようにしましょうね😊
PlantUML:
https://github.com/plantuml/plantuml
Visual Studio Code には豊富なExtensionがあるんですけど。PlantUMLを使おうと思うとextensionだけだと動かないんですね。PlantUMLのサーバーのURLを指定する必要があります。
作戦
PlantUMLのServerのURLは、あるんですよ。公開されているものが。
ですが、業務上の機密情報などを外部に出せないですよね😅
ですので、会社・組織内で用意するか。
あるいは、ローカルでも大したコンピューティングリソースの利用状況じゃないので良いかと思います。
ここでは自分のPCもしくはMacにPlantUMLサーバーを立てましょう。
で、PlantUMLのインストールなんですけど。
PlantUML Serverの構築には、いろんなものが必要になるんです。そのためにスクリプトも公開されているかもしれないです。
ここではバージョンアップやらの課題を回避するために、Dockerバージョンを使う事にします。
まあアップデートも簡単ですしねえまあ、その辺ケアしたくないというのもありますし。また、OSが違っていても。まあ、ある程度動くわけですよね。
そして、Docker環境にしておけば。エンジニアではない方であっても、比較的容易ですし。そして、エンジニアとそうでない方とで Markdown のテキストファイルだけで、情報の共有が出来るようになりますよね!😊
手順
各手順で、動かなかったら、
- アプリの再起動
やあるいは、 - OS自身の再起動
をしてください。これは、いつもの事ですけど。
1. Visual Studio Code のインストール
これは、言うまでもなく😊
2. Docker Desktop のインストール
Windows の例でご紹介します。
Docker Desktop のインストールに、winget を使います。Windows パッケージマネージャーですね。各アプリケーションのバージョンアップもラクチンですし。
私はwingetでインストール出来るアプリケーションについては、全てそこでインストールとバージョンアップを行っています。
2.1. winget (アプリ インストーラー)のインストール
Microsoft Store から、インストールしてください。Micrsoft Store のアプリで検索してもいいですし。
公式ドキュメント:
https://learn.microsoft.com/ja-jp/windows/package-manager/winget/
2.2. WSL のインストール
こちらも公式ドキュメントを。
公式ドキュメント:
https://learn.microsoft.com/ja-jp/windows/wsl/install
2.2. WSL 用の Ubuntu をインストール
Microsoft Store で、ubuntu を検索して、インストールしてください。
このBlogを書いている時点でのバージョンは、22.04ですね。
どのバージョンでもある程度動くかと。動かなかったら、比較的最新のLTSのものをインストールしてください。WSLでは、複数のディストリビューションを同時に稼働できます。
2.3. Docker Desktop のインストール
ようやくですね。
Terminalを起動させて、以下のコマンドを入力します。
winget install Docker.Desktop
インストールが完了したら。定番ですが、へろーわーるど コマンドで、動作確認をします。
docker run hello-world
image が無ければ、ダウンロードしてくれて、実行します。こんな画面になるかと。
Windows に慣れている方は、素直にDocker DesktopのGUIアプリを使うのも吉です😊
Imageの数が少ないうちは、これで十分。多くなっても、状況の把握はしやすいです。
3. PlantUML のDocker Image のインストール
ネットで検索するといろんな「やってみた」が出てきます。とっても便利なので是非参照してください。
ただ信じる者は「公式」サイトです。
docker hub にイメージが公開されています。これを使いましょう。
DockerHub:
https://hub.docker.com/r/plantuml/plantuml-server/
docker run -d -p 8080:8080 plantuml/plantuml-server:jetty
jettyの方を選びましたが、tomcatでも、どちらかお好みで。
動作確認しましょう。
にアクセスします。
はい、動いています!😎
4. Visual Studio Code に PlantUMLのextensionをインストール
VS Code 起動します。
extension に PlantUML で検索すると、たくさん出てきます。さすがVS Code。大人気😊
ここでは、一番上に出てきたPlnatUMLのExtensionをインストールします。
メッチャ早くインストールが終わりますね。
VS Code のPlantUML extensionの設定を行います。ここで PlantUML ServerのURLを指定します。
設定画面の一番上に「plantuml.server」とでも入力して、ServerのURLの入力画面を検索します。
先ほどのDocker ImageのURLを入力します。
こんな感じー😊
はい、終了です。お疲れさまでしたー
5. 動作確認
PlantUMLは、Markdownの書式で作成できます。
適当なテキストのファイルを作成して、ファイルの拡張子を .md にします。
例えば、こんな感じ。
helloplantumlt.md
で、以下の文字をファイルに入力します。先ほどの初期サイトでのテキストの文字列です。
冒頭の「```plantuml」がポイントですね。
```plantuml
@startuml
Bob -> Alice : hello
@enduml
画面右上のプレビューボタンを押します。
表示できない場合は。
こんな画面が出たときですね。
おそらくですが、Visual Studio Code と、PlantUMLサーバーとのやり取りでのアクセス許可が必要になります。
[このドキュメントで一部のコンテンツが無効になっています]を選択します。
そうすると VS Code のコマンドエリアにアクセス許可設定を変更するメニューが表示されます。
[安全でないローカルコンテンツを許可する]
を選択します。
Visual Studio Code のMarkdown レンダリングの詳細はこちら:
https://code.visualstudio.com/docs/languages/markdown#_markdown-preview-security
まとめ
そんなに複雑な手順でもないとは思います。ですが、相変わらずですが、ソフトウェアエンジニアの生業をしていないと、幾つかアプリを入れる必要があって、ちょっと手間ですよね。
でも、今はそのバージョンアップを補助してくれるツールが沢山出ています。
Windowsのアプリは、wingetがおススメ。
DockerのImageがあるのであれば、imageのバージョンアップするのも簡単。保持も出来る!