これまでこのサイトは、WordPressを使って運用していました。
WordPressは記事の管理や更新がしやすく、長く使われているCMSです。プラグインも豊富で、管理画面から多くのことが完結します。一方で、サーバー上でWordPressを動かし続ける以上、セキュリティ対策やアップ デート対応、プラグイン管理などの運用コストはどうしても発生します。
そこで今回、WordPressを記事管理用のCMSとして使いながら、公開サイト側はNuxt.jsで生成した静的サイトとして配信する構成へ移行しました。
WordPressをヘッドレスCMSとして使う
今回の構成では、WordPressの wp-json を利用しています。
WordPress側ではこれまで通り記事を作成・更新し、そのデータをREST API経由で取得します。フロントエンド側ではNuxt.jsがその記事データを読み込み、ページとして生成します。
つまり、WordPressは「記事を管理するための管理画面」として使い、実際にユーザーが見るサイトはNuxt.jsでビルドされた静的HTMLとして公開する形です。
AIとCodexを使ってサイトを構築
今回の移行では、Codexを使ってAIと一緒にサイト構築を進めました。
既存のWordPressテーマや記事データをもとに、Nuxt.js側のページ構成、コンポーネント、CSS、記事一覧、詳細ページ、検索機能などを整備していきました。
AIを使うことで、実装のたたき台を素早く作れる一方で、最終的な判断や調整は人間側で行う必要があります。特にデザインや細かなUIの品質については、AI任せにすると「それっぽいけれど、もう一段洗練されて いない」状態になりやすいと感じました。
ローカルでWordPressを動かして記事を更新
現在は、ローカル環境でWordPressを動かし、そこで記事を更新する運用にしています。
記事を追加・修正したあと、Nuxt.js側で generate を実行します。これにより、WordPressの記事データを取得して、静的なサイトとしてビルドします。
公開サーバーには、生成されたHTMLやCSS、JavaScript、画像などの静的ファイルだけをアップロードします。
公開サーバーからWordPressを削除
今回の大きな目的のひとつが、公開サーバー側からWordPressを削除することでした。
WordPress本体、管理画面、ログイン画面、プラグイン、テーマのPHPファイルなどが公開サーバー上に存在しないため、攻撃対象を大きく減らすことができます。
もちろん、静的サイトだから絶対に安全というわけではありません。ただ、WordPressを公開環境で直接動かしている場合に比べると、管理画面への不正アクセス、プラグインの脆弱性、PHP実行環境に起因するリス クなどを減らせます。
小規模なサイトや更新頻度がそこまで高くないサイトでは、この構成はかなり現実的だと感じています。
デメリットもある
一方で、公開サーバー側にWordPressがないことによるデメリットもあります。
たとえば、WordPressのプラグインに依存していたお問い合わせフォームやアクセス数のカウントなどは、そのままでは使えません。
お問い合わせフォームはGoogleフォームや外部サービスを使う、アクセス解析はGoogle Analyticsなどを使う、といった代替手段が必要になります。
また、記事を更新したら毎回ビルドしてアップロードする必要があります。WordPressだけで完結していた頃に比べると、更新フローは少しエンジニア寄りになります。
今後の課題
現在の課題は、デザイン面です。
AIを使うことで、一定の見た目まではかなり速く作れます。ただ、そこから先の「洗練されたデザイン」に到達するには、余白、文字サイズ、情報設計、配色、写真やビジュアルの使い方などを、もっと丁寧に詰め ていく必要があります。
今の状態は、まだAIが提案したデザインの範囲を抜け出せていない部分があります。
今後は、ただ動くサイトではなく、見た目の完成度や読みやすさ、ブランドとしての印象も含めて改善していきたいと考えています。
まとめ
今回、WordPressで運用していたサイトを、wp-json を使ったヘッドレスCMS構成に移行しました。
ローカルではWordPressを記事管理用に使い、公開側はNuxt.jsで生成した静的サイトとして配信しています。さらにCodexを使うことで、AIと一緒に実装を進める開発スタイルも試すことができました。
公開サーバーからWordPressを削除できたことで、セキュリティ面ではかなりシンプルな構成になりました。
一方で、お問い合わせやアクセス数カウントなど、WordPressの動的機能に頼っていた部分は別の方法で補う必要があります。
今後は、AIを活用しながらも、より人の手で細部を磨き込み、サイト全体の完成度を上げていきたいと思います。
