PlantUMLとGithub ActionsとGithub Pagesとmdbookでリポジトリに紐づく資料をうまく管理したい

# なんでそんなことしたいの❓
元々の話の経緯は下記の記事を書いたことや組織図だってPlantUMLで書けるという記事を見たこと、今はもう発表スライドだってMarkdownで書けるという話からです。
ドキュメントってちゃんと開発の更新に合わせて最新にアップデートされていかないなーというのをどうにかしたい思いが強く入ってます :grin: :angry: (本当は怒ってないけど・・・・ :sweat_smile: )

- [PlantUMLでAWSのシステム構成図がなるべく管理される世界観を考えてみた - Qiita](https://qiita.com/takarake/items/ff906a19f96cdfa5ec6a)
- [ITエンジニアが組織図を作ろうとするとこうなる PlantUML - Qiita](https://qiita.com/daisukeArk/items/a1e00d67471bd0ac4d52)

上記の記事にて @grassedge さんより、下記のコメントもいただき、ずっと **Github Actions** でPlantUMLから図を生成することをやりたいなーと思っていた矢先、

https://qiita.com/takarake/items/ff906a19f96cdfa5ec6a#comment-a1a2098cb8d072b5c69b

**Github Pages** がプライベート対応したということで、これは **Github Actions** と **Github Pages** の連携でプライベートサイトが作れる❗❗❗

- [Access control for GitHub Pages | GitHub Changelog](https://github.blog/changelog/2021-01-21-access-control-for-github-pages/)

# できあがった成果物
これで開発作業の流れで、ドキュメントがなるべく更新される世界観が作れるんじゃないか❗❓ということで、少し試してみました。
色々と検証してみて出来上がった yamlがこちら👇

## :file: Github ActionsのPageへビルドとデプロイするyaml

```yaml:.github/workflow/gh-pages.yml
name: github pages
on:
  push:
    branches: [ publish-githubpages ]

jobs:
  build:
    runs-on: ubuntu-latest
    name: generate architecture diagram from plantuml
    steps:
      - name: Checkout Source
        uses: actions/checkout@v2

      - name: Sync README # READMEもPagesに常に反映してみました
        run: cp -f README.md mdbook_src/sync_readme.md

      - name: Push Local Changes
        uses: stefanzweifel/git-auto-commit-action@v4.1.2
        with:
          commit_message: "Sync README to Github Pages"
          branch: ${{ github.head_ref }}

      - name: Generate SVG Diagrams
        uses: holowinski/plantuml-github-action@main # コメントいただいたgh-actionじゃなくてすみません。。。
        with:
          args: -v -tsvg mdbook_src/*.puml

      - name: Push Local Changes
        uses: stefanzweifel/git-auto-commit-action@v4.1.2
        with:
          commit_message: "Generate SVG files for PlantUML diagrams"
          branch: ${{ github.head_ref }}


  deploy:
    runs-on: ubuntu-18.04
    needs: build
    steps:
      - uses: actions/checkout@v2

      - name: Setup mdBook
        uses: peaceiris/actions-mdbook@v1
        with:
          mdbook-version: '0.4.6'

      - run: mdbook build

      - name: Deploy
        uses: peaceiris/actions-gh-pages@v3
        with:
          github_token: ${{ secrets.GITHUB_TOKEN }}
          publish_dir: ./docs
```

[Generate and Commit PlantUML Diagrams · Actions · GitHub Marketplace](https://github.com/marketplace/actions/generate-and-commit-plantuml-diagrams) 
👆 :arrow_forward: PRで修正前と修正後の画像をコメントしてくれてこれも便利そうです :thinking: 

## :file_folder: mdbook関連の **.md**ファイルなどの構成はこちら👇

```bash:mdbook
$ tree mdbook_src
mdbook_src
├── ARCHI.md
├── SUMMARY.md
├── chapter_1.md
├── dev-env-archi.puml　　　←devのシステム構成図書いたファイル
├── dev-team-chart.puml　　　←チーム組織図書いたファイル
├── dev-team-chart.svg　　　←PlantUMLからGenerateされたSVGファイル
├── development-env-aws.svg　　　←PlantUMLからGenerateされたSVGファイル
├── prod-env-archi.puml
├── production-env-aws.svg　　　←PlantUMLからGenerateされたSVGファイル
├── sync_readme.md　　　←READMEをコピペしたファイル
└── team_chart.md
0 directories, XX files
```

## :page_facing_up: デプロイされたGithub Pagesサイト
### PlantUMLから生成されたシステム構成図 :dizzy: 
![システム構成図-ドキュメント.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/14268/8b9ef0c4-d5b7-0b80-b286-c43cfe658d16.png)

### PlantUMLから生成されたチーム組織図 :dizzy: 
![チーム組織図-ドキュメント.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/14268/7e35d96f-786f-b643-1dc4-49c8ba907b2f.png)

# まとめ
- PlantUMLで組織図もシステム構成図もなるべく更新管理される世界観が **Github Actions** と **Github Pages**と mdbookを使ってざっくりやれた :thumbsup: 
- mdbookっていう gitbooks的なツールがあるのがわかった :thinking: 画面右上に「印刷」ボタンもあるので、PDF出力とかもできそう❓❓❓(できたらマニュアルとかにもなるのでは :grin: )
- 次はER図なんかも **Github Actions** で生成したら便利そうかなー :thinking: :thinking: :thinking: 

最近はGithubが色々とアップデートされていて、どんどん便利になるなー

# 参考URL
- [Github Actions and Workflows](https://www.mytechiebits.com/GithubActionsWorkflow)
- [Introduction - mdBook Documentation](https://rust-lang.github.io/mdBook/)
- [rust-lang/mdBook: Create book from markdown files. Like Gitbook but implemented in Rust](https://github.com/rust-lang/mdBook)
- [mdBook&GitHubPagesでのドキュメント公開](https://zenn.dev/404_fof/articles/272f2a88d2d519b1edb3)
- [Rust mdbook をちょっと改造してブログにする - o296.com](https://o296.com/e/mdbook_as_blog.html)