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
AWS Amplify と Nuxt.js で始めるコンテナ生活
Search
Yuji Takayama
March 30, 2022
Technology
0
430
AWS Amplify と Nuxt.js で始めるコンテナ生活
at JAWS-UG 名古屋 コンテナを語ろう!! (2022-03-30)
Yuji Takayama
March 30, 2022
Tweet
Share
More Decks by Yuji Takayama
See All by Yuji Takayama
re:Invent で感じた AWS のメッセージ
swordbreaker
0
33
俺たちのプロトタイプ
swordbreaker
0
630
さぁ、ブログをはじめようどこで?どうやって?
swordbreaker
0
430
実践 Movable Type 7
swordbreaker
0
2.8k
できる Movable Type 7
swordbreaker
0
390
トフでもわかるコンテンツタイプ講座
swordbreaker
0
1.4k
Movable Type 7 のすべて
swordbreaker
2
1.5k
Other Decks in Technology
See All in Technology
20241220_S3 tablesの使い方を検証してみた
handy
3
320
re:Invent をおうちで楽しんでみた ~CloudWatch のオブザーバビリティ機能がスゴい!/ Enjoyed AWS re:Invent from Home and CloudWatch Observability Feature is Amazing!
yuj1osm
0
120
20241214_WACATE2024冬_テスト設計技法をチョット俯瞰してみよう
kzsuzuki
3
440
Amazon SageMaker Unified Studio(Preview)、Lakehouse と Amazon S3 Tables
ishikawa_satoru
0
150
Storage Browser for Amazon S3
miu_crescent
1
130
Microsoft Azure全冠になってみた ~アレを使い倒した者が試験を制す!?~/Obtained all Microsoft Azure certifications Those who use "that" to the full will win the exam! ?
yuj1osm
1
110
社内イベント管理システムを1週間でAKSからACAに移行した話し
shingo_kawahara
0
180
PHPからGoへのマイグレーション for DMMアフィリエイト
yabakokobayashi
1
160
NW-JAWS #14 re:Invent 2024(予選落ち含)で 発表された推しアップデートについて
nagisa53
0
250
AWS re:Invent 2024 ふりかえり
kongmingstrap
0
130
AIのコンプラは何故しんどい?
shujisado
1
190
KubeCon NA 2024 Recap: How to Move from Ingress to Gateway API with Minimal Hassle
ysakotch
0
200
Featured
See All Featured
Producing Creativity
orderedlist
PRO
341
39k
Building Better People: How to give real-time feedback that sticks.
wjessup
365
19k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
8
1.2k
Fireside Chat
paigeccino
34
3.1k
Statistics for Hackers
jakevdp
796
220k
How to Ace a Technical Interview
jacobian
276
23k
Building Adaptive Systems
keathley
38
2.3k
Fantastic passwords and where to find them - at NoRuKo
philnash
50
2.9k
How to Think Like a Performance Engineer
csswizardry
22
1.2k
Music & Morning Musume
bryan
46
6.2k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
28
9.1k
Fashionably flexible responsive web design (full day workshop)
malarkey
405
66k
Transcript
2022.3.30 - YUJI Takayama AWS AMPLIFY ͱ NUXT.JS Ͱ࢝ΊΔίϯςφੜ׆ JAWS-UG
໊ݹ ίϯςφΛޠΖ͏!!
τϨϊέʔτגࣜձࣾ ͔ͨ·ɹΏ͏͡ ߴࢁɹ༟࢘ )JTUPSZ ͔Β"84ೝఆΠϯετϥΫλʔʢ""*ʣͱͯ͠ "84ೝఆΫϥεϧʔϜτϨʔχϯάΛ୲ લ৬ɺγοΫεɾΞύʔτͰ.PWBCMF5ZQFͷ ϦʔυΤϯδχΞ݉ϓϩμΫτϚωʔδϝϯτΛ୲ 'BWPSJUF"844FSWJDFT "84-BNCEB
"84"NQMJGZ
ίϯςφͬͯ ࣗͰ࡞Δͷʁ
Introduction Contentful Nuxt.JS Nuxt.JS + Contentful Amplify Amplify + Nuxt.JS
+ Contentful Conclusion AWS AMPLIFY ͱ NUXT.JS Ͱ࢝ΊΔίϯςφੜ׆
ίʔεͰ͏ϦϯΫू ؆୯ʹαΠτߏஙɾӡ༻͍ͨ͠ [BEFORE] EC2 + ELB + Movable Type ->
S3 + CloudFront ੩తϑΝΠϧੜ࣌Ҏ֎্ཱͪ͛Δඞཁͳ͍ EC2 ࢭΊΔͱ ύϒϦοΫ IP มΘΔ͔Β ELB ཉ͍͠ ͰɺීஈΘͳ͍ͷʹ ELB ͱ͔Ϝμ INTRODUCTION
Headless CMS REST API ʹΑΔσʔλऔಘ ίϯςϯπߋ৽࣌ʹ Webhook ݺͼग़͠Մೳ CONTENTFUL
Server Side Rendering Server Side Generation Vue.JS on Node NUXT.JS
Server Side Generation Contentful ͷίϯςϯπߋ৽Ͱ webhook ͔Β nuxt generate ಈ͔͍ͨ͠
NUXT.JS + CONTENTFUL
EC2 ֎ ECS ίϯςφΠϝʔδΛಈ͔ͯ͠Ϗϧυ͢Δҙຯ͕ͳ͍ SSR ͳΒ͍͍͚ͲɺͦΕͳΒ Lambda
Ͱ͍͍ Lambda SSR ͳΒ࠷༗ྗ͚ͩͲɺࠓճ SSG ͍ͨ͠ CodeBuild + CodePipeline ѱ͘ͳ͍͚Ͳ৭ʑઃఆ͠ͳ͍ͱ͍͚ͳ͍ NUXT.JS ON AWS
Hosting environment / Backend environment Git ϨϙδτϦͱ࿈ܞͨ͠ CI/CD ύΠϓϥΠϯͷ࣮ߦ ड৴ΣϒϑοΫ
Basic ೝূ CloudFron + S3 ΧελϜυϝΠϯରԠ AWS AMPLIFY
Hosting environment / Backend environment Git ϨϙδτϦͱ࿈ܞͨ͠ CI/CD ύΠϓϥΠϯͷ࣮ߦ ड৴ΣϒϑοΫ
Basic ೝূ CloudFron + S3 ΧελϜυϝΠϯରԠ AMPLIFY + NUXT.JS + CONTENTFUL
ARCHITECTURE
ίϯςφڥศརͩΑͶ ίϯςφΠϝʔδΛ࡞Βͳͯ͘ྑ͍αʔϏε͕࣮͍Ζ͍Ζ͋Δ App Runner Amplify ίϯςφΛϥΫ͢ΔαʔϏε࣮͍Ζ͍Ζ͋Δ App2Container Copilot CONCLUSION
THANK YOU FOR LISTENING