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
SPA on AWS
Search
urmot
January 18, 2019
Technology
0
170
SPA on AWS
urmot
January 18, 2019
Tweet
Share
More Decks by urmot
See All by urmot
DDDにおける認可の扱いとKotlinにおける実装パターン / authorization-for-ddd-and-kotlin-implement-pattern
urmot
4
690
ログラスを支える設計標準について / loglass-design-standards
urmot
12
2.6k
ログラスを支える技術的投資の仕組み / loglass-technical-investment
urmot
10
5.6k
実践!CloudFormation Best Practice ~CloudFormationで始める組織改革~
urmot
2
3.1k
CircleCIを導入した話
urmot
0
57
実践!CloudFormation Best Practice
urmot
0
160
RDBのログを取る時にDMSを使うという選択肢
urmot
0
89
ベンチャー企業のインフラを運用して学んだ99のこと
urmot
0
1.1k
Other Decks in Technology
See All in Technology
New Relicを活用したSREの最初のステップ / NRUG OKINAWA VOL.3
isaoshimizu
3
620
SRE×AIOpsを始めよう!GuardDutyによるお手軽脅威検出
amixedcolor
0
170
IBC 2024 動画技術関連レポート / IBC 2024 Report
cyberagentdevelopers
PRO
1
110
オープンソースAIとは何か? --「オープンソースAIの定義 v1.0」詳細解説
shujisado
9
1.1k
誰も全体を知らない ~ ロールの垣根を超えて引き上げる開発生産性 / Boosting Development Productivity Across Roles
kakehashi
1
230
Exadata Database Service on Dedicated Infrastructure(ExaDB-D) UI スクリーン・キャプチャ集
oracle4engineer
PRO
2
3.2k
SREが投資するAIOps ~ペアーズにおけるLLM for Developerへの取り組み~
takumiogawa
1
420
Adopting Jetpack Compose in Your Existing Project - GDG DevFest Bangkok 2024
akexorcist
0
110
Amplify Gen2 Deep Dive / バックエンドの型をいかにしてフロントエンドへ伝えるか #TSKaigi #TSKaigiKansai #AWSAmplifyJP
tacck
PRO
0
390
ドメインの本質を掴む / Get the essence of the domain
sinsoku
2
160
なぜ今 AI Agent なのか _近藤憲児
kenjikondobai
4
1.4k
OCI Vault 概要
oracle4engineer
PRO
0
9.7k
Featured
See All Featured
What’s in a name? Adding method to the madness
productmarketing
PRO
22
3.1k
How to train your dragon (web standard)
notwaldorf
88
5.7k
Rails Girls Zürich Keynote
gr2m
94
13k
GitHub's CSS Performance
jonrohan
1030
460k
A better future with KSS
kneath
238
17k
Facilitating Awesome Meetings
lara
50
6.1k
GraphQLとの向き合い方2022年版
quramy
43
13k
Designing the Hi-DPI Web
ddemaree
280
34k
Put a Button on it: Removing Barriers to Going Fast.
kastner
59
3.5k
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
364
24k
Intergalactic Javascript Robots from Outer Space
tanoku
269
27k
Transcript
SPA on AWS - Free Web Site Hosting - 2019.01.18
Netadashi Meetup #8 @urmot
ಥવͰ͕͢ɺ
ݸਓ։ൃͯ͠·͔͢ʁ
ࠓ͓͢Δ༰ • SPAͰαʔϏεӡ༻͢Δ͓ • ߏͷ͝આ໌ • ྉۚͷ͓
SPAͰαʔϏεӡ༻͢Δ
Ұલ͘Β͍͔Βɺ WebαʔϏεͷӡ༻Λ։࢝
None
WebອըΛ·ͱΊΔαΠτ • WebອըͷͷϦϯΫΛ·ͱΊͨαΠτ • CrawlerΛͬͯϦϯΫΛऩू • React + ReduxͰSPA •
APIServerlessͰExpress
ߏͷ͝આ໌
None
None
SPA৴෦ • CloudFront + S3 • ಠࣗυϝΠϯͰSSLʹରԠ • CDNͰߴʹ҆ఆͯ͠৴ •
SSRະ࣮
SPA৴෦ • σϓϩΠ؆୯ 1. JSΛbuild 2. S3ʹΞοϓϩʔυ 3. CloudFrontͷΩϟογϡΛΫϦΞ
SPA+CloudFrontͷҙ • ϧʔτύε(/)Ҏ֎ͰϦϩʔυ͞Εͨࡍʹ404 • 404ͷ࣌ʹindex.htmlΛฦ͢Α͏ʹ͢Δ • CloudFrontͷError PagesͰઃఆՄೳ
None
APIαʔό෦ • API Gateway + Lambda + DynamoDBͰߏ • Lambda্ͰExpressΛ࣮ߦ
• aws-serverless-expressͰ࣮ • ৄͪ͘͜͠ΒͷهࣄΛࢀর
SPA+Lambdaͷҙ • Lambdaίʔϧυελʔτ • ϦΫΤετ͕ͳ͍ͱίϯςφ͕མͪΔ • ίϯςφͳ͍߹ɺॳظԽॲཧ͕Δ • ॳظԽॲཧͷϨΠςϯγ͕ͳ͍
Lambdaίʔϧυελʔτରࡦ • LambdaΛϗοτελϯόΠ͓ͯ͘͠ • CloudWatch EventsͰLambdaΛఆظ࣮ߦ • (ϦΫΤετ్͕ઈ͑ͳ͍ఔΞΫηεΛՔ͙)
ྉۚͷ͓
None
໊͓લ.comͷ1ԁυϝΠϯʂ
None
CloudFrontͷྉۚମܥ • Πϯλʔωοτͷσʔλసૹ (GB୯Ґ) • ΦϦδϯͷσʔλసૹ (GB୯Ґ) • HTTP/HTTPSϝιουϦΫΤετ (1ສ݅୯Ґ)
CloudFrontͷྉۚମܥ • Πϯλʔωοτͷσʔλసૹ (GB୯Ґ) • ΦϦδϯͷσʔλసૹ (GB୯Ґ) • HTTP/HTTPSϝιουϦΫΤετ (1ສ݅୯Ґ)
CloudFrontͷྉۚମܥ • HTTP/HTTPSϝιουϦΫΤετ (1ສ݅୯Ґ) ຊ ؖࠃ γϯΨϙʔϧ ถࠃ )551
)5514
CloudFrontͷྉۚମܥ • HTTP/HTTPSϝιουϦΫΤετ (1ສ݅୯Ґ) • ྫ: 100ສHTTPSϦΫΤετ (ຊ) • $0.012
* 100ສ / 1ສ = $1.2
None
DynamoDBͷྉۚମܥ • σʔλετϨʔδ (GB୯Ґ) • ಡΈࠐΈ/ॻ͖ࠐΈϦΫΤετ (1KB/sec)
DynamoDBͷྉۚମܥ • σʔλετϨʔδ (GB୯Ґ) • ຖ݄ɺ࠷ॳͷ25GBͷอແྉ • 25GBҎ߱$0.285/month
DynamoDBͷྉۚମܥ • ಡΈࠐΈ/ॻ͖ࠐΈϦΫΤετ (1KB/sec) ,#ͷ࣌ؒ͋ͨΓͷྉۚ ಡΈࠐΈ ॻ͖ࠐΈ
DynamoDBͷྉۚମܥ • ಡΈࠐΈ/ॻ͖ࠐΈϦΫΤετ (1KB/sec) • ຖ݄ɺ25[req/sec]͕ແྉ • 2ԯ݅ͷϦΫΤετॲཧʹेͳ༰ྔ
·ͱΊ
؆୯ʹαʔϏεΛ࡞ΕΔ࣌ • εέʔϥϒϧ͔ͭίετ • NetlifyͳͲ੩త৴ಛԽαʔϏεग़͍ͯΔ • AWSҰ݁ߏແྉͰ͑Δ
ཪٕ
AWS Promotional Credit for Alexa • Alexa SkillΛҰͭ࡞ͬͯެ։͢Δ • AWSͷ$100ͷΫϨδοτ͕͑Δ
• ΫϨδοτҰؒ༗ޮ
͋Γ͕ͱ͏͍͟͝·ͨ͠ʂ