ブログを比較的始めたばかりだが、HexoからAstroをベースに作成されたブログテンプレートのFuwariに乗り換えを行う。というか既に行った。

移行方法#

Fuwariのテンプレートを複製する#

Githubにある公式リポジトリからテンプレートとして複製するか、Cloneを行う。
テンプレートとして複製するにはGithubアカウントを持っている必要があるが大体の人は持って居ると思う。持っていなければCloneすれば良し。

pnpmの導入#

Hexoからの移行を体に進めている為nodejsは導入済みの想定としています。個人的にはHexo導入時にも推奨されているnvsを使いnodejsを入れる事を個人的に推奨してます。
pnpmは以下のコマンドで導入可能。

npm install -g pnpm

依存関係の導入#

Cloneを行ったルートディレクトリ上で、

pnpm install

pnpm add sharp

を行う事で導入可能

サイトのカスタマイズ#

サイトの設定を編集する際はsrc/config.tsを直接変更する事で行えます。

• title
  • Webサイトのタイトル
• subtitle
  • ウェブサイトのサブタイトル、直接表示される訳ではなく、ブラウザのタブに表示される
• lang
  • 言語、特段理由がなければjaで良いと思う
• themeHue
  • サイトのテーマカラー、色相に基づいている。Wikiの説明が参考になる
• banner
  • サイトバナーの設定。enableをtrueにしてsrcに画像のパスを指定する事で表示可能
• avatar
  • サイト左上のアイコンを設定する。かわいい。
• name
  • 任意の名前を設定する。本名でも良いしハンドルネームでも良いと思う。
• bio
  • 簡単な説明
• links
  • 各種SNS等へのリンク設定が可能、iconはiconify.designの物が利用可能
• licenseConfig
  • 自身の記事をクリエイティブコモンズ等に準拠してライセンス掲示する際に使用する。enableをfalseにする事で記事末尾の表示から消す事が可能。

記事の作成#

Cloneしたルートディレクトリ上で

pnpm new-post <任意の記事名>

を実行する事でsrc/content/posts/にフロントマターの設定されたMarkdownファイルが生成される。 記事のプレビューは

pnpm dev

を実行する事でローカルホストで確認する事が可能。

記事のプレビュー#

ビルド及びプレビューコマンドを実行する事で実際にデプロイされた際と同様の内容を確認する事が出来る。

pnpm build
pnpm preview

previewだが、直前のビルドされた物を表示しているので、設定ファイルや記事を編集した場合、プレビューに反映させる場合毎回build行う必要があるので注意。最終確認では無い場合devの方が使い勝手が良い。

記事の移行#

Hexo生成時に作られているMarkdownファイル群をsrc/content/posts/へ移植する事で大半は完了。
フロントマターの設定が異なる為Fuwariで生成される形式に適宜変更を行う。特にタグとカテゴリの仕様がHexoと異なる為注意。

何故移行したのか#

Hexoでブログを書いていく上で、いくつかの制約が存在する事が判明した為。
Hexo自体は軽量でテーマを適応したら後はブログを執筆するだけでブログサイトとして運用が可能なフットワークの軽さがとても良いのだが、ブログ執筆以外にサイト運営を行う上で付加機能をサイトに持たせたい場合制御出来る所が少ない事に気付いた。
GoogleAnalyticsやAdSenceを配置する事自体も可能ではあるが、制限が多い為その制限の中でads.txtをどうやって配置するか、生成後のサイトに<meta>をどの様に含ませるか、等頭をひねる必要性がある。直接生成後のウェブページを弄る事でも可能ではあるが、自身はCloudflareWorker&Pagesを用いてGitのリポジトリからビルド後の内容をブログとして表示する様にしている為この手段が取れないので困っていた。

ここでHexoで使用していたテーマのviviaを作成しているsaicacaさんのリポジトリを見ていた所、別のブログテーマと思わしき物があり見て見た所、Hexoのテーマという形ではなく、Astroをベースに構築され直したブログテンプレートのFuwariを発見。以下の理由でFuwariへの乗り換えを決めた。

拡張性の高さ#

先に言った通り、FuwariはAstroをベースに作られたブログテンプレートであり、Hexoの様なテーマではない。見た目は踏襲されているが、構築自体は異なっており、.astroファイル等を編集する事で、ビルド後のサイトデータをカスタマイズ出来る。.astroファイル自体クソザコエンジニアの自分でも比較的理解可能な部類だったので、これは行けるのでは？と思い乗り換える要因の一つとなった。

学習難度の低さ#

これは公式で謳われている&自身が若干カスタマイズした際の印象も含むのだが、かなりコードが分かり易い。公式ではHTMLが出来ればAstroも出来ると言っているがあながち間違いじゃ無いと思う。このブログを見ている人には申し訳無いが、今後広告を入れようと思ったりしているが、astroの学習難度の低さも相まって広告挿入自体もブログの可読性を下げずに自分で導入可能なのではないかと考えている。コードを書く上でWebサイトで調べるという行為は付きものだが、調べる前にコードを見て大凡の書き方等を楽に考えて調べずに書けるに超したことはないのでね。

そもそもviviaがサポート終了予定#

viviaでプロフィールアイコンの設定が分からず質問を行った際、saicacaさんから実際に返答を頂いたのだが、FuwariはViviaの次期メジャーバージョンと考えられているらしく、今後開発を中止する予定らしい。その為無理をしてHexo&viviaを使い続ける理由がなかったので乗り換えたというのもある。

OSSで貢献出来そう#

astroが割と取っつきやすい言語だったこともあり、やろうと思えば不足していると思った機能を自身で拡張する事が出来るので、もしその実装内容が本当に良いと思った場合Fuwariに対してPRを出して貢献できそうだと感じた。

以上の理由からHexo&viviaの構成からFuwariへの乗り換えを行った。