2016年5月29日日曜日

Markdownの力

お疲れ様です、セルディアです。

徒然なるままに書き連ねたひ


皆さんは、考えていることやアイデアを書いてまとめたいときに、どんな方法を使いますか? メモ帳で充分? それともWordで丁寧に書き上げる、アナログに紙とペンで済ませる…などなど。
でも、ただテキストエディタで書き留めておいても、文章量が増えてくると、まとめ方も迷ってきます。うまくまとめないと、同じようなことがいろんなところに散見されたり、どこに何が書いてあるのかわからなくなったり…これでは本末転倒です。
そういって今度は、WordやHTMLなどの構成を整えられるような高機能なエディタでまとめようとすると、書くために覚えることが多くなっていきます。見出し機能はどこかな、箇条書き機能はどこかな、編集方法はどうかな…。そのために書くことがストレスになると、それはそれで大変。

今回は、編集時のわかりやすさと閲覧時の見やすさを兼ね揃えたMarkdownをご紹介します。

Markdownでできること

Markdownは、テキストで書いた内容を、自動的にHTML形式などに変換してくれます。非常に簡単なルールで記述できるため、とても書きやすく見やすいです。

いくつかルールを上げてみます。


  • 見出し
    見出しは行先頭に#(シャープ)を付けます。#の数によって、見出しのレベルが変わります。
# タイトル
## サブタイトル1
### 項目1
### 項目2
## サブタイトル2
...
  • 強調
    強調したい文章を*(アスタリスク)で囲みます。
例:ここが*強調*されます。
  • 引用
    引用する場合は、行先頭に>(大なり)を付けます。
> 引用される文章です。
> 複数行引用するときは、連続して>を付けます。
  • 箇条書き
    行先頭に*, +, -などを入れることによって、箇条書きにすることができます。
    箇条書きの中に箇条書きのリストを入れることもできます。
* 項目1
    + 項目1-1
    + 項目1-2
* 項目2
...
  • リンク
    文章内にリンクを埋め込むことができます。
    文章内の見出しや、Webページにリンクさせることが出きます。
[ここ](#見出し1)が見出し1に飛びます。
  • コード引用
    構文ルールで使ってしまっている記号文字やスペースなども、直接テキスト通りに表示したい場合は、コード引用で記述します。
    コード引用は、```(バッククォート)3つで文を挟みます。

```
int main(void) {
    printf("hello world");
    return 0;
}
``` 
また、文章の一部分をコード引用形式にしたい場合は、`(バッククォート)で挟みます。 
例:ここが`code`です。

HTMLへの変換


HTMLへ変換するには、Pandocというソフトを使います。
Pandocは以下からダウンロードできます。

http://pandoc.org/

英語のページですが、Installingから辿れば簡単にダウンロードできます。
インストーラに従ってインストールすれば、すぐに使える状態になります。

Pandocで変換するためには、コマンドプロンプトを使います。
あらかじめMarkdownのルールで書いたファイルを、拡張子mdで適当な場所に保存しておきます。コマンドプロンプトのcdコマンドで保存したディレクトリに移動して、以下のコマンドを打ってみましょう。
pandoc -t html -s hoge.md -o hoge.html
hoge.mdは適宜保存したファイル名に合わせてください。
コマンドを打つと、同じフォルダにhtmlファイルが作成されます。

さらに便利なオプション


Pandocには、ただMarkdownテキストからHTMLに変換するだけでなく、いろいろ便利なオプションがついています。
一部をご紹介します。


  • Markdownのルールを変更する
    実はMarkdownは、いろいろな派生ルールがあります。といっても、それぞれが「簡単に記述できる」という目的に沿って実に単純明快なルールで派生しているので、それほど難しくはありません。
    とりあえずGithubが流行ってそうなので適当にGithub形式を指定しましょう。
    こんな感じで指定します。
pandoc -f markdown_github -t html -s hoge.md -o hoge.html
  • 見出し一覧を付ける
    せっかく見出しを付けたはいいものの、見出し一覧がなければ役立つものも役立ちません(言いすぎ?)
    Pandocには見出し一覧を自動的に作成する方法があるので、以下のようにオプションを指定しましょう。
    なんと、HTMLリンクも貼ってくれます。
pandoc --toc -f markdown_github+pandoc_title_block-ascii_identifiers -t html -s index.md -o index.html  
 (+pandoc_title_block-ascii_identifiers という謎のオプションを指定しないと、全角文字の見出しにリンクを貼ってくれません)
  • CSSを指定する
    HTMLは、ちゃんと装飾指定してやらないと、非常にそっけない表示になります。せっかくCSSという簡単で便利な装飾方法があるので、指定してみましょう。
    今回はGithub風のCSSを借りてみます。以下で公開されている方がいるので、感謝しつつダウンロードします。

    https://gist.github.com/andyferra/2554919

    そして、mdファイルと同じフォルダに置いて、以下のコマンドで変換します。
pandoc --toc -f markdown_github+pandoc_title_block-ascii_identifiers -t html -c github.css -s index.md -o index.html

終わりに



以上で私からの紹介は終了です。
Markdownは使いこなせばもっと便利なルールや表現方法がたくさんあるので、気になった方はじゃんじゃん調べてみてください。

そうそう、本来Markdownは、改行にはスペース2つを入れるのがルールみたいなのですが、Pandocで変換するとテキストの改行から自動的にHTMLで改行してくれます。
まあスペース2つなんで視覚的に全く見分けがつかないし、忘れやすいし、ぶっちゃけクソ仕様…とにかく、都合がいいのでそのまま使ってます。

それでは、よいテキストメモライフを。