Qiitaに載せた記事のリンクをPlantUMLで可視化する

## 1.はじめに
筆者はこれまでArduino、M5Stack、Excel VBA、Python、ソフトウェア品質保証(SQA)の記事をQiitaで書いています。これらは筆者にとっては互いに関連があるのですがマイページを見てもいつどの記事を書いたかはわかるものの記事同士の関連はわかりません。

そこでちょうど年末年始ということもあり、記事の棚卸を兼ねてQiitaに記事を投稿すると自動で生成される「この記事は以下の記事からリンクされています」を可視化してみました。最初はExcelにテキストボックスを並べてみたものの手作業で矢印を一つ一つ付けるのは心が折れそう＆先々メンテするのが大変そうな気がしたためPlantUMLで自動生成することとしました。
![my_articles_on_Qiita_relationship_diagram.png](https://qiita-image-store.s3.amazonaws.com/0/221758/2d269db6-84a9-f1fc-974e-b66c1c33116a.png)

PlantUMLの環境構築は[Visual Studio Code で UML を描こう！](https://qiita.com/couzie/items/9dedb834c5aff09ea7b2)を、記法は[PlantUML Cheat Sheet](https://qiita.com/ogomr/items/0b5c4de7f38fd1482a48)を参考にさせていただきました。

## 2. PlantUMLソース

- 記事のタイトルとカッコ内に投稿日を記述しています。
- 記事A←記事Bというのは、記事Aは記事Bからリンクされていることを示します。

```plantuml
@startuml

title Qiitaに載せた記事のリンク

artifact "Arduino Leonardoとジョイスティックでマウスカーソルを動かす(2018/4/30)"
artifact "ArduinoとオシロスコープをExcelで制御して測定する(2018/5/7)"
artifact "ArduinoとオシロスコープをExcelで制御して測定する(2) シャッタースピードの自動測定(2018/6/17)"
artifact "Arduino Leonardoで多目的ツールの製作(2018/6/23)"
artifact "Excel VBAでRS-232C通信(2018/6/30)"
artifact "M5Stackでコマンド操作(2018/7/4)"
artifact "M5StackにRTCを接続しI2C通信で時刻の設定、取得を行う(2018/7/15)"
artifact "M5.Lcd.*の関数をシリアルモニタで操作する(2018/7/22)"
artifact "思考実験：AQUAフレームワークの品質保証兵站への応用(2018/9/12)"
artifact "ソフトウェア品質保証のメモ(2018/10/15)"
artifact "ArduinoとオシロスコープをPythonで制御して測定する(2018/11/18)"
artifact "M5Stackでスマートウォッチ(2018/12/12)"
artifact "M5StackとPythonで受入テスト自動化の要素技術を試す(2018/12/13)"

[Arduino Leonardoとジョイスティックでマウスカーソルを動かす(2018/4/30)] <-- [Arduino Leonardoで多目的ツールの製作(2018/6/23)]

[ArduinoとオシロスコープをExcelで制御して測定する(2018/5/7)] <-- [ArduinoとオシロスコープをExcelで制御して測定する(2) シャッタースピードの自動測定(2018/6/17)]
[ArduinoとオシロスコープをExcelで制御して測定する(2018/5/7)] <-- [Arduino Leonardoで多目的ツールの製作(2018/6/23)]
[ArduinoとオシロスコープをExcelで制御して測定する(2018/5/7)] <-- [ArduinoとオシロスコープをPythonで制御して測定する(2018/11/18)]
[ArduinoとオシロスコープをExcelで制御して測定する(2018/5/7)] <-- [M5StackとPythonで受入テスト自動化の要素技術を試す(2018/12/13)]

[ArduinoとオシロスコープをExcelで制御して測定する(2) シャッタースピードの自動測定(2018/6/17)] <-- [Arduino Leonardoで多目的ツールの製作(2018/6/23)]
[ArduinoとオシロスコープをExcelで制御して測定する(2) シャッタースピードの自動測定(2018/6/17)] <-- [Excel VBAでRS-232C通信(2018/6/30)]
[ArduinoとオシロスコープをExcelで制御して測定する(2) シャッタースピードの自動測定(2018/6/17)] <-- [思考実験：AQUAフレームワークの品質保証兵站への応用(2018/9/12)]
[ArduinoとオシロスコープをExcelで制御して測定する(2) シャッタースピードの自動測定(2018/6/17)] <-- [M5StackとPythonで受入テスト自動化の要素技術を試す(2018/12/13)]
[ArduinoとオシロスコープをExcelで制御して測定する(2) シャッタースピードの自動測定(2018/6/17)] <-- [M5Stackでスマートウォッチ(2018/12/12)]

[Arduino Leonardoで多目的ツールの製作(2018/6/23)] <-- [ArduinoとオシロスコープをExcelで制御して測定する(2018/5/7)]
[Arduino Leonardoで多目的ツールの製作(2018/6/23)] <-- [M5Stackでコマンド操作(2018/7/4)]
[Arduino Leonardoで多目的ツールの製作(2018/6/23)] <-- [ArduinoとオシロスコープをPythonで制御して測定する(2018/11/18)]

[M5Stackでコマンド操作(2018/7/4)] <-- [M5StackにRTCを接続しI2C通信で時刻の設定、取得を行う(2018/7/15)]
[M5Stackでコマンド操作(2018/7/4)] <-- [M5Stackでスマートウォッチ(2018/12/12)]

[M5StackにRTCを接続しI2C通信で時刻の設定、取得を行う(2018/7/15)] <-- [M5.Lcd.*の関数をシリアルモニタで操作する(2018/7/22)]
[M5StackにRTCを接続しI2C通信で時刻の設定、取得を行う(2018/7/15)] <-- [M5Stackでスマートウォッチ(2018/12/12)]

[思考実験：AQUAフレームワークの品質保証兵站への応用(2018/9/12)] <-- [ソフトウェア品質保証のメモ(2018/10/15)]

[ArduinoとオシロスコープをPythonで制御して測定する(2018/11/18)] <-- [M5StackとPythonで受入テスト自動化の要素技術を試す(2018/12/13)]

[M5Stackでスマートウォッチ(2018/12/12)] <-- [M5StackとPythonで受入テスト自動化の要素技術を試す(2018/12/13)]

[M5StackとPythonで受入テスト自動化の要素技術を試す(2018/12/13)] <-- [M5Stackでスマートウォッチ(2018/12/12)]

@enduml
```

## 3. おわりに
PlantUMLで出力された図を眺めると意外と複雑で手作業で線を引かないで良かったです。

また、記事のタイトルの代わりに記事に登場する技術で図を作るとスキルマップになりそうです。スキルの可視化というと[ITスキル標準](https://www.google.co.jp/search?hl=ja&as_q=ITスキル標準)や[ETスキル標準](https://www.google.co.jp/search?hl=ja&as_q=ETスキル標準+ETSS)のような星取表がありますが、PlantUMLで図解すると星取表では見えてこないスキルの組合わせ方がわりと簡単に可視化できてスキルの棚卸やスキルアップの計画を立てるのに役立つかもしれないと思いました。