Markdownは、文章を記述するための軽量マークアップ言語でネット上で文章を共有するのに便利に使えます。拡張子は.mdですが、中身はテキスト文章なので軽量ですし、特殊なエディタやビューアーがなくても中身を確認できます。
IT技術者でなくてもブログの下書き、メモやレポートなどにも活用できます。
Markdown形式の特徴
- シンプル
簡単な記号で書式を指定できるので、HTMLタグよりも100倍簡単です
- 書式が使える
Markdownは、表（テーブル）もあり、使える書式も文章を書く上で十分です。また、LaTeX, flow, sequence, mermaid をサポートしているので、数式、フローチャート、シーケンス図、ガントチャートなどもテキスト表記で描けます - 互換性がある
MarkdownからHTML、Word形式、PDFなど他のフォーマットに変換できます
Markdownは、シンプルで書式が使えて、互換性があるだけではありません。何よりも キーボードから手を放さぜずに書けるというのは、文章を書く上でとても大切なことです。
Typoraは最強のMarkdownエディタ
多くのMarkdownエディタが、編集画面と表示画面の二画面で構成されていますが、Typoraは、WYSIWYG（What You See Is What You Get）なインターフェイスで、入力したものがそのまま描写されます。またフローチャート、シーケンス図、ガントチャートなどもコマンドベースで作成することができます。
更には、後述するGUIでの表（テーブル）機能のサポート、Excelなどからの表のコピペ、画像コピペなど、コマンドで面倒な部分はGUIでサポートしてくれます。Typoraは、Linux/Mac/Windowsで動作し、現在は、β版ということで無料で利用できます。
2021年11月に有料となり¥1,969（税込）です。クレジットカード/デビッドカード、PayPalで購入できます。（2022/1/31追記）
- 軽量でシンプルなエディタ
- WYSIWYGなインターフェイス
- フローチャート、シーケンス図など図が描写できる
- 面倒なコマンドはGUIでサポート
と、とっても便利なTyporaです。いま時点で最高のMarkdownエディタだと思います。
TyporaでのMarkdown文法
Typoraは、下記の段落と改行以外については、標準のMarkdownに準拠しています。
段落と改行
ネット上で共有されている文章は、読み手の環境に依存するために改行はあまり使われていません。受けとったメールが変なところで改行されていて読みづらいと思ったことは、誰しもが経験したことがあるのではないでしょうか。
文章を読みやすくするためには段落を使います。HTMLでは<p></p>で文章を囲みますが、MarkdownではEnterを押して改行すると次の段落になります。Markdownでも改行はあり、半角スペース2つで改行なのですが、TyporaではSHIFT+ENTERで改行となります。
改行された
文章
見出し
見出しは6段階です。＃の数が少ない方が大きな見出しとなり、htmlのh1からh6タグまでに相当しています。
# 見出し（h1） ## 見出し（h2） ### 見出し（h3） #### 見出し（h4） ##### 見出し（h5） ###### 見出し（h6）
Sample
リスト
リストは - か * です。Tabキーでインデントを付けることもできます。
- 順序なし１ - インデント１ - インデント２ - 順序なし２
Sample
- 順序なし１
- インデント１
- インデント２
- インデント１
- 順序なし２
番号を付けたリストも作成できます。番号は、1.からでなくても始められます。Enterで次のリストとなり、文字を入力せずに続けてEnterするとリストは終了します。
1. 順序付き１ 1. インデント1 2. インデント2 2．順序付き２
Sample
- 順序付き１
- インデント1
- インデント2
- 順序付き２
チェックボックスも作ることができます。
- [x] チェック済み - [ ] 未チェック
Sample
未チェック
文字を強調する
文字を *（アスタリスク）で囲むと斜体になります、アスタリスクふたつで囲むと太字で、三つで囲むとと斜体と太字の組み合わせとなります。
*斜体（イタリック）* **太字** ***Bold & Italic***
Sample
太字
Bold & Italic
打消し線
~（チルダ）2つで囲むと打消し線付きの文字となります。
~~打消し線~~
Sample
リンク
参照リンクは、[タイトル](URL)で記述します。
[象と散歩](https://walking-elephant.blogspot.com)
Sample
画像
画像の差し込みは、参照リンクの記述と似ていますが、先頭に!（エクスクラメーション）を付けます。
で指定します。Typoraでは、
もっと簡単に画像をコピー&ペーストすることもできます。画像をコピペするとWindowsであれば、C:\Users\ユーザ名\AppData\Roaming\Typora\typora-user-images\ に画像が保存されます。
引用
引用は > を使います。二重引用の場合は >> です。メールなどの引用符でも使いますから馴染みがあるかと思います。
> 象と散歩をするようにゆっくりとデータ解析やマーケティングについて考えて > みようと思っていますが、物欲という雑念が払拭できません。 > 趣味のエギング、アクアリム、三線は永遠の初心者です。 > > 【引用】[象と散歩](https://walking-elephant.blogspot.com)
Sample
象と散歩をするようにゆっくりとデータ解析やマーケティングについて考えてみようと思っていますが、物欲という雑念が払拭できません。趣味のエギング、アクアリム、三線は永遠の初心者です。
【引用】象と散歩
コード
1行でコード（等幅フォントで整形）を記載する場合は、`（バッククォート）で囲みます。
`1+1=2`
複数行の場合は `（バッククォート）３つで括りますが、Typoraの場合、```で改行、若しくは、``` 言語名でコード入力用のボックスが生成されます。
``` gas
function myFunction() {
Browser.msgBox('hello, world!');
}
注釈
文献を引用した場合や、補足説明をする場合に使う注釈は、[^注記号] と [^注記号]: 補足文 を使います。本文中の注記号にマウスオーバーすると補足文の内容が表示されます。
表（Table）
表（Table）は、各セルの内容を |（パイプ） で括ります。列は2列以上が必要で、最初の行はTable Header（TH）となり、2行目が表レイアウト、3行目からが、Table Data（TD）となります。2行目の表レイアウトは省略できます。
|TH1|TH2|TH3| |----|----|----| |TD1|TD2|TD3|
Sample
| TH1 | TH2 | TH3 |
| TD1 | TD2 | TD3 |
表の幅は100％（表示画面の最大）ですが、各セルの比率は、-（ハイフン）で変更することができます。またセル内の左揃え、中央揃え、右揃えは、:(コロン)で表します。
|左揃え|中央揃え|右揃え| |:--|:----:|--:| |TD1 |TD2 |TD3 |
Sample
| 左揃え | 中央揃え | 右揃え |
TD1 | TD2 | TD3 |
Typoraの場合は、最初のヘッダー行のみ入力をしてエンターを押すと、表ツールが立ち上がるので、行、列の追加削除、文字位置などが簡単に行えます。
水平線
水平線は、***, 若しくは、---で書きます。
エスケープ
Markdown として意味がある記号の前に、\ を書くと文字をそのまま記述できます。
\*\*太字になりません\*\*
Sample
目次
Tyoraで目次を作成するときは、[TOC]と記載するだけです。見出しの1~6が目次となります。
Typora の文法サポート
Typoraでは、メニューバーの "ファイル(F) → 設定" で文法サポートの各項目をチェックすると、下付き、上付き文字、ハイライトがサポートされます（ダイアグラムについては別途説明）。
下付き文字
下付き文字は、~（チルダ）で囲みます。
H~2~O
Sample
上付き文字
上付き文字は、^（ハット）で囲みます。
X^2^
Sample
ハイライト
文字をハイライトするときは、=（イコール）ふたつで囲みます。
==ハイライト==
Sample
絵文字
Markdownでは、絵文字コードを :（コロン）で囲って、絵文字を埋め込めむことができます。しかし、絵文字コードを覚えるのは大変です。絵文字を使うのであれば、EMOJI CHEAT SHEET に絵文字の一覧があります。絵文字をクリックするとコードがコピーされるので便利です。但し、:simple_smile:などのいくつかの絵文字は使えませんでした。
:smile: :sweat: :cry: :thumbsup: :elephant:
Sample
HTMLタグで文字装飾をする
TyporaではHTMLタグもそのまま記載できます。文字色ぐらいはMarkdownでも対応してもらいたいところですが、下線、文字色、文字寄せ、ルビ文字などは、HTMLタグで記述します。
HTMLで下線
下線はhtmlタグ<u>を使います。
<u>下線</u>
Sample
HTMLで文字色
文字色はhtmlタグ<font>を使います。
<font color="red">文字を赤色にする方法</font> <font color="blue">文字を青色にする方法</font> <font color="gray">文字を灰色にする方法</font>
Sample
文字を青色にする方法
文字を灰色にする方法
HTMLで文字寄せ
文字寄せは divタグ の style属性 を使います。
<div style="text-align: right;"> 右寄せ </div> <div style=”text-aligh: center;”> 中央寄せ </div> <div style=”text-align: left;”> 左寄せ </div>
Sample
追記：2019.08 文字寄せについて追記しました。
HTMLでルビ文字
ルビ文字はhtmlタグ<ruby>を使います。
<ruby>霰<rt>あられ</rt></ruby>
Sample
LaTeXで文字装飾をする
Typoraの文法サポートでインライン数式をチェックするとLaTeXが使えます。LaTeXは、数式の記述や論文の体裁を整えるためのものですが、ちょっと構文が面倒です。[改訂第7版]LaTeX2ε美文書作成入門
TyporaでLaTexを使うには、$（ダラー）で囲みます。複数行にまたがる場合は、$$で囲みます。
LaTexで数式
数式はこんな風に書きます。
$ \ce{CH4 + 2 $\left( \ce{O2 + 79/21 N2} \right)$} $
Sample
LaTexで文字色
LaTeXを使って文字色を付けることもできます。
$ \textcolor{red}{文字色を赤色にする方法} $
$ \textcolor{blue}{文字色を青色にする方法} $
$ \textcolor{gray}{文字色を灰色にする方法} $
Sample
文字色を青色にする方法
文字色を灰色にする方法
Markdownで図形も描ける
Typoraでは、文法サポートのダイアグラムをチェックしていると、フローチャート、シーケンス図、ガントチャートいった図形もプレーンテキストで表記することができます。こちらの記述方法については、別途、書きたいと思います。
簡単シンプルで色々できるMarkdownをTyporaで始めましょう。
Typora で Markdown シリーズ
Typora での Markdown の記述方法については、下記のシリーズで紹介しています。
参考にしてください。
