【WordPress】WP Mermaidプラグインをインストールしてフローチャートを書いてみた

目次

「WP Mermaid」でフローチャートを書いてみる

Mermaid構文

を使って、基本的なループ文を想定してみた。

1.一度処理をしてからループ条件判定しループを抜ける(Do-Loop-Until)

flowchart TD
    A([Start]) --> B{if}
    B -->|No| C[[Processing]]
    C --> D{Until}
    D --> |No|C
    D --> |Yes|E
    B -->|Yes| E([End])
flowchart TD A([Start]) --> B{if} B -->|No| C[[Processing]] C --> D{Until} D --> |No|C D --> |Yes|E B -->|Yes| E([End])

2.処理をする前にループ条件判定しループを抜ける(Do-Until-Loop)

flowchart TD
    A([Start]) --> B{if}
    B -->|No| C{Until}
    C --> |No|D[[Processing]]
    C --> |Yes|E
    D --> C
    B -->|Yes| E([End])
flowchart TD A([Start]) --> B{if} B -->|No| C{Until} C --> |No|D[[Processing]] C --> |Yes|E D --> C B -->|Yes| E([End])

For-Next , For-Each...Next文などの条件は下のこの型なので、この形が標準となるがフローチャートの形だけ見ると
上図の方が綺麗に見えるねぇ~~慣れの問題かな?

これだけでも、簡単なフローチャートをわざわざExcelやGoogleスライドを使って貼付けするよりかは、WordPressを使ってある程度構造化した簡易フローチャート+実際のコードで、処理の概要を説明するには十分な仕様書は書ける。

編集後記

現在作成している自作競馬データべースの作成をもう少し分かりやすく解説するには?動画?なのかどうなのか?
自分自身は既にシステムとして半自動で組みあがっているので、解説用に一から作成するのも面倒だな~とか、
違うプログラム言語を勉強のために試してみるとかも更に面倒だよな~と思っていたところのフローチャートをWordPressで書けるプラグインを見つけたので、今回試してみた!といった流れ。

これだと、言語が変わってもある程度の概要的な説明が効くので、プログラミングの考え方としては不変な部分なのかな~と感じる部分をフローチャートとして残すことで、言語化しているのを簡略図で表現できるかな!?と思っている。

他にもマインドマップなども作れるようなので、今後これも試してみたい。

それでは、またね~😎

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!
目次