長年JekyllというRuby製静的サイトジェネレーターを使ってブログ記事を公開し続けてきた。

最近心変わりがあり、Next.jsでブログを作り直してみた。

心変わり

JekyllでマークダウンからHTMLを生成して、CSSやJSはwebpackや最終的にはViteで生成していた。

これでそこそこ満足していたが、フロントエンドエンジニアとして仕事でNext.jsを使っていくうちに、Jekyllを置き換えられるという確信が深まり実行したという流れ。

やったこと

やりたいことは以下の通り

• マークダウンをHTMLに変換できること
• マークダウンのファイル名から/yyyy/mm/dd/slug.htmlのパーマリンクを生成できること
• YAMLフロントマターが処理できること
• なんらかのfeedを出力したい

基本的には「markdown next.js」で検索した記事を参考にしつつ、/yyyy/mm/dd/slugのパーマリンクができるようにした。SSGなら末尾を.htmlにできそう。

デプロイ先はVercel。これまでAWSのCloud Frontを使っていたが、Route53でAレコードをVercelに向けて終わり。

つまずきポイント

パーマリンク末尾の.htmlが実現できないので、リダイレクトが必要になるかと思っていた。これはvercel.jsonのcleanUrlsをtrueにすることで自動的にリダイレクトが実行された。素晴らしい。これでVercelに握られてしまった感がある。

見た目をどうするかで一月以上公開が止まっていた。止めるよりは公開してしまった方がいいので、そこそこ整えて公開。

配色は本屋でたまたま見つけた国鉄車両関係色見本帖 + 車両色図鑑から拝借。ガンダムとかいろいろな作品の色見本帖があると色々はかどりそう。

algoliaを導入していたが必要なさそうなのでやめる。これもムダに時間がかかっていた。

所感

デプロイ先は変えるかもしれないし、このままかもしれない。

ちょいちょい足りないところはこれから整備していこう。

それより記事を書こう。