CloudFront×AmazonS3環境にランディングページを移行して運用を最適化してみた
アイミツ開発チームでエンジニアリングをしている deliku です！
スプラトゥーン3 新シーズン開幕しましたねー、ポケモンSVもまだ終わっていないので、ゲームする時間をいかに捻出するか毎日困っています。（だいたい睡眠時間を削ってやっています）
▶︎ 今回の話
アイミツでは、広告経由でアイミツサイトに訪れるユーザ向けにランディングページを運用しています。今回はランディングページの運用を最適化するために、Amazon S3にランディングページを移行した話となります。
▶︎ ランディングページとは？
ランディングページは潜在顧客が広告や検索結果をクリックした際に表示されるウェブページである。ここでは通常、広告やリンクについてより詳細に書かれたコンテンツが表示される。ランディングページ最適化では、ターゲットとなる閲覧者に向けてより訴えかけるコンテンツやビジュアルをページ上で提供することを目的としている。
▶︎ 課題
ランディングページを運用していたチーム（マーケティング部）は、ランディングページを新規作成 / 更新したい場合、スクラムのフローに沿う必要があったため、自チームで作業が完結できませんでした。
これにより調整コストや、依頼してからタスクが開始されるのを待つ時間が発生するなど、現状の方法ではスピーディーにPDCAをまわすことが難しいという課題が浮かび上がってきました。
▶︎ 解決方法
Amazon S3の静的ウェブサイトホスティング機能を利用します。これにCloudFrontを組み合わせることで、特定のパスをS3に向けることができます。
▶︎ 設定手順
作業自体はシンプルですが、権限や公開ポリシーは限定的になるよう考慮して設定しています。
1. 【S3】ランディングページの構成コンテンツを設置するS3バケット作成
2. 【IAM】S3のみ操作可能なポリシー作成
3. 【IAM】IAMユーザにS3のみ操作可能なポリシー適用して作成
4. 【CloudFront】利用するディストリビューションにランディングページ用のS3バケットを指定したオリジンを作成
5. 【CloudFront】ランディングページのリクエストパスをパスパターンに、先ほど作成したオリジンを適用したビヘイビアを作成
▶︎ 結果
下記図のように、自チームで運用が完結できるようになり無事課題を解消することができました。
▶︎ 振り返り
最初からアイミツシステム上にランディングページを設置せず、この仕組みを構築すれば良かったのかを考えると、システムのアーキテクチャは極力シンプルにしたほうが良い（考える変数を減らすという意味です）というのが私のなかであります。
ランディングページを運用してみて "実際は更新頻度が少なかった" もしくは "思っていたほど手間でなかった" という場合、この構成にする必要がないためです。
課題に対して手段が複数ある場合、総合的なメリット / デメリットを考え、チームに共有しその時点での最適解を常に選択できるようにありたいと思います。
▶ 【PR】ユニラボ に興味がある方へ
今回の記事を読んでユニラボに興味を持っていただけた方は、まずはカジュアル面談でざっくりお話させていただければと思います！
この記事が気に入ったらサポートをしてみませんか？