現代はwebを使って自分の考えを発信することができる時代です。 webは大雑把に言うと、ブラウザでURLにHTTPリクエストを送りHTMLを閲覧する仕組みです。 つまり、webサーバーにHTMLを置いておくというのが最も基本的な形だと言えます。
しかし、HTMLはwebに期待される表現の多様さに伴って、非常に複雑な仕様を持つに至りました。 文章を公開するという目的に対して、HTMLは冗長です。 より簡潔なマークアップ言語であるマークダウンは、テキストファイルの形式として優れています。 そこで、マークダウンからHTMLを生成する静的サイトジェネレーターを作ることが、webを使ったテキスト公開という目的に適していると考えました。
静的サイトジェネレーターのアウトライン
まず、テキストはマークダウン形式で書かれます。 マークダウンが素晴らしいのは、その仕様の簡潔さです。 HTMLは表現力の増加に伴って仕様を肥大化させていきましたが、マークダウンはコアの仕様をコモンマーク Common Mark として定義し、プラスアルファの表現は方言として付加的にすることで、最小限の仕様を保っています。 よって、この静的サイトジェネレーターも必要でない間はコモンマークに準拠することで、簡潔で移植性に優れたテキストを保持できます。
ソースからサイトを出力するコードはPythonで書かれています。 メインの機能はマークダウンからHTMLへの変換と、共通パーツの結合です。 いまのところ、共通パーツはヘッダーとフッターのみです。
デプロイ
Netlifyに生成したファイルをデプロイしています。 いまのところ独自ドメインを利用せず、完全無料で運用しています。
現在のサイト構成
実際に手を動かしてみると、原稿・変換途中のHTML・公開用のHTMLはそれぞれ役割が違うので、ディレクトリごと分けておくのが結局いちばん見通しがよくなりました。
md/ 原稿（マークダウン）
html/ 本文だけのHTML断片
src/ header.htmlとfooter.htmlなどの共通パーツ
public/ header/footerを結合した完成品（実際にデプロイするもの）
流れとしては、md/のマークダウンをスクリプトがHTMLに変換してhtml/に置き、そこにsrc/の共通パーツを結合してpublic/を組み立てる、という2段階になっています。トップページや作品一覧のように目次生成が要らない・レイアウトを自由に組みたいページは、対応するマークダウン原稿を作らずhtml/に直接HTMLを書いています。
記事も少しずつ増えてきて、音楽理論や技術系の話題を書き溜めるようになったので、記事一覧のページも作りました。この一覧はmd/の記事から毎回自動で作り直されるようにしたので、記事を書き足すたびに手で更新する必要はなく、そのまま一覧に反映されます。
ビルドを地道に丈夫にする
作り始めた当初は、原稿(.md)を消してもビルドしたHTMLがhtml/やpublic/にそのまま残ってしまうという問題がありました。書かなくなった記事のファイルだけがいつまでも公開され続けるのは気持ちが悪いです。 そこで、ビルドスクリプトが「今回どのファイルを生成したか」を毎回記録しておき、前回は生成したのに今回は元の原稿が無くなっているファイルを自動的に削除するようにしました。これで、原稿を消すだけでサイトからもちゃんと消えるようになっています。
楽譜を貼れるようにする
音楽理論について書いていると、文章だけでなく楽譜そのものを載せたくなる場面がどうしても出てきます。 そこで、music21などで書き出したMusicXMLファイルをscores/に置いておくと、LilyPondを使ってSVG画像に変換する仕組みを追加しました。変換したSVGは、もともとマークダウンが対応していた画像記法()でそのまま記事に埋め込めます。パーサー自体に手を入れることなく、変換の仕組みを1つ足すだけで実現できたのは、マークダウンをコアに据えて作っておいたおかげだと思います。
今後の展望
文章を書いてコンテンツを増やしていければと思っています。