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
740
ログラスを支える設計標準について / loglass-design-standards
urmot
12
2.6k
ログラスを支える技術的投資の仕組み / loglass-technical-investment
urmot
10
5.7k
実践!CloudFormation Best Practice ~CloudFormationで始める組織改革~
urmot
2
3.1k
CircleCIを導入した話
urmot
0
61
実践!CloudFormation Best Practice
urmot
0
170
RDBのログを取る時にDMSを使うという選択肢
urmot
0
93
ベンチャー企業のインフラを運用して学んだ99のこと
urmot
0
1.1k
Other Decks in Technology
See All in Technology
小学3年生夏休みの自由研究「夏休みに Copilot で遊んでみた」
taichinakamura
0
150
なぜCodeceptJSを選んだか
goataka
0
160
Qiita埋め込み用スライド
naoki_0531
0
5.1k
UI State設計とテスト方針
rmakiyama
2
590
PHPからGoへのマイグレーション for DMMアフィリエイト
yabakokobayashi
1
170
AWS re:Invent 2024で発表された コードを書く開発者向け機能について
maruto
0
190
コンテナセキュリティのためのLandlock入門
nullpo_head
2
320
あの日俺達が夢見たサーバレスアーキテクチャ/the-serverless-architecture-we-dreamed-of
tomoki10
0
460
サービスでLLMを採用したばっかりに振り回され続けたこの一年のあれやこれや
segavvy
2
430
サーバレスアプリ開発者向けアップデートをキャッチアップしてきた #AWSreInvent #regrowth_fuk
drumnistnakano
0
190
watsonx.ai Dojo #5 ファインチューニングとInstructLAB
oniak3ibm
PRO
0
160
サイボウズフロントエンドエキスパートチームについて / FrontendExpert Team
cybozuinsideout
PRO
5
38k
Featured
See All Featured
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
226
22k
How To Stay Up To Date on Web Technology
chriscoyier
789
250k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
356
29k
Docker and Python
trallard
42
3.1k
We Have a Design System, Now What?
morganepeng
51
7.3k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
159
15k
The Invisible Side of Design
smashingmag
298
50k
A better future with KSS
kneath
238
17k
The Cult of Friendly URLs
andyhume
78
6.1k
GraphQLとの向き合い方2022年版
quramy
44
13k
A Modern Web Designer's Workflow
chriscoyier
693
190k
Scaling GitHub
holman
458
140k
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ͷΫϨδοτ͕͑Δ
• ΫϨδοτҰؒ༗ޮ
͋Γ͕ͱ͏͍͟͝·ͨ͠ʂ