ご覧いただいているこちらのサイトは、これまでWordPressにて実装・運用を行なってきました。
今回新たなチャレンジとして、ヘッドレスCMSであるmicroCMSと静的サイトジェネレーターのAstroを使用して再構築を行なってみました。
外見はほとんど変えず、サイトの「内側」だけを変更しています。細かな変更点は以下の通りです。
| 項目 | 変更前 | 変更後 |
|---|---|---|
| JavaScriptフレームワーク | 利用なし | Astro（+部分的にVue.js） |
| メタタグの設定 | SEO SIMPLE PACK | astro-seo |
| 画像最適化 | Converter for Media等 | Imageコンポーネント |
| 動的実装：お知らせ | WordPressのデフォルト投稿機能 | コンテンツコレクション、Markdown |
| 動的実装：ブログ | - | コンテンツコレクション、MDX |
| 動的実装：制作実績 | WordPressのカスタム投稿タイプ＋カスタムフィールド | microCMS |
| 動的実装：納品実績 | Googleスプレッドシートのデータを動的に表示 | Googleスプレッドシートのデータを動的に表示 （大きな変更なし） |
| お問い合わせフォーム | Contact Form 7 | SSGform |
| バリデーション（フロントサイド） | - | HTML+制約検証API |
| Googleアナリティクス連携 | SEO SIMPLE PACK | @astrojs/partytown |
| XMLサイトマップの生成 | XML Sitemap & Google News | @astrojs/sitemap |
| RSSフィード | WordPress標準機能 | @astrojs/rss |
| ホスティングサービス | レンタルサーバー | Vercel |
WordPressでの実装・運用に大きな不満があったわけではないですが、ヘッドレスCMS+Astroに変更することでサイトのパフォーマンスが向上し現在のところ大変満足しています。
内部的にはまだまだ改善できる箇所がたくさんありそうなので、業務の合間に修正を加えたいと思います。
将来的にはヘッドレスCMSの実装や、Astroを使用した高パフォーマンスなサイト制作についてもサービス提供したいなと考えております（マークダウンで入稿できるブログ開発もやってみたいです）。
今後ともよろしくお願いいたします。
【2024/07/12追記】
ページ数が多いサイトではないですが、View Transitions APIを導入しました。
ビュートランジション APIを使用することで、シームレスでよりリッチなページ遷移を実現することができます（実装時点でChromeとEdgeでのみ対応）。
【2024/07/22追記】
本サイトの中にブログを立ち上げました。
新たに学んだことや、実装に詰まった点を中心にアウトプットできればと考えています。
【2024/09/11追記】
少しづつブログの記事が増えてきたので「ブログ一覧ページ」にページネーションを実装し、キーワード（タグ）による絞り込み機能を追加しました。