Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
20240906_JAWS_Yamanashi
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
Takuya Yonezawa
September 04, 2024
Technology
150
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
20240906_JAWS_Yamanashi
Takuya Yonezawa
September 04, 2024
More Decks by Takuya Yonezawa
See All by Takuya Yonezawa
20260516_SecJAWS_Days
takuyay0ne
4
800
20260422_Midosuji_Tech
takuyay0ne
2
85
脱 雰囲気実装!AgentCoreを良い感じにWEBアプリケーションに組み込むために
takuyay0ne
3
580
20260228_JAWS_Beginner_Kansai
takuyay0ne
5
710
20260204_Midosuji_Tech
takuyay0ne
1
240
20260129_CB_Kansai
takuyay0ne
1
370
20260126_JAWS_Osaka
takuyay0ne
1
64
こんな時代だからこそ! 想定しておきたいアクセスキー漏洩後のムーブ
takuyay0ne
4
810
セキュリティは全員参加!_JAWSのイベントサイトで脅威モデリングを学んでみよう!
takuyay0ne
0
220
Other Decks in Technology
See All in Technology
AI時代のPlaywright活用(システムテストを自動化する ー 実行エンジンにPla ywrightを選んだ理由)
ynisqa1988
1
680
壊して学ぶAWS CDK: そのcdk deployで消えるもの、残るもの
k_adachi_01
1
430
インシデント事例と パッケージの全量解析に学ぶ ソフトウェアサプライチェーンの守り方 / supply-chain-attack-defense
flatt_security
0
150
実践!既存 Project への AI-Driven Development 適用〜 一ヶ月で Project 唯一のフロントエンドエンジニアを作り出せ〜
lycorptech_jp
PRO
0
250
AI Native なプロダクト組織の立ち上げ方 : 生産性 100 倍への挑戦
mikesorae
0
230
AI時代の開発生産性を捉え直す — 経営と現場をつなぐ「開発組織のオブザーバビリティ」— / AI Dev Ex Conference 2026
tkyowa
0
190
プロダクト開発組織の現在地(Ver.2026/07) / product-organization
kaonavi
0
120
[2026-07-15] AI Ready なはずだったアーキテクチャと、見えてきた課題・次に目指す状態
wxyzzz
10
4k
生成AI×AWS CDK×AWS FISで"振り返れる"ミニGameDayをつくろう
yoshimi0227
1
440
Oracle Exadata Database Service on Cloud@Customer X11M (ExaDB-C@C) サービス概要
oracle4engineer
PRO
2
8.4k
ruby.wasmとPicoRuby.wasmに対応した仮想DOMライブラリを作ってる話 #kaigieffect_kaigi
sue445
PRO
0
150
AI Coding Agent時代のcdk-nagガードレール 〜組織ルールを強制CIで守り抜く設計の挑戦〜
mhrtech
3
440
Featured
See All Featured
How to Align SEO within the Product Triangle To Get Buy-In & Support - #RIMC
aleyda
2
1.7k
How to make the Groovebox
asonas
2
2.3k
It's Worth the Effort
3n
188
29k
What the history of the web can teach us about the future of AI
inesmontani
PRO
1
640
Designing Powerful Visuals for Engaging Learning
tmiket
1
450
StorybookのUI Testing Handbookを読んだ
zakiyama
31
6.8k
Dominate Local Search Results - an insider guide to GBP, reviews, and Local SEO
greggifford
PRO
0
210
HU Berlin: Industrial-Strength Natural Language Processing with spaCy and Prodigy
inesmontani
PRO
0
540
Ethics towards AI in product and experience design
skipperchong
2
330
Dealing with People You Can't Stand - Big Design 2015
cassininazir
367
27k
Self-Hosted WebAssembly Runtime for Runtime-Neutral Checkpoint/Restore in Edge–Cloud Continuum
chikuwait
0
650
Between Models and Reality
mayunak
4
370
Transcript
1 © 2024 Japan Digital Design, Inc. Takuya Yonezawa 2024.09.06
JAWS-UG 山梨 第1回 コミュニティイベントを支えるサーバレス
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 \ 買ってェ/
3 © 2024 Japan Digital Design, Inc. Japan Digital Design株式会社
2017年10月2日 代表取締役 CEO 浜根 吉男 79名(2024年3月時点) 株式会社三菱UFJフィナンシャル・グループ 株式会社三菱総合研究所 三菱UFJリサーチ&コンサルティング株式会社 社名 設立 代表者 従業員数 株主構成 会社概要
4 © 2024 Japan Digital Design, Inc. はじめに ここ1年で2つほどJAWSイベントの ティザーサイトを構築・運用しています
5 © 2024 Japan Digital Design, Inc. JAWS DAYS 2024
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/
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で自動化
8 © 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
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 今の状態を少しご紹介
10 © 2024 Japan Digital Design, Inc. JAWS DAYS 2024
〜あのWEBサイトは今〜 CloudFrontへのリクエスト数 CloudFrontへの Upload/Download(MB) 平均 6000 requests/day 平均 200MB download/day 平均 0MB upload/day
11 © 2024 Japan Digital Design, Inc. JAWS DAYS 2024
〜数値的なお話〜 もうWEBサイトの更新予定が一切ないため、 キャッシュポリシーで TTL : 3153600000秒 = 100年 を設定して文鎮化 ※ 本当にキャッシュが100年保持されるかは寿命の関係上検証できないので分かりません← CloudFrontのキャッシュポリシー
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の利用料が急増した場合のチェックポイント
13 © 2024 Japan Digital Design, Inc. JAWS PANKRATION 2024
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
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対策の ために設置 コスト削減のために ライフサイクルポリシーも適用
16 © 2024 Japan Digital Design, Inc. (2024/05 ~ 2024/08)
246 commit コミット数 本番リリース回数 約80 deploy (2024/05 ~ 2024/08) 月額トータルコスト 14 USD (2024/08,環境1面+もろもろ) JAWS PANKRATION 2024 〜数値的なお話〜 たぶん
17 © 2024 Japan Digital Design, Inc. JAWS PANKRATION 2024
〜データで振り返る〜 App Runnerへのリクエスト数 App Runnerコンテナインスタンス数(min:1, max:25) イベント当日(8/23~24)に急増
18 © 2024 Japan Digital Design, Inc. JAWS PANKRATION 2024
〜データで振り返る〜 WAFでブロックされていたリクエストの内訳 下記の2ルールでの運用結果 ① AWSManagedRulesAmazonIpReputationList ② AWSManagedRulesCommonRuleSet
19 © 2024 Japan Digital Design, Inc. JAWS PANKRATION 2024
〜データで振り返る 〜 \ 結局ほぼAttackは来なかった / (..と 同時に治安の良さに感動しました)
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剥がし)
21 © 2024 Japan Digital Design, Inc. あらためて なんでサーバレスを 駆使して楽をしたいか??
22 © 2024 Japan Digital Design, Inc. 下記はイベントで WEB構築以外にやることの一例 イベントってやることがメチャ多い
• リスク管理方針の策定 • 当日ボランティアスタッフの オペレーション/シフト策定 • ノベルティのデザイン/発注 • 会場設備の設営・レイアウト決め • CfP選定→セッション割作成 • 個人/企業スポンサー対応 • 懇親会のプランニング, 飲食物発注 • (他にもたくさん) リスク管理方針(これはごく一部)
23 © 2024 Japan Digital Design, Inc. 下記はイベントで WEB構築以外にやることの一例 イベントってやることがメチャ多い
• リスク管理方針の策定 • 当日ボランティアスタッフの オペレーション/シフト策定 • ノベルティのデザイン/発注 • 会場設備の設営・レイアウト決め • CfP選定→セッション割作成 • 個人/企業スポンサー対応 • 懇親会のプランニング, 飲食物発注 • (他にもたくさん) ノベルティ手配 参加者向け当日案内
24 © 2024 Japan Digital Design, Inc. 下記はイベントで WEB構築以外にやることの一例 イベントってやることがメチャ多い
• リスク管理方針の策定 • 当日ボランティアスタッフの オペレーション/シフト策定 • ノベルティのデザイン/発注 • 会場設備の設営・レイアウト決め • CfP選定→セッション割作成 • 個人/企業スポンサー対応 • 懇親会のプランニング, 飲食物発注 • (他にもたくさん) イベント用サメロゴ制作
25 © 2024 Japan Digital Design, Inc. なんでサーバレスを採用して楽をしたいのか? 運営メンバーの人的リソースも有限なので、 サボれるところはサボって別タスクをやりたい
実際米澤もWEBサイト開発以外に、 スポンサー対応、セッション準備、懇親会準備など、様々なタスクを拾っていました ちなみにJAWSのサイト構築は、 それなりのトラフィックが約束されたWEBサイトをスクラッチで作れる体験かつ、 バグったり止まったりしてもメチャクチャ怒られないので良いスキルアップになります
26 © 2024 Japan Digital Design, Inc. さいごにお伝えしたいこと “Design with
Ops in Mind” システムを構築した際にどんな運用が必要になるのか? を常に考慮しましょう
Thank you. 27 © 2024 Japan Digital Design, Inc.