Astro 5に対応しました！

2024年の年末にリリースされていましたが、弊社もようやくアップグレードすることができました。

マイナーバージョンのアップグレードは気軽にできますが、メジャーバージョンのアップグレードはなかなか腰が重くなりがちです。特に、Nuxt 2 から Nuxt 3 への移行で苦労した経験がある人は、いまだにそのトラウマが残っているかもしれません。

とはいえ、今回もサクッと Astro 4 から Astro 5 へアップグレードしてみました。

依存関係の不整合に少し手間取りましたが、さすが Astro。特にコードの修正をすることなく、問題なく動作しました。

コンテンツレイヤー API

Astro 5 では、このコンテンツレイヤー API が正式に組み込まれました。 従来の Content Collection はローカルデータのみを扱っていましたが、新しいコンテンツレイヤー API を使うことで、リモートのデータ管理も可能になりました。

しかも管理がとても簡単！

すでに WordPress 用のローダーも用意されており、以下のリンクから利用できます。

通常、API を読み込む際には fetch を使いますが、デフォルトでは 1 回の読み込みで 100 記事の制限を受けます。100 記事以上ある場合、複数回のリクエストが必要となり、管理が面倒になります。

しかし、このローダーを使うと、すべてのデータを 1 回の読み込みで取得できるのがすごい点です。 さらに、仮想サーバーの立ち上げ時に一度データを読み込んでキャッシュするため、ページの読み込みが遅くなることもありません。特に、View Transition を活用してページ間の切り替えを行っている場合、その恩恵を大きく受けることができます。

このローダーはまだメジャーバージョンではないようですが、今後の発展に期待したいですね。

2024.3.4追記です。

DeWPはワードプレスのREST APIを全て取得してくれて型も勝手に作ってくれると思っていましたがそうじゃないようです。

ワードプレスに標準であるposts,categories,tags,media他といったような元々あるデータしか取得することができず、カスタム投稿や、カスタム項目（ACF）のデータを取得することができません。

後、型が若干変わります。postのcategoriesですが、

{
  categories: number[]
}

が、

{
  categories: {
    id: string
    collection: string
  }[]
}

となってました。

こういった変更が地味に時間を浪費します。

View Transition

Astro とは直接関係ありませんが、View Transition も 2024 年末に Safari に対応しました。

これにより、よりスムーズで直感的なページ遷移が可能になり、Web サイト制作がますます捗っています！

お知らせ

弊社では、単体の Web サイト制作の割合は少なくなってきていますが、最新技術のキャッチアップは常に行っています。 また、店舗撮影と組み合わせた Web サイト制作も承っておりますので、ご興味がある方はぜひお問い合わせください！