Upgrade to Pro — share decks privately, control downloads, hide ads and more …

AmplifyとNext.jsとNest.js

yosi
August 08, 2022

 AmplifyとNext.jsとNest.js

yosi

August 08, 2022
Tweet

More Decks by yosi

Other Decks in Programming

Transcript

  1. ֤ϑϨʔϜϫʔΫʹ͍ͭͯ Amplify • SPA΍੩తδΣωϨʔλʔΛ࠷଎ͰϦϦʔε͢ΔͨΊʹ։ൃϓϥοτϑΥʔϜ AmplifyϑΝϛϦʔ • Framework ɹˠΫϥΠΞϯτ͕AWSͷόοΫΤϯυͱ࿈ܞ͢ΔͨΊͷॲཧΛ਺ߦͰ࣮૷Ͱ͖ΔΑ͏ʹ ͢ΔϑϨʔϜϫʔΫͰ •

    CLI ɹˠAWSͰαʔόʔϨεͳόοΫΤϯυΛߏஙɾ؅ཧ͢ΔͨΊͷCLIπʔϧɻ • Developer Tools ɹˠϑϩϯτΤϯυͱόοΫΤϯυʹରͯ͠ϏϧυɺςετɺσϓϩΠɺϗεςΟϯάΛ ༰қʹ࣮ݱͰ͖ΔAWSαʔϏε
  2. ֤ϑϨʔϜϫʔΫʹ͍ͭͯ Next.js • ΞϓϦ͚ʔγϣϯߏஙΊͬͪΌ؆୯ 
 $ npx create-next-app (React΋create-react-app ͸͋Δ͕,,,)

    • ϧʔςΟϯά͕༰қ • SPAͱSSRͷͷ੾Γସ͕͑؆୯ 
 
 Next.js࠾༻اۀ 
 Hulu Uber NETFLIX Github,docer
  3. ϋϚͬͬͨͱ͜ 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ͰσϓϩΠ
  4. ϋϚͬͬͨͱ͜ 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ͷόʔδϣϯʹ஫໨ʂ
  5. ϋϚͬͬͨͱ͜ Nest.js×Amplify • ͲͪΒΛμ΢ϯϩʔυ͢Δʹ΋Node͕ඞཁɻɹɹݱࡏnode ver 12.9.0 • ͔͠͠Next.jsΛcreate͢Δࡍʹ͜ΜͳΤϥʔ 
 


    • ;Ή;Ήɺnode͋͛ͨΒ͍͍Μ΍Ͷʂ 
 →͕ɺ͔͠͠ઌ΄ͲΠϯετʔϧͨ͠Amplify΋node12.9.0ͰΠϯετʔϧ 
 ͔ͨ͠ΒAmplify init͕Ͱ͖ΜΜΜΜʂʂʂʂʂ
  6. ϋϚͬͬͨͱ͜ Nest.js×Amplify • 
 
 
 • ࠓճ͸globalʹ12.9.0Λࢦఆ͕ͯͨ͠ɺassistanceʹlocal12.9.0Λࢦఆ 
 globalʹݱࡏnodeਪ঑தͷ14.17.4Λઃఆ

    
 →΋ͪΖΜશͯҰ౓ΞϯΠϯετʔϧͯ͠࠶౓μ΢ϯϩʔυͨ͠Α(ͽ͑Μ) ͜Μͳ࣌͸ nodoenv Λ࢖ͬͯόʔδϣϯΛ੾Γସ͑Α͏ʂ
  7. Nest.js Controller • Controller 
 • SpringBootͱ΄΅ಉ͡ • @ControllerͷΑ͏ʹΞϊ ςʔγϣϯΛ࢖ͬͯΔ෦෼ͳ

    ͲΘ͔Γ΍͍͢ 
 →Angular΋ௐ΂ͯΈ͕ͨ 
 ΞϊςʔγϣϯΛ࢖ͬͨهड़ ͕͋Δɻ΍͸ΓAngularΛࢀ ߟʹͯ͠Δ͚ͩ͋Δ
  8. Nest.js Module • app.module 
 
 
 
 
 •

    User.module 
 
 
 • ͜͜͸DBͱcontrollerͱserviceΛ͍͍ײ͡ʹܨ͙Πϝʔδ