ヘッドレスWordPress × Next.js 事例管理基盤

案件事例やブログなど構造化コンテンツの更新頻度が高く、表示速度・SEOを重視するWeb担当者様・事業者様

案件事例やブログ記事のような構造化されたコンテンツを、コードを触らずに更新できる仕組みが欲しい。かつ、表示側はNext.jsのパフォーマンス・開発体験を維持したい。

WordPressをヘッドレスCMSとして採用し、カスタム投稿タイプ「事例（case_study）」とカスタムタクソノミー「技術スタック（tech_stack）」を設計。表示側はNext.js（App Router）で構築し、REST API経由でコンテンツを取得することで、コンテンツ更新の柔軟性とフロントエンドのパフォーマンス・開発体験を両立する構成を提案した。

• →WordPressプラグインとしてカスタム投稿タイプ・カスタムタクソノミーをREST API公開込みで登録（register_post_type / register_taxonomy / register_post_meta）
• →成果指標（result_summary）をカスタムフィールドとして追加し、REST APIレスポンスに技術タグ名の配列を含めるフィルタを実装
• →Next.js（App Router）側でISR（60秒キャッシュ）を使い、WordPress REST APIから一覧・詳細ページを取得・表示
• →Docker Compose + wp-cliで環境構築を完全自動化し、docker compose up -d だけでWordPress・MySQL・サンプルデータ投入まで完了する構成に

環境設計〜実装〜動作確認まで1日

• ✓コード変更なしにコンテンツ更新が可能な基盤を構築
• ✓Docker Composeによる自動セットアップで、環境構築の再現性を担保