ホーム
Markdownって200種類あんねん

Markdownって200種類あんねん

うえすん


このブログでは記事を書くのに Markdown が使用されています。先日、処理系を変更し、GFM が使用できるようになりました。Markdown は実は微妙に異なる実装系が数多く存在しており、その中の一部を紹介します。

Markdown とは

Markdown は .md の拡張子がついたテキストファイルです。GitHub の先頭のページにある README.md も Markdown の構文で記述します。Markdown とは軽量マークアップ言語と呼ばれるもので、簡単な構文で文章のマークアップ(見出しとか段落とかで文章を構造化すること)ができるのが特徴です。

Markdown の面白い所はレンダリング前のソーステキストファイルの状態でも、ある程度構造化されているように見える所です。以下に例を示します。


Markdown の例

これが Markdown の例です。 私たちの文章はブログにまとめていきます。

今の所、著者は以下の通りです。

  1. うえすん

    この記事を書きました。はやとも同一人格です。自宅の回線は遅いです。

  2. おそと

    おそとですが、自宅の回線は速いです。


上記は、以下のようなテキストファイルを HTML に変換(レンダリング)することでブログとして表示しています。

## Markdown の例

これが Markdown の例です。
私たちの文章は[ブログ](https://log.tabisoft.cloud)にまとめていきます。

今の所、著者は以下の通りです。

1. うえすん

   この記事を書きました。はやとも同一人格です。自宅の回線は遅いです。

   - [めちゃくちゃモテます](/posts/2025/mote-baas)

2. おそと

   おそとですが、自宅の回線は速いです。

テキストファイルの状態でも箇条書きとか見出しとかなんとなく分かりますよね?そのままでも読む事ができるというのが Markdown の特徴です。開発者もそう言っています。

The overriding design goal for Markdown’s formatting syntax is to make it as readable as possible.

Markdown (元祖)

元祖の Markdown は John Gruberによって提案され、処理系も Markdown.pl という perl プログラムで提供されました。最初から構文もかなり完成されていたようです。

CommonMark

オリジナルの Markdown.pl にはバグがあり、仕様にあいまいな部分が多かったそうです。そこで仕様を標準化するための団体が立ち上がりました。それが CommonMark です。 有名な Markdown 用ツールである Pandoc の作者が主にメンテナンスしているようです。

仕様策定は 2014 年から行なっていますが、厳密な仕様策定に至るには難しい6つの問題がある らしく、バージョン 1.0 の公開には至っていません。

また、標準的な構文に限っているため、表や数式などちょっと凝った構文は導入していません。

GFM(GitHub Flavored Markdown)

GitHub では README.md など Markdown が多様されており、CommonMark を拡張してより多くの構文を使えるようにしたGFM(GitHub Flavored Markdown)を導入しています。

Markdown は GitHub の利用とともに知ることも多いでしょうし、個人的には GFM がデファクトスタンダードなのかなと思っています。例えば 勝手に URL をアンカーリンクにしてくれる のは GFM 独自の機能ですが、他の場所でもよく見かけます。

remark

remark は私が気に入って使用している OSS の Markdown パーサ(解析プログラム)です。unifiedという構文解析フレームワークの元で作られており、他のプラグインを組み合わせたり、独自のプラグインを追加したりして、自分だけの Markdown 処理系 を作ることができます

このブログ用に作ったのがこんなパーサです。

// unified markdown processer
const processer = unified()
  .use(remarkParse)
  .use(remarkGfm)
  .use(remarkFrontmatter)
  .use(() => (_, file: VFile) => {
    matter(file);
  })
  .use(remarkRehype)
  .use(rehypeToc)
  .use(rehypeHighlight, { detect: true })
  .use(rehypeStringify);

あまり詳しく説明しませんが、Markdown を GFM として解析し、Yaml で書かれたヘッダからブログのタイトルなどを抽出したり、コードブロックをハイライトしたりしています。

まとめ

(↑ チェックボックスは GFM の機能です)