NuxtでのJAMstackな開発とポイント

Transcript

1. /VYUͰͷ+".TUBDLͳ։ൃͱϙΠϯτ /VYU.FFUVQ!$ZCFS"HFOU
   ओ࠵ɿ4$065&3
   <8&%>
   ҝ౻ΞΩϥ

2. ࣭໰ φΫελʔͳօ͞Μɺ
   +".TUBDLͬͯݴ༿஌ͬͯ·͔͢ʁ

3. ࣭໰ /VYUKTͰ+".TUBDLͳ։ൃ͕ɺ
   ΊͪΌͪ͘ΌָͳͷͰຊ೔͸/VYUͰͷ+".4UBDL ։ൃʹ͍ͭͯ͝঺հ͍͖ͯ͠·͢ʂ

4. ໨࣍ ‣ ࣗݾ঺հ
   ‣ +".TUBDLͱ͸Կ͔ʁ
   ‣ +".TUBDLͱ͍͏༻ޠʹ͍ͭͯ
   ‣ /VYU͸+".TUBDLͱ૬ੑ͕ྑ͍
   ‣

   +".TUBDLͷΤίγεςϜ
   ‣ +".TUBDLͳ։ൃͰͷ֤։ൃϙΠϯτͷઆ໌
   ‣ ϙΠϯτᶃɿϧʔςΟϯάͱ"1*ͰͷϑΝΠϧੜ੒
   ‣ ϙΠϯτᶄɿ/FUMJGZͰͷQSFSFOEFSJOH

5. ࣗݾ঺հ ‣ ॴଐ
   ‣ גࣜձࣾ30-0
   ‣ 69ʴ։ൃΛத৺ʹडୗͰγεςϜ։ൃΛͭͭࣗࣾ͠αʔϏε։ൃɻ
   ‣ ࢓ࣄ಺༰
   ‣

   ຊ৬͸"84େ޷͖ͳ1)1 -BSBWFM ͷόοΫΤϯυΤϯδχΞ
   ‣ αʔό 1)1
   PS
   (P
   
   ϑϩϯτ 3FBDU /FYU
   PS
   7VF /VYU 
   ΞϓϦ
   ‣ ΞΧ΢ϯτ
   ‣ 5XJUUFSɿ
   !"LJSB5BNFUP ҝ౻ ΞΩϥ

6. +".TUBDLͱ͸Կ͔ʁ ‣ +BWB4DSJQU
   "1*T
   .BSLVQͷུɻ
   ‣ αΠτࣗମ͸શͯ+BWB4DSJQUͷΈͰهड़͠ɺಈతίϯςϯπ͸ "1*Λ࢖༻͠ɺ.BSLVQʹؔͯ͠͸(BUTCZɺ/FUMJGZΛ࢖༻͠੩ తαΠτΛߏ੒͢ΔࣄΛࢦ͓ͯ͠Γɺ͜ΕΒͷ։ൃΞʔΩςΫ νϟΛ+".4UBDLͱ͍͍·͢ɻ

7. +".TUBDLͱ͍͏༻ޠʹ͍ͭͯ ‣ /FUMJGZͷ૑ۀऀͰ͋Δɺ.BUUࢯ͕ఏএͨ͠༻ޠͰɺ͜ͷಈత͚ͩΕͲ΋੩ తͰఏڙ͢Δࣄ͕ग़དྷΔٕज़ΛԿͱݺͿ͔ߟ͑ͨ࣌ʹ࡞ΒΕͨΑ͏Ͱ͢ɻ
   ‣ ʮ4UBUJDʯͩͱੲͳ͕Βͷ)5.-αΠτ։ൃͱଊ͑ΒΕͯ͠·͏ҝɺ ʮ485 4UBUJD
   8FC
   5FDI ʯͱ࠷ॳ͸ݺ͹Ε͍ͯ·ͨ͠ɻ

8. /VYU͸+".TUBDLͱ૬ੑ͕ྑ͍ σΟϨΫτϦߏ੒͕ϧʔϧԽ͞Ε͍ͯͯɺ੩తϑΝΠϧ΋ੜ੒ OQN
   SVO
   HFOFSBUF
   ग़དྷ Δ/VYU͸+".TUBDLͱͱͯ΋૬ੑ͕ྑ͍ɻ
   ར఺ͱͯ͠ҎԼͷ͕̎ͭͱͯ΋େ͖͍ɻ ‣ ᶃύϑΥʔϚϯε໘
 ࣄલʹϏϧυγεςϜɺੜ੒ͨ͠ϑΝΠϧΛ$%/ʹ௨ͯ͠ද͍ࣔͯ͠ΔͷͰϢʔ βʔʹշదͳମݧΛఏڙग़དྷΔɻ


   ‣ ᶄηΩϡϦςΟ໘
 "1*͔Βऔಘͨ͠σʔλΛ੩తϑΝΠϧͱͯ͠ੜ੒͍ͯ͠Δҝɺ੬ऑੑʹର͢ Δ߈ܸରॲ͕΄΅ແ͍ͱݴ͑Δɻ

9. /VYU͸+".TUBDLͱ૬ੑ͕ྑ͍ /VYUͰαΠτΛެ։͢Δ্Ͱɺ
   ҎԼͷ̏ύλʔϯͷ΍Γํ͕ख๏͕ग़དྷ͍ͯ͘ɻ
   ɾ41"
   4JOHMF
   1BHF
   "QQMJDBUJPOʣ
   ɾ443
   4FSWFS
   4JEF
   3FOEFSJOH
   
   ɾ+".TUBDL
   

10. +".TUBDLͰͷΤίγεςϜ

11. +".TUBDLͳ։ൃͰͷ֤։ൃϙΠϯτͷઆ໌ɿߏ੒ ʷ ʷ ࠓճ͸લճͷ/VYU
    .FFU6Qͷࡍʹ͝঺հͨ͠ɺ
    /VYU
    
    /FUMJGZ
    
    $POUFOUGVMͷߏ੒Ͱ+".TUBDLΛ঺հ͍͖ͯ͠·͢ɻ
    ։ൃͷϙΠϯτͱͯ͠͸ϧʔςΟϯάपΓɺQSFSFOEFSSJOHͷઆ໌ʹͳΓ ·͢ɻ

12. +".TUBDLͳ։ൃͰͷ֤։ൃϙΠϯτͷઆ໌ɿߏ੒ ࢀߟهࣄɿ
    IUUQTXXXQJYFMTPOMZDPNBSUJDMFTNJHSBUJOHNZTUBUJDTJUFUPUIFKBNTUBDL

13. +".TUBDLͳ։ൃͰͷ֤։ൃϙΠϯτͷઆ໌ɿ$POUFOUGVM $POUFOUGVMͰ$POUFOU.PEFMΛ࡞੒

14. +".TUBDLͳ։ൃͰͷ֤։ൃϙΠϯτͷઆ໌ɿ$POUFOUGVM هࣄσʔλΛ౤ߘ

15. +".TUBDLͳ։ൃͰͷ֤։ൃϙΠϯτͷઆ໌ɿ/FUMJGZ /VYUΛΠϯετʔϧ͠(JUʹQVTIɻ

16. +".TUBDLͳ։ൃͰͷ֤։ൃϙΠϯτͷઆ໌ɿ/FUMJGZ /FUMJGZͷΞΧ΢ϯτΛ࡞੒͠ɺର৅ͷ(JUΛઃఆ

17. +".TUBDLͳ։ൃͰͷ֤։ൃϙΠϯτͷઆ໌ɿ/FUMJGZ (JUͰQVTI͕ߦΘΕΔͱɺ/FUMJGZଆͰݕ஌͠%FQMPZΛ։࢝

18. +".TUBDLͳ։ൃͰͷ֤։ൃϙΠϯτͷઆ໌ɿ/FUMJGZ /FUMJGZͰ੩తϑΝΠϧͰͷ/VYUσϑΥϧτϖʔδ͕ެ։͞ΕΔɻ

19. +".TUBDLͳ։ൃͰͷ֤։ൃϙΠϯτͷઆ໌ɿϙΠϯτᶃ ϙΠϯτᶃ
    ϧʔςΟϯάͱ"1*ͰͷϑΝΠϧੜ੒
    /VYUͷQBHFTσΟϨΫτϦʹͯϑΝΠϧΛఆ͍͖ٛͯ͠·͢ɻ

20. +".TUBDLͳ։ൃͰͷ֤։ൃϙΠϯτͷઆ໌ɿϙΠϯτᶃ QBHFTʹϑΝΠϧΛఆٛ͢Δͱࣗಈతʹ
    OVYUσΟϨΫτϦ಺Ͱ͸WVF
    SPVUFS͕ఆٛ͞Ε͍͖ͯ·͢ɻɹ˞OQN
    SVO
    EFWͷ࣌ʹੜ੒͞Ε·͢ɻ

21. +".TUBDLͳ։ൃͰͷ֤։ൃϙΠϯτͷઆ໌ɿϙΠϯτᶃ ࣮͸͜Ε͚ͩͩͱμϝͰɺ੩తϑΝΠϧΛHFOFSBUFͨ࣌͠ʹɺ࡞ΒΕΔϑΝΠϧ͸
    CMPHJOEFYIUNM
    ͷΈɻɹ˞ҰԠ+4Ͱ"1*Λऔಘ͍ͯ͠ΔͷͰهࣄҰཡ͸औΕΔ

22. +".TUBDLͳ։ൃͰͷ֤։ൃϙΠϯτͷઆ໌ɿϙΠϯτᶃ OVYUDPOpHKT
    ʹ
    HFOFSBUFΦϓγϣϯΛ௥Ճͯ͠ɺHFOFSBUF࣌ʹ $POUFOUGVMΑΓ"1*Λ࣮ߦͭͭ͠੩తϑΝΠϧ͕ੜ੒͢Δܗʹ͠·͢ɻ

23. +".TUBDLͳ։ൃͰͷ֤։ൃϙΠϯτͷઆ໌ɿϙΠϯτᶃ HFOFSBUF͕׬ྃ͢ΔͱҎԼͷΑ͏ʹCMPH഑Լʹσʔλ͕ੜ੒͞ΕΔ

24. +".TUBDLͳ։ൃͰͷ֤։ൃϙΠϯτͷઆ໌ɿϙΠϯτᶄ ϙΠϯτᶄ
    /FUMJGZͰͷQSFSFOEFSJOH
    /FUMJGZͰ͸جຊɺιʔείʔυमਖ਼͠ɺ(JUʹQVTI͢Ε͹ࣗಈతʹ%FQMPZ ͞Ε·͕͢͜Εͩͱهࣄ͕૿͑ͯ΋طʹ੩తϑΝΠϧ͸ੜ੒͞Ε͍ͯΔͷͰ දࣔ͞Ε·ͤΜɻ
    /FUMJGZͷQSFSFOEFSSJOHػೳΛ࢖͍ɺ$POUFOUGVMͷXFCIPPLΛొ࿥͢Δࣄ ʹΑΓهࣄొ࿥࣌ʹ/FUMJGZଆͰϏϧυ͕ߦΘΕͯ੩తϑΝϧ͕ੜ੒͞Ε·͢ɻ

25. +".TUBDLͳ։ൃͰͷ֤։ൃϙΠϯτͷઆ໌ɿϙΠϯτᶄ $POUFOUGVMͰXFCIPPLͷൃߦ

26. +".TUBDLͳ։ൃͰͷ֤։ൃϙΠϯτͷઆ໌ɿϙΠϯτᶄ /FUMJGZͰXFCIPPLͷొ࿥

27. +".TUBDLͳ։ൃͰͷ֤։ൃϙΠϯτͷઆ໌ɿϙΠϯτᶅ $POUFOUGVMͰهࣄͷ౤ߘ

28. +".TUBDLͳ։ൃͰͷ֤։ൃϙΠϯτͷઆ໌ɿϙΠϯτᶅ /FUMJGZͰϏϧυ͞Εͯɺهࣄ͕ੜ੒͞Ε͍ͯΔࣄΛ֬ೝ

29. /VYUϋϯζΦϯΠϕϯτͷએ఻ ຊ೔ΑΓืू։࢝͠·ͨ͠Πϕϯτͷ͝঺հͰ͢ɻ
    
    ʹ/VYU
    
    /FUMJGZ
    
    )FBEMFTT$.4
    Ͱ41"Λ࡞ΔϋϯζΦϯΛ։࠵͠·͢ʂࢲ΋ϝϯλʔͱ ͯ͠ࢀՃͯ͠ڭ͑·͢ͷͰ͚ٓ͠Ε͹ࢀՃ͍ͯͩ͘͠͞ ??

30. ͍͋ͭ͞ օ͞Μ΋ੋඇ/VYUͰ+".TUBDLͳ8&#Λ։ൃͯ͠Έ͍ͯͩ͘͞ʂ
    ͋Γ͕ͱ͏͍͟͝·ͨ͠ʂ