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
AmplifyとNext.jsとNest.js
Search
yosi
August 08, 2022
Programming
0
600
AmplifyとNext.jsとNest.js
yosi
August 08, 2022
Tweet
Share
More Decks by yosi
See All by yosi
自社開発のエンジニアの私が 大事にしてること(n=1)
yoshisan
1
56
なるほどGit講座 (追跡ブランチが理解できます!)
yoshisan
0
180
「自分の時間を生きる」キャリア論
yoshisan
1
98
小学生でもわかる SlackAPI×GAS
yoshisan
0
110
達人プログラマーになろう!
yoshisan
0
110
認証認可
yoshisan
1
130
オブジェクト指向が"チョットワカル"スライド
yoshisan
0
110
Linuxについて"ほんのチョットワカル"スライド
yoshisan
1
110
Let's React!! "チョットワカル"の第一歩
yoshisan
1
190
Other Decks in Programming
See All in Programming
詳しくない分野でのVibe Codingで困ったことと学び/vibe-coding-in-unfamiliar-area
shibayu36
3
4.5k
CSC305 Lecture 04
javiergs
PRO
0
250
私達はmodernize packageに夢を見るか feat. go/analysis, go/ast / Go Conference 2025
kaorumuta
2
500
エンジニアとして高みを目指す、 利益を生み出す設計の考え方 / design-for-profit
minodriven
23
12k
開発生産性を上げるための生成AI活用術
starfish719
1
180
AI Coding Meetup #3 - 導入セッション / ai-coding-meetup-3
izumin5210
0
610
育てるアーキテクチャ:戦い抜くPythonマイクロサービスの設計と進化戦略
fujidomoe
1
150
dynamic!
moro
9
6.7k
iOS 17で追加されたSubscriptionStoreView を利用して5分でサブスク実装チャレンジ
natmark
0
620
ネイティブ製ガントチャートUIを作って学ぶUICollectionViewLayoutの威力
jrsaruo
0
130
止められない医療アプリ、そっと Swift 6 へ
medley
1
120
デミカツ切り抜きで面倒くさいことはPythonにやらせよう
aokswork3
0
200
Featured
See All Featured
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
12
1.2k
It's Worth the Effort
3n
187
28k
Practical Orchestrator
shlominoach
190
11k
Rails Girls Zürich Keynote
gr2m
95
14k
No one is an island. Learnings from fostering a developers community.
thoeni
21
3.5k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
52
5.6k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
9
960
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
30
2.9k
Stop Working from a Prison Cell
hatefulcrawdad
271
21k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
29
2.6k
Mobile First: as difficult as doing things right
swwweet
224
10k
Done Done
chrislema
185
16k
Transcript
Amplify Next.js Nest.js ͞ΘͬͯΈͨʂ
ࠓճ࣮ࡍʹ͞ΘͬͯΈͯ,,, • ͱͬͯૉૣ͘ىಈͰ͖Δʂ(ίϚϯυୟ͚ଈʂ) • Ͱɺ࣮ݱͰ͖Δ·ͰʹͪΐͬͱϋϚͬͨͱ͜Ζ͋Γ • ࠓճAmplifyͰNext.jsΛσϓϩΠͱNest.jsͰCRUDͷ2ͭΓ·ͨ͠ʂ
֤ϑϨʔϜϫʔΫʹ͍ͭͯ Amplify • SPA੩తδΣωϨʔλʔΛ࠷ͰϦϦʔε͢ΔͨΊʹ։ൃϓϥοτϑΥʔϜ AmplifyϑΝϛϦʔ • Framework ɹˠΫϥΠΞϯτ͕AWSͷόοΫΤϯυͱ࿈ܞ͢ΔͨΊͷॲཧΛߦͰ࣮Ͱ͖ΔΑ͏ʹ ͢ΔϑϨʔϜϫʔΫͰ •
CLI ɹˠAWSͰαʔόʔϨεͳόοΫΤϯυΛߏஙɾཧ͢ΔͨΊͷCLIπʔϧɻ • Developer Tools ɹˠϑϩϯτΤϯυͱόοΫΤϯυʹରͯ͠ϏϧυɺςετɺσϓϩΠɺϗεςΟϯάΛ ༰қʹ࣮ݱͰ͖ΔAWSαʔϏε
֤ϑϨʔϜϫʔΫʹ͍ͭͯ Next.js • ΞϓϦ͚ʔγϣϯߏஙΊͬͪΌ؆୯ $ npx create-next-app (Reactcreate-react-app ͋Δ͕,,,)
• ϧʔςΟϯά͕༰қ • SPAͱSSRͷͷΓସ͕͑؆୯ Next.js࠾༻اۀ Hulu Uber NETFLIX Github,docer
֤ϑϨʔϜϫʔΫʹ͍ͭͯ Nest.js • TSΛϕʔεͱͨ͠όοΫΤϯυ • ݟͨײ͡SpringBootͱࣅͯΔͱ͜Ζଟ͠ʂ(↓) • Controller,Service,ModuleͷࡾͰͦΕͧΕ͕͋Δɻ(͔Γ͍͢) • ֤ࡾίϚϯυͰ࡞Δ
$ nest g module userModule
ϋϚͬͬͨͱ͜ Amplify×Next.jsʹ͍ͭͯ • AmplifyΛ͏ͷʹҎԼͷྲྀΕͰͬͯΈͨ 1.AWS CLIͷΠϯετʔϧ →aws con
f igure Ͱpro f ileΛઃఆ 2.Amplify CLIͷΠϯετʔϧ →ΠϯετʔϧʹNode͕ඞཁʂ 3.Next.jsͰϓϩδΣΫτ࡞ͬͯ amplify init Λ͢Δɻ 4.Next.jsͷίʔυΛGitHubʹ͋͛Δ 5Amplify͔ΒGUIͰσϓϩΠ
ϋϚͬͬͨͱ͜ Amplify×Next.jsʹ͍ͭͯ • AmplifyΛ͏ͷʹҎԼͷྲྀΕͰͬͯΈͨ 1.AWS CLIͷΠϯετʔϧ →aws con
f igure Ͱpro f ileΛઃఆ 2.Amplify CLIͷΠϯετʔϧ →ΠϯετʔϧʹNode͕ඞཁʂ 3.Next.jsͰϓϩδΣΫτ࡞ͬͯ amplify init Λ͢Δɻ 4.Next.jsͷίʔυΛGitHubʹ͋͛Δ 5Amplify͔ΒGUIͰσϓϩΠ ͍ɺ͜͜ͰҾֻ͔ͬΓ·ͨ͠ɻ Nodeͷόʔδϣϯʹʂ
ϋϚͬͬͨͱ͜ Nest.js×Amplify • ͲͪΒΛμϯϩʔυ͢ΔʹNode͕ඞཁɻɹɹݱࡏnode ver 12.9.0 • ͔͠͠Next.jsΛcreate͢Δࡍʹ͜ΜͳΤϥʔ
• ;Ή;Ήɺnode͋͛ͨΒ͍͍ΜͶʂ →͕ɺ͔͠͠ઌ΄ͲΠϯετʔϧͨ͠Amplifynode12.9.0ͰΠϯετʔϧ ͔ͨ͠ΒAmplify init͕Ͱ͖ΜΜΜΜʂʂʂʂʂ
ϋϚͬͬͨͱ͜ Nest.js×Amplify • • ࠓճglobalʹ12.9.0Λࢦఆ͕ͯͨ͠ɺassistanceʹlocal12.9.0Λࢦఆ globalʹݱࡏnodeਪதͷ14.17.4Λઃఆ
→ͪΖΜશͯҰΞϯΠϯετʔϧͯ͠࠶μϯϩʔυͨ͠Α(ͽ͑Μ) ͜Μͳ࣌ nodoenv ΛͬͯόʔδϣϯΛΓସ͑Α͏ʂ
Nest.js Controller • Controller • SpringBootͱ΄΅ಉ͡ • @ControllerͷΑ͏ʹΞϊ ςʔγϣϯΛͬͯΔ෦ͳ
ͲΘ͔Γ͍͢ →AngularௐͯΈ͕ͨ ΞϊςʔγϣϯΛͬͨهड़ ͕͋ΔɻΓAngularΛࢀ ߟʹͯ͠Δ͚ͩ͋Δ
Nest.js Service • Controller • جຊతʹॲཧͷ۩ମ͜͜ɻ • @InjectableͳͲDI(ґଘੑͷ ೖ)χϠͬͯ͠·ͨ͠স
• ֤ϝιουΛ͜Ͷ͜Ͷɻ
Nest.js Module • app.module •
User.module • ͜͜DBͱcontrollerͱserviceΛ͍͍ײ͡ʹܨ͙Πϝʔδ
·ͱΊ ɾNestͱNextΛAmplifyͳͰࡌͤ Δ͜ͱ͕Ͱ͖ͳ͔ͬͨͷͰɺͦ͜ ·ͰͬͯΈ͔ͨͬͨɻ ɾϋϚΔͱ͜Ζ͕͋ͬͨ࠶ ͬͯΈΔͱૣ͍ૣ͍ʂ ɾ·ͩ·ͩศརͳ෦ɺ͍ʹ͘ ͍෦Λ୳͍͖ͯͨ͠͠ʂ
ޚਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ʂ Ҿ༻ Next.jsɺAmplifyͰ։ൃڥߏங͢Δ(https://qiita.com/ps-y-uehara/items/4542349252eb3d83e644) NestJSೖɹجૅ͔ΒMomgoDBɺೝূ·ͰΛҰؾʹղઆ ( https://www.youtube.com/watch?v=HQ3tjl_Sh9s )