個人サイトの改修記録その2
- 日本語
- djLint
- cargo-make
- Zola
前回まで
Zola へ移行してから、個人サイトの改修に熱中している。
前回の改修記録はこちら。
{{ card(title=“個人サイトのdnfolioを大きく改修した”, url=“https://dnfolio.me/ge-ren-saitonodnfoliowoda-kikugai-xiu-sita/”) }}
ここから更に進化したので記録しておく。主に開発環境をアップグレードした。
分かりやすいようにリリースバージョンを設定
GitHubでリリースタグを設定するようにした。
{{ card(title=“Releases | dnfolio GitHub”, url=“https://github.com/Daiki48/dnfolio/releases”) }}
個人サイトで誰からが利用するわけでもないので自分の感覚でバージョニングしていっている。 自分ルールとして
メジャーバージョンは、大枠のフレームワークに影響がある場合にインクリメントする。
現在は v4 だが、 v3 が VitePress 時代、 v2 が Lume 時代、 v1 が SvelteKit 時代となる。
コミット履歴には残っているがバージョニングはしていなかったので、 v4 からはバージョニングして記録を残していきたいと思う。
マイナーバージョンは、機能の追加、削除、更新、改修でインクリメントする。
パッチはバグ改修でインクリメントする。
というルールにした。
本来の セマンティック バージョニング と違うのはメジャーバージョニングぐらい？
{{ card(title=“セマンティック バージョニング 2.0.0”, url=“https://semver.org/lang/ja/”) }}
以降は、リリースバージョン内容をまとめていく。
v4.7.0 で djLint を導入
{{ card(title=“v4.7.0 | Releases”, url=“https://github.com/Daiki48/dnfolio/releases/tag/v4.7.0”) }}
Zola では Tera というHTMLテンプレートエンジンを利用している。
この Tera 構文は Prettier などでは綺麗にフォーマット出来なかった。
出来る方法があれば教えてもらいたい。今回は分からなかったので djLint を導入した。
{{ card(title=“djLint”, url=“https://djlint.com”) }}
djLint で htmldjango ファイルタイプのフォーマットを実現出来た。その時の記事も投稿した。
{{ card(title=“htmldjangoファイルのフォーマットに成功した | dnfolio”, url=“https://dnfolio.me/htmldjangohuairunohuomatutonicheng-gong-sita/”) }}
v4.8.0 で cargo-make を導入
{{ card(title=“v4.8.0 | Releases”, url=“https://github.com/Daiki48/dnfolio/releases/tag/v4.8.0”) }}
これも記事を書いた。
{{ card(title=“個人サイト開発にcargo-makeを導入した”, url=“https://dnfolio.me/ge-ren-saitokai-fa-nicargo-makewodao-ru-sita/”) }}
cargo-make は今回初めて利用してみたが、かなり体験良い。業務プロジェクトでの導入も検討したい。
これまでは Deno をグローバルにインストール済みの状態で deno task を使用していた。
今後、サムネイル生成などを行う際に Rust で開発予定だったため、ついでに cargo-make へ移行した。
deno.json から Makefile.toml にすることでいろいろと便利になったので、その内容は上の記事を確認してほしい。
v4.9.0 でアンカーリンクを導入
{{ card(title=“v4.9.0 | Releases”, url=“https://github.com/Daiki48/dnfolio/releases/tag/v4.9.0”) }}
Zola はアンカーリンクの生成を簡単に行える。
{{ card(title=“Anchor insertion | Zola”, url=“https://www.getzola.org/documentation/content/linking/#anchor-insertion”) }}
あとは、スマホ画面で閲覧時に若干行間が狭かったり、気になった部分を修正した。
本当に CSS は苦手だ…
v4.10.0 で記事ページに目次を導入
{{ card(title=“v4.10.0 | Releases”, url=“https://github.com/Daiki48/dnfolio/releases/tag/v4.10.0”) }}
これまた Zola のドキュメント通りに設定することで実装出来た。
ドキュメントが読みやすくて好き。
{{ card(title=“Table of Contents | Zola”, url=“https://www.getzola.org/documentation/content/table-of-contents/”) }}
v4.11.0 でトップページをアーカイブ風表示に
{{ card(title=“v4.11.0 | Releases”, url=“https://github.com/Daiki48/dnfolio/releases/tag/v4.11.0”) }}
Zola ドキュメントに書かれていたので導入してみた。
{{ card(title=“Archive | Zola”, url=“https://www.getzola.org/documentation/templates/archive/”) }}
まだ何年も投稿しているわけではないので今後、このリリースが役に立つ時が来るだろう。今は2025年しか表示されていない。
という感じで追加の改修内容をざっくりと書いていった。
SvelteKit から始まった個人サイトだが、自分しか利用しないサイトというのは気が楽だし、その場の思い付きで導入したい技術を最初に試せる場でもあるから個人サイトは大事だと思う。