VS Codeで、PlantUMLを使って、シーケンス図やアクティビティ図を描く環境の準備方法。

Environment

OS: Windows 11
VS Code拡張機能： PlantUML
PlantUML Server: Ubuntu 20.04.2 LTS on WSL2

PlantUMLのレンダリングサーバは外部サーバ（ https://plantuml.io/ ）を使うこともできるが、仕事で使う場合は自前で用意した方が安心。個人的に一番手軽に用意できそうな、WSL2上のUbuntuのDockerでPlantUML Serverのコンテナを使う方法を説明する。
なお、VS Codeのインストール方法、WSL2でUbuntu環境準備方法に関しては、適宜ググってほしい。
（WSL2に関しては、Windows 10でLinuxを使う(WSL2)で書いてたりするのでよかったら見てみてください。）

Install docker into Ubuntu 20.04.2 LTS on WSL2

Ubuntuの標準リポジトリに用意されているパッケージは古いので、最新版をインストールする。こだわりがなければ、標準リポジトリからsudo apt install dockerすればよいと思う。

念のため、dockerの古いバージョンを削除

sudo apt remove docker docker-engine docker.io containerd runc

Dockerリポジトリの設定
2.1. リポジトリ設定に必要なパッケージをインストール
```
sudo apt update
sudo apt install ca-certificates curl gnupg lsb-release
```

2.2. Docker公式GPG keyを追加

```bash
curl -fsSL https://download.docker.com/linux/ubuntu/gpg | sudo gpg --dearmor -o /usr/share/keyrings/docker-archive-keyring.gpg
```

2.3. Dockerリポジトリの追加

```bash
echo "deb [arch=$(dpkg --print-architecture) signed-by=/usr/share/keyrings/docker-archive-keyring.gpg] https://download.docker.com/linux/ubuntu $(lsb_release -cs) stable" | sudo tee /etc/apt/sources.list.d/docker.list > /dev/null
```

Dockerのインストール

sudo apt update
sudo apt install docker-ce docker-ce-cli containerd.io

ユーザをdockerグループに追加
sudoなしでdockerコマンドを実行できるように、dockerグループにユーザを追加。
```
sudo usermod -aG docker $USER
```
dockerサービスを起動
WSL2のUbuntuでは、systemctlコマンドが使えないので、serviceコマンドでdockerを起動。
```
sudo service docker start
```

なお、Microsoft Store版WSLではsystemdを有効化できるので、systemctlコマンドを使える。自動起動設定もできるので、個人的にはこっちを使うようにしている。

Run PlantUML Server container

PlantUML Serverのdocker imageをダウンロードして起動
```
docker run -d -p 8080:8080 plantuml/plantuml-server:jetty
```
PlantUML Serverの起動状態の確認
Windows上のブラウザで http://localhost:8080 にアクセスし、下記のような画面が表示されれば準備OK。

Install PlantUML extension into VS Code

WindowsでVS Codeを起動し、PlantUML拡張機能をインストール
PlantUML拡張機能のRender Server設定を変更
PlantUML拡張機能の下記設定を変更する。

PlantUML: Render -> PlantUMLServer
PlantUML: Server -> http://localhost:8080

動作確認
適当にPlantUMLで記述したファイルを用意し、Alt + Dを押すことでプレビューを確認。

あとは自由に使い倒しましょう。

Links

PlantUML
PlantUML VS Code Extension
PlantUML Server Docker Image
Install Docker Engine on Ubuntu