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
650
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
AmplifyとNext.jsとNest.js
yosi
August 08, 2022
More Decks by yosi
See All by yosi
自社開発のエンジニアの私が 大事にしてること(n=1)
yoshisan
1
110
なるほどGit講座 (追跡ブランチが理解できます!)
yoshisan
0
210
「自分の時間を生きる」キャリア論
yoshisan
1
120
小学生でもわかる SlackAPI×GAS
yoshisan
0
120
達人プログラマーになろう!
yoshisan
0
140
認証認可
yoshisan
1
160
オブジェクト指向が"チョットワカル"スライド
yoshisan
0
140
Linuxについて"ほんのチョットワカル"スライド
yoshisan
1
140
Let's React!! "チョットワカル"の第一歩
yoshisan
1
230
Other Decks in Programming
See All in Programming
自動化したのに回らないテスト運用の壁ーAI時代の品質責任と生産性
mfunaki
0
120
仕様駆動開発へのトライを機に チームに適合する手法を模索し続けている話
freee
PRO
0
400
霧の中の代数的エフェクト
funnyycat
1
460
Go言語とトイモデルで学ぶTransformerの気持ち / fukuokago23-transformer
monochromegane
0
160
メールのエイリアス機能を履き違えない
isshinfunada
0
220
信頼性について考えてみる(SRE NEXT 2026 miniLT)
hayama17
0
240
改善しないと、タスクが回らない。 “てんこ盛りポジション” を引き継いだ情シスの、入社3ヶ月の業務改善録
krm963
0
250
継続モナドとリアクティブプログラミング
yukikurage
3
680
作るコストが小さくなった時代 幸せに働くために改めて考えたいこと 〜エンジニアとして価値を出し続けるために注視している二分野〜
yuppeeng
0
180
FDEが実現するAI駆動経営の現在地
gonta
2
260
「寝てても仕事が進む」Claude Codeで組む第二の脳
tomoyafujita2016
0
280
ルールを書いて終わらせないハーネスエンジニアリング
yug1224
4
1.8k
Featured
See All Featured
Bootstrapping a Software Product
garrettdimon
PRO
307
120k
Why Mistakes Are the Best Teachers: Turning Failure into a Pathway for Growth
auna
0
190
Data-driven link building: lessons from a $708K investment (BrightonSEO talk)
szymonslowik
1
1.2k
Build your cross-platform service in a week with App Engine
jlugia
234
19k
Reality Check: Gamification 10 Years Later
codingconduct
0
2.2k
How GitHub (no longer) Works
holman
316
150k
Facilitating Awesome Meetings
lara
57
7.1k
Beyond borders and beyond the search box: How to win the global "messy middle" with AI-driven SEO
davidcarrasco
3
200
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
508
140k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
254
22k
The Illustrated Children's Guide to Kubernetes
chrisshort
51
53k
The MySQL Ecosystem @ GitHub 2015
samlambert
251
13k
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 )