ヤクとアヒル

日常の問題を解決したときにつけるログ

Markdownで構造化されたメモをとろう

簡単に文章を構造化して書くことのできるMarkdown記法の使い方を解説します。

Markdownって何?:便利なメモ記法

簡易的にHTMLをかける言語がMarkdownだ.

  • プレーンテキストで書きやすく,読みやすい

ということがメリットだと思う.しかも,公開するWebサービス(ブログサービスとか)がMarkdownに対応していれば,プレーンテキストを貼り付けるだけで勝手にCSSで修飾してくれる.
書きやすいといってもよくわからないから例をあげよう.例えばこんな感じでかける.

### Markdownで見出しを書く
<h3>HTMLだとこう</h3>

[Markdownでリンクをはる](http://example.com/)
<a href="http://example.com/">HTMLだとこう</a>

- Markdownで
- 箇条書き
<ul>
  <li>HTMLだと</li>
  <li>こう</li>
</ul>

ご覧のとおり,HTMLより簡単にかける.
プログラマ向けのサービスであるGitHubやQiitaはMarkdownで書くことが前提だし*1,ブログサービスもだんだん対応していて,Tumblrはてなブログも対応している.EvernoteGoogle Keepなんかは対応していない(対応して欲しい).

Markdownのプレビュー機能付きエディタが便利:おすすめはAtom

プレーンテキストでかけるということは,エディタはなんだっていいということだけど,プレビュー機能があると便利だ.プレビュー機能というのはこんな感じでレンダリングされた結果が見える機能だ.

f:id:motoso:20160320172033p:plain (左:Markdownで書いたテキスト,右:レンダリングされた結果)

Macでプレビューに対応しているエディタ

Macだと,エディタがプレビューに対応しているものが多い印象がある.FoldingTextとか.Quiverとか(上図はQuiver).他の候補が知りたい場合は参考サイト[1] が参考になる.

なお,対応していなくても,プレーンテキストで保存できさえすればMarkedを使ってプレビューできる.下の例では,MacVimで編集しているMarkdownで書かれたテキストファイルをMarkedを使ってプレビューしている.

f:id:motoso:20160320174345g:plain (左:MacVimで編集したMarkdown,右:Markedでレンダリングされた結果)

Windowsでプレビューに対応しているエディタ

一方でWindowsだと対応しているエディタはかなり少ない.Win/Macの両方に対応しているAtomをおすすめする.

設定からmarkdown-previewをインストールすれば,Packages > Markdown Preview > Toggle Preview からプレビューを出すことができる

f:id:motoso:20160320172110p:plain

QiitaのアプリKobitoもMac/Winに対応しているけど,間違ってQiitaに投稿してはいけないものを投稿する可能性もあるので万人にはおすすめできない.Windowsの他の候補も参考サイト[1]を参照するといいかもしれない.

参考サイト

  1. エンジニアならトコトンこだわりたい!Markdownエディタ20選【Mac, iPhone他】 | Find Job! Startup

*1:正確にはMarkdownを拡張した方言を含む

スポンサーリンク