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
結婚式WEB招待状をAWSリソースでサクッと自作した話
Search
Toru Takahashi
January 21, 2024
1
1k
結婚式WEB招待状をAWSリソースでサクッと自作した話
JAWS-UG東京 ランチタイムLT会 #7
https://www.youtube.com/live/ArNrkwlw2MQ?si=MbWTM964eJdUoq-5&t=1485
Toru Takahashi
January 21, 2024
Tweet
Share
More Decks by Toru Takahashi
See All by Toru Takahashi
Amplify製アプリケーションにパスキー認証を導入する
tttol
1
92
Virtual Threadsで実現する性能改善
tttol
1
1.4k
私がAWS Amplifyを使う理由
tttol
1
340
AWS Community Builder流:技術情報のインプット・アウトプット戦略
tttol
1
550
Amplifyで開発・運用している 個人開発アプリ紹介
tttol
0
540
AmplifyにCDKがやってきた_プレビュー版のAmplify_Gen2を触ってみた.pdf
tttol
1
740
個人開発はAmplifyでホスティングしよう
tttol
0
810
ChatGPTとCIパイプラインを利用してドキュメント作成作業を自動化した話
tttol
0
1.8k
Featured
See All Featured
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
49
2.3k
Learning to Love Humans: Emotional Interface Design
aarron
273
40k
Designing for Performance
lara
604
68k
Making Projects Easy
brettharned
116
6k
Fantastic passwords and where to find them - at NoRuKo
philnash
51
3k
The Cost Of JavaScript in 2023
addyosmani
47
7.4k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
133
33k
The Power of CSS Pseudo Elements
geoffreycrofte
75
5.5k
Visualization
eitanlees
146
15k
How STYLIGHT went responsive
nonsquared
98
5.4k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
46
2.3k
Faster Mobile Websites
deanohume
306
31k
Transcript
結婚式WEB招待状を AWSリソースでサクッと 自作した話 NRIネットコム株式会社 髙橋 透 2024/01/22 JAWS-UG東京 ランチタイムLT会 #7
自己紹介 名前:髙橋 透 所属:NRIネットコム株式会社 やってること: • Webアプリバックエンド処理実装 (Java) • EC2, ECS,
S3, SES等を使ったあれこれ • PJの進捗管理、チームメンバーのコードレ ビュー等 持ってるAWS資格:SAA
TL;DR • 結婚式にお金がかかりすぎるので招待状を自作 することにした • 招待状はWEBページでもOKらしいので自作 HTMLをCloudFrontで配信することにした • Route53, ACM,
CloudFront, S3を使って配信 することで節約できた
結婚式は お金がかかる!!!
結婚式はお金がかかる!!! 結婚式の費用は平均200〜300万円 会場、食事、カメラマン、引出物、お車代etc… 参列者に送付する招待状は数百円 ✕ 人数 (紙の招待状/WEBページの招待状)
WEB招待状のイメージ
WEB招待状自作して CloudFrontで 配信できるのでは🤔
None
やったこと 1. Route 53でドメイン取得 2. ACMでSSL証明書を発行 3. Route 53でDNSレコードを登録(CNAMEレコード) 4.
S3バケットを新設してHTMLをアップロード 5. CloudFrontディストリビューションを作成し、S3バケット&ドメインを紐付ける
1.Route 53でドメイン取得 • Route53で取得するドメインには、ドメインの人気度によって価格が変わる • 人気で高価なドメイン ◦ xxxx.com / $13
◦ xxx.jp / $90 • 安価なドメイン ◦ xxx.link / $5 • 詳細はこちら(Route53の公式doc) ◦ https://d32ze2gidvkk54.cloudfront.net/Amazon_Route_53_Domain_Registration_Pricing_2014 0731.pdf
2.ACMで証明書発行 • ACM=AWS Certificate Manager ◦ 証明書管理サービス • リンクをHTTPS化するためにACMでSSL証明書を発行して紐付ける •
ここで発行した証明書の情報を手順3のRoute53で設定する SSL 証明書
3.Route 53でDNSレコードを登録(CNAMEレコード) • 取得したドメインはRoute53に自動でレコード登録される • しかしCloudFrontで配信するためにはCNAMEレコードの登録が必要 ※NS, SOAレコード等は割愛。これらもRoute53側で自動登録される。 レコード 説明
A • IPアドレスとドメインを1対1で紐づけ • ドメイン取得時に自動登録される • ex) hoge.link CNAME • 正規ドメインに紐付けるサブのドメイン • ex) www.hoge.link
CNAMEレコード Aレコード
4.S3バケットを新設してHTMLをアップロード • ドメイン名と同名のバケット作成 ◦ wwwはバケット名から除く • index.htmlをアップロード • S3 ->
プロパティ ◦ 静的サイトホスティングを有効にする ◦ パブリックアクセスブロックを OFFにする • バケットポリシーでアクセス許可 VS Code, Microsoft, https://azure.microsoft.com/ja-jp/products/visual-studio-code index.html error.html
5.CloudFrontディストリビューションを作成し、S3バケット&ドメ インを紐付ける • オリジンにS3のウェブサイトエンドポイントを指定 • カスタムSSL証明書にACMで発行したものを指定 • 代替ドメイン名(CNAME)にwww付きのドメインを指定 • WAF保護ON
【結果】 Route53:$5 CloudFront:$8 ---------------------------------- TOTAL : $13 (≒¥1800)
ご清聴ありがとうございました