概要

先日Mark TextというOSSのMarkdownエディタを見つけたが、Qiitaに記事がなかったので紹介。

MAC/Windows/Linuxで利用可能。

対象読者

• Markdownに興味があるけど、記法を覚えるのが面倒で敬遠してきた人
• ドキュメントはMarkdownで記述して、GitHubなどやツールで差分を見やすくしたい人
• Markdownのエディタ選定で悩んでいる人
• Markdownを愛している人

特長

見た目のまま記述可能

最大の特徴はMarkdownをそのまま記述できるということ。
Markdown記法を覚えなくてもすぐに書ける。
これまで筆者はMarkdownをVSCodeやAtomで書いてきたのだが、それよりも断然使いやすい。

例えば画像挿入するときは、ドラッグ＆ドロップで可能。Markdownの記法は覚えなくていい。

例えばQiitaのヘルプにあるような下記の表を挿入するときは、

下記のようなMarkdownを記載する必要がある。

| Left align       |       Right align |    Center align    |
|:-----------------|------------------:|:------------------:|
| This             |              This |        This        |
| column           |            column |       column       |
| will             |              will |        will        |
| be               |                be |         be         |
| left             |             right |       center       |
| aligned          |           aligned |      aligned       |

表のフォーマットってどうだっけと悩むことも多いうえ、自分は|の位置とかをスペースで調整したくなる人間なため、意外と上記は編集するのが面倒である。
Mark Textではメニューから表の大きさを指定するだけで作成できる。

中央寄せなどした場合はメニューから選択するだけ！タブキーでの移動もできるのでストレスフリー。

右に列を追加したい場合などもメニューからできてすごく簡単！

フローチャートやシーケンス図の記述が可能

テキストでUML図を記載できるので、変更の際の差分が確認しやすい。
わずらわしい細かな位置調整なども自動でやってくれるので楽。

下記の図がサポートされており、システム開発で使うようなものはだいたいおさえられている。

• フローチャート
• シーケンス図
• クラス図
• ガントチャート
• Gitグラフ
• 棒グラフ
• ヒストグラム
• 散布図
• ...

内部では下記の別プラグインを呼んでいるので、詳細な記法は対応するページを見れば良い。

• flowchart.js
• mermaid.js
• js-sequence
• vega-light.js

フローチャートの例

例えばフローチャート挿入手順は下記のようになる。
（公式サイトに載っていないのだが）@を入力するとメニューが表示され、そこから挿入する図を選択する。

入力エリアが表示されるので、ここにフローチャートのデータを記載する。

今回は公式ページからサンプルを拝借する。データを記載するとリアルタイムで図が変わっていく。

ちなみにデータ部分はカーソルアウトすると見えなくなるので、見た目上は図のみが残ることになる。
再度編集したいときは編集ボタンを押せばOK。

シーケンス図の例

次にシーケンス図を挿入してみる。
@でメニューを表示し、Mermaidを選択。（好みの問題なのでSequence Diagramでも可）

公式ページよりサンプルを拝借すると下記のようになる。

HTML/PDFへの変換が可能

Markdownエディタをインストールしていない人にMarkdown形式のファイルを渡すと、ただのテキストファイルなので可読性が悪い。
そこで役立つのがHTML/PDF変換機能。

エディタで下記のように書いたものは、ファイル保存と同じ感覚で変換が可能。

HTMLは下記のようになる。見た目はMarkdownと変わらない。

PDFは下記のようになる。こちらも見た目は変わらない。

他形式に変換する方法

細かい説明は割愛するが、Pandocを使えば、Wordやパワポ形式などにも変換可能。
自分はWordが好きな人にドキュメントを提出するときはWord形式に変換している。
スタイルの指定もできるので、意外ときれいに変換できる。

その他

本記事では紹介していないが、下記のようなことも可能である。

• 数式の挿入
• 強調・取り消し線などの文字の装飾
• テーマの変更（自分は黒背景が好み）