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
150
SPA on AWS
urmot
January 18, 2019
Tweet
Share
More Decks by urmot
See All by urmot
ログラスを支える設計標準について / loglass-design-standards
urmot
11
2.2k
ログラスを支える技術的投資の仕組み / loglass-technical-investment
urmot
10
5.3k
実践!CloudFormation Best Practice ~CloudFormationで始める組織改革~
urmot
2
2.9k
CircleCIを導入した話
urmot
0
54
実践!CloudFormation Best Practice
urmot
0
120
RDBのログを取る時にDMSを使うという選択肢
urmot
0
78
ベンチャー企業のインフラを運用して学んだ99のこと
urmot
0
1k
Other Decks in Technology
See All in Technology
プロンプトエンジニアリングでがんばらない-Agentic Workflow へ-近藤憲児
kenjikondobai
6
1.3k
GrafanaMeetup_AmazonManagedGrafanaのアクセス制御機能とマルチテナント環境下でのアクセス制御について
daitak
0
470
中年男性がメインフレームから クラウドへキャリアシフトしてみた
uechishingo
1
430
本当のガバクラ基礎
toru_kubota
0
230
高専で制御を、大学でセンシングを学び、次は脳みそ
satoshirobatofujimoto
0
120
生成AIの変革の時代に、直近1年で直面した課題とその解決策
ktc_wada
1
790
Secrets of a PowerShell "Guru"
guyrleech
1
110
Grafana x PagerDuty Better Together
jacopen
1
340
TailwindCSSでUIライブラリを作る際のハマりどころ
shuta13
0
100
2024春 注目のWeb系 OSS & SaaS 3選
makies
0
210
CockroachDB はどのくらい「しぶとい」のか? / How tough is CockroachDB?
kota2and3kan
6
3.9k
同じ様なUIをiOS/Android間で合わせるヒントNo.2
fumiyasac0921
1
110
Featured
See All Featured
How To Stay Up To Date on Web Technology
chriscoyier
782
250k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
352
28k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
0
46
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
41
4.4k
The Invisible Side of Design
smashingmag
294
49k
Git: the NoSQL Database
bkeepers
PRO
423
63k
Building an army of robots
kneath
300
41k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
358
22k
Infographics Made Easy
chrislema
238
18k
StorybookのUI Testing Handbookを読んだ
zakiyama
13
4.6k
The Pragmatic Product Professional
lauravandoore
26
5.8k
Principles of Awesome APIs and How to Build Them.
keavy
121
16k
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ͷΫϨδοτ͕͑Δ
• ΫϨδοτҰؒ༗ޮ
͋Γ͕ͱ͏͍͟͝·ͨ͠ʂ