Posts

ブログを作る

2025.03.16

何度かブログを作ろうとしたが、どれも途中で投げ出していた。 Hugo, zola, Next.js, Lume, Hono, Vike などを試したが、 自分のブログを作るために使うすると、どれもしっくりこなかった。 単純にSSGとして使うには考えることが多かったり、 SSGに特化してるのはいいが自由度が少なかったり、大体そんな理由だ。

そんな訳でフレームワークを使わないことにした。 自分の目指していたブログは、 テンプレートエンジン(Ventoを使った)を使って出力したhtmlを公開用のディレクトリに出力すればほぼ完成した。 考える部分は、記事をどのように扱うか、ということだった。

始めの内はmarkdown形式で記事を書いて remarkなどを使ってhtmlに出力する方式で実装しようと思っていた。 しかし、記事中で数式やコードハイライトを付けたいのだが、そうしようとするとプラグインが必要だった。 プラグインによってはあまりメンテナンスされていなかったりして嫌気が差したので、この方針を変えることにした。

そもそもmarkdownという形式にも疑問を持つようになっていた。 markdownには文法を拡張するためのルールが存在しておらず、 様々なフレーバーが存在している。 よく使われるフレーバーにGithub Flavored Markdownがあるが、拡張された文法に統一感が無いように感じていた。

一体どのようなマークアップ言語なら自分は満足するのか。 思いついたのはXMLだった。htmlと近い感覚で書けながら拡張性も高い。 しかし、XMLをパースするライブラリをざっくりと探した中では、 文章中のタグを思ったようにパースするライブラリがなかった。 そこで、XMLのような文章のパーサーを自分で書くことにした。

パーサーを書く目的は、 XMLの標準に準拠することではなく、 自分の記事で使いやすい形式の文章をパースすることである。 そのため、実際のXMLとは似ても似つかないかもしれないが、 個人的に満足できる形にはなった。 例えば、次のようにすれば、 コードハイライトされたプログラムが表示されるようになっている。 (htmlのcodeタグとは違う)

<code lang="c">
#include <stdio.h>

int main(void) {
  printf("hello world!\n");

  return 0;
}
</code>

結果はこんな感じだ。 (執筆時はコードハイライトにshikiを使っている。)

#include <stdio.h>

int main(void) {
  printf("hello world!\n");

  return 0;
}

タイトルや日付もXML likeな文書の中で書こうとも思ったが、 そういったメタデータだけ欲しい時もあるのでfront-matterに書くようにした。 そんなこんなで、記事の扱いが固まり、今の形となった。

開発時は、出力ディレクトリをルートとしてViteを実行することで Hot-reload 環境が簡単に構築できた。 cssなどを変更したときにページをリロードする手間が省けるのは大きく、とても快適だった。

モダンなフレームワークから距離を取って、 遠回りを楽しむのもまた一興ではなかろうか。