20240906_JAWS_Yamanashi

Slide 1

Slide 1 text

Slide 2

Slide 2 text

2 © 2024 Japan Digital Design, Inc. 米澤拓也 Software Engineer Technology & Development Div. 前職ではCCoE、現職ではSoftware Engineer フロント/バックエンドの実装からインフラ構築など何でもやってます JAWS DAYS2024 / PANKRATION2024 の運営（WEB担当） Fin-JAWSも運営やってます会社有志で技術書典に出店したりなど好きなAWSサービスは CloudFront、Lambda プロフィール @CDK Conference 2024 ＼買ってェ／

Slide 3

Slide 3 text

Slide 4

Slide 4 text

Slide 5

Slide 5 text

Slide 6

Slide 6 text

6 © 2024 Japan Digital Design, Inc. JAWS DAYS 2024 • 5年ぶりのオフライン開催＠池袋 • スポンサー募集瞬殺劇など、様々なドラマが繰り広げられた • 従来無かったレスポンシブ対応や、お気に入り機能などを新規追加 • ＼極力コストを抑えろ／ JAWS DAYS 2024 CloudFront API Gateway S3 DynamoDB Lambda CDK 主要な登場人物画面イメージ実データはDynamoDB（News用/FollowUp用）に格納実データはDynamoDB（News用/FollowUp用）に格納 https://jawsdays2024.jaws-ug.jp/ https://jawsdays2024.jaws-ug.jp/

Slide 7

Slide 7 text

7 © 2024 Japan Digital Design, Inc. 基本に忠実なサーバレス構成 JAWS DAYS 2024 アーキ概略 AWS Cloud (Dev/Prod) CloudFront API Gateway S3 （WEB） Lambda （データ取得） CDK X-Ray DynamoDB （動的コンテンツ）その他 AWSリソース超ざっくり図 GitHub Actions ① 静的コンテンツのデプロイ ② CloudFrontのキャッシュクリア • Next.jsでSSGした静的コンテンツを S3+CloudFront経由で配信 • 動的に出したいコンテンツは API-GW+Lambda+DynamoDBで API化して都度取得（News/FollowUpなど） • リリース作業はすべて GitHubActionsで自動化

Slide 8

Slide 8 text

Slide 9

Slide 9 text

9 © 2024 Japan Digital Design, Inc. (2023/11 ~ 2024/03) 1113 commit コミット数本番リリース回数 134 deploy (2023/11 ~ 2024/03) 月額トータルコスト 1.1 USD (2024/07,環境2面＋もろもろ) JAWS DAYS 2024 〜数値的なお話〜 ※ 人件費はもちろん 0 USD 今の状態を少しご紹介

Slide 10

Slide 10 text

Slide 11

Slide 11 text

Slide 12

Slide 12 text

12 © 2024 Japan Digital Design, Inc. JAWS DAYS 2024 〜まとめ〜良かった点イマイチだった点超激安運用：CloudFrontの無料枠でWEBホスティングが完結スケーリングがほぼ考慮不要：CloudFront、S3、API-GW、Lambda 強し文鎮化が楽：CloudFrontのキャッシュいじるだけアプリケーション以外の作り物が多い：インフラのCDKコード、GitHub Actionsのワークフロー etc... 構成AWS要素が多い：Building Block的ではあるかも知れないが。。。【CloudFrontコストの参考記事】Amazon CloudFrontの利用料が急増した場合のチェックポイント

Slide 13

Slide 13 text

Slide 14

Slide 14 text

14 © 2024 Japan Digital Design, Inc. JAWS PANKRATION 2024 • 24時間ぶっ続けオンライン。あの狂気のイベントが帰ってきた！ • 登壇者/参加者は全世界 • DAYS2024のサイトをベースに、下記の追加機能を実装 - 国際化対応 (日本語/英語) - microCMSを用いた記事投稿機能 - NEWSのSNSシェア機能 - Bedrockによるセッションサマリ JAWS PANKRATION 2024 主要な登場人物画面イメージ https://jawspankration2024.jaws-ug.jp/en/ https://jawspankration2024.jaws-ug.jp/en/ https://jawspankration2024.jaws-ug.jp/jp/ https://jawspankration2024.jaws-ug.jp/jp/ App Runner ECR CDK 言語切り替えボタン AWS WAF

Slide 15

Slide 15 text

15 © 2024 Japan Digital Design, Inc. App Runnerはサーバレスです！ JAWS PANKRATION 2024 アーキ概略ホントにこれだけ • i18n/microCMS対応のために AWS App Runnerを採用 → 常時稼働のコンピュートリソースで WEBホスティングが必要になったという背景 • standaloneモードでビルドした SSR方式のNext.jsを利用 • GitHub ActionsではコンテナイメージをビルドしてECRにPush • お気持ち程度のCDK AWS Cloud (Prod) CDK App Runner ECR Secrets Manager 自動デプロイ GitHub Actions ビルドしたコンテナイメージをPush AWS WAF DoS/EDoS対策のために設置コスト削減のためにライフサイクルポリシーも適用

Slide 16

Slide 16 text

Slide 17

Slide 17 text

Slide 18

Slide 18 text

Slide 19

Slide 19 text

Slide 20

Slide 20 text

20 © 2024 Japan Digital Design, Inc. JAWS PANKRATION 2024 〜まとめ〜良かった点イマイチだった点 AWS環境のスリム化：LambdaやAPI-GW、DynamoDBが不要に CI/CDのスリム化：App Runnerの自動デプロイ機能に乗っかることで、 GitHub ActionsではコンテナイメージのBuild・Pushだけに DAYSと比べて高額： DoS対策の為にWAFも導入するとまあまあ高額（そもそもApp Runner自体も良いお値段。。） microCMSの採用：News投稿/編集はすべてMicroCMS操作で完結するため、データインサート作業やビルド作業が不要に（SPOF解消）文鎮化対応が面倒：近日苦労し始める予定（App Runner剥がし）

Slide 21

Slide 21 text

Slide 22

Slide 22 text

22 © 2024 Japan Digital Design, Inc. 下記はイベントで WEB構築以外にやることの一例イベントってやることがメチャ多い • リスク管理方針の策定 • 当日ボランティアスタッフのオペレーション/シフト策定 • ノベルティのデザイン/発注 • 会場設備の設営・レイアウト決め • CfP選定→セッション割作成 • 個人/企業スポンサー対応 • 懇親会のプランニング, 飲食物発注 • （他にもたくさん）リスク管理方針（これはごく一部）

Slide 23

Slide 23 text

23 © 2024 Japan Digital Design, Inc. 下記はイベントで WEB構築以外にやることの一例イベントってやることがメチャ多い • リスク管理方針の策定 • 当日ボランティアスタッフのオペレーション/シフト策定 • ノベルティのデザイン/発注 • 会場設備の設営・レイアウト決め • CfP選定→セッション割作成 • 個人/企業スポンサー対応 • 懇親会のプランニング, 飲食物発注 • （他にもたくさん）ノベルティ手配参加者向け当日案内

Slide 24

Slide 24 text

24 © 2024 Japan Digital Design, Inc. 下記はイベントで WEB構築以外にやることの一例イベントってやることがメチャ多い • リスク管理方針の策定 • 当日ボランティアスタッフのオペレーション/シフト策定 • ノベルティのデザイン/発注 • 会場設備の設営・レイアウト決め • CfP選定→セッション割作成 • 個人/企業スポンサー対応 • 懇親会のプランニング, 飲食物発注 • （他にもたくさん）イベント用サメロゴ制作

Slide 25

Slide 25 text

25 © 2024 Japan Digital Design, Inc. なんでサーバレスを採用して楽をしたいのか？運営メンバーの人的リソースも有限なので、サボれるところはサボって別タスクをやりたい実際米澤もWEBサイト開発以外に、スポンサー対応、セッション準備、懇親会準備など、様々なタスクを拾っていましたちなみにJAWSのサイト構築は、それなりのトラフィックが約束されたWEBサイトをスクラッチで作れる体験かつ、バグったり止まったりしてもメチャクチャ怒られないので良いスキルアップになります

Slide 26

Slide 26 text

Slide 27

Slide 27 text