ふるさと納税ECサイトを Vue 3 へ刷新、技術的SEO改善とAWSコスト削減

大手ふるさと納税サイトの、レガシー化したフロントエンドとインフラを刷新。Vue 2 から Vue 3 へのモダナイズを軸に、技術的なSEO改善と AWS インフラの最適化までを一貫して担いました。

課題

長年の運用でフロントエンドは Vue 2 のまま肥大化し、コンポーネントの見通しや保守性が低下していました。機能追加や改善のたびに影響範囲が読みにくく、開発スピードが落ちていた状態です。加えて、検索流入がサイトの生命線でありながら表示速度やマークアップ面で技術的なSEOの改善余地が大きく、AWS のインフラコストも年々肥大化していました。フロントエンド・SEO・インフラの三つを、同時に立て直す必要がありました。

取り組み

まずフロントエンドを Vue 2 から Vue 3 へバージョンアップし、依存ライブラリやビルド環境もモダンな構成へ刷新。肥大化していたコンポーネントを整理・再設計し、保守性と開発スピードを取り戻しました。並行して、エンジニア視点から表示速度・レンダリング・サイト構造といった技術的なSEO施策を提案・実装し、効果を計測しながら高速に PDCA を回せる体制を構築。さらに AWS のインフラ構成を見直し、リソースの最適化によってランニングコストを継続的に圧縮しました。

成果

レガシー化していたシステムをモダンな Vue 3 ベースへ刷新したことで、以降の機能追加・改善に強い土台が整いました。技術的SEOとインフラ最適化を同時に進めた結果、集客の要である検索流入と、月々のランニングコストの両面で成果につながっています。

• フロントエンドを Vue 2 から Vue 3 へ移行し、技術スタックをモダン化
• コンポーネントの再設計により、保守性と開発スピードが向上
• 表示速度・サイト構造など技術的SEOの改善で、検索流入の増加に貢献
• AWSインフラコストを継続的に削減
• 効果を計測しながら改善を回せる、継続的な運用体制を整備

支援概要