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
480
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
67
俺たちのプロトタイプ
swordbreaker
0
670
さぁ、ブログをはじめようどこで?どうやって?
swordbreaker
0
470
実践 Movable Type 7
swordbreaker
0
2.9k
できる Movable Type 7
swordbreaker
0
400
トフでもわかるコンテンツタイプ講座
swordbreaker
0
1.5k
Movable Type 7 のすべて
swordbreaker
2
1.6k
Other Decks in Technology
See All in Technology
New Cache Hierarchy for Container Images and OCI Artifacts in Kubernetes Clusters using Containerd / KubeCon + CloudNativeCon Japan
pfn
PRO
0
130
Snowflake Intelligenceで実現できるノーコードAI活用
takumimukaiyama
1
130
Introduction to Bill One Development Engineer
sansan33
PRO
0
250
從開發到架構設計的可觀測性實踐
philipz
0
210
vLLM meetup Tokyo
jpishikawa
1
130
Contract One Engineering Unit 紹介資料
sansan33
PRO
0
6.3k
Drawing with LLMs
rist
0
250
Ретроспективный взгляд на Vue 3. Даша Сабурова, Vue-разработчик Lamoda Tech
lamodatech
0
750
データベースの引越しを Ora2Pg でスマートにやろう
jri_narita
0
190
Go Connectへの想い
chiroruxx
0
160
AI とペアプロしてわかった 3 つのヒューマンエラー
takahiroikegawa
1
630
OpenTelemetry Collector internals
ymotongpoo
5
500
Featured
See All Featured
The Power of CSS Pseudo Elements
geoffreycrofte
77
5.8k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
280
13k
Agile that works and the tools we love
rasmusluckow
329
21k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
123
52k
Stop Working from a Prison Cell
hatefulcrawdad
269
20k
Build your cross-platform service in a week with App Engine
jlugia
231
18k
Bash Introduction
62gerente
614
210k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
26
2.8k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
32
5.9k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
6
680
Reflections from 52 weeks, 52 projects
jeffersonlam
349
20k
How to Think Like a Performance Engineer
csswizardry
24
1.7k
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