大規模フロントエンドで のVueの漸進的な導入

Transcript

1. None

2. ੴُ޿େ େن໛ϑϩϯτΤϯυͰ ͷ7VFͷ઴ਐతͳಋೖ J$BSF
   .FFUVQ
   WPM

3. ࣗݾ঺հ ɾ໊લ
   ੴُ
   ޿େʢ͍͕͠Ί
   ͜͏͍ͩʣ
   ɾॴଐ
   ΞδΞΫΤετגࣜձࣾ
   ɾ΍ͬͯΔ͜ͱ
   ϑϩϯτΤϯυΤϯδχΞ
   ɾٕज़
   7VF
   /VYUKT
   /FYUKT
   54+4
   KBNTUBDL
   ɾ޷͖ͳ͜ͱ
   ਆࣾ८Γɺࣸਅ
   

   ɾ5XJUUFS
   !LBNFQPO@GF
   
   RJJUB
   !JTJIJHBNF,PVEBJ
   

4. ࣗݾ঺հ 7VFͷຊΛࣥචɾग़൛͠·ͨ͠ʂ ʮ̍೔Ͱجૅ͕਎ʹ෇͘ʂ7VFKT௒ೖ໳ʯ
   "NB[PO
   ָఱɺٕज़ධ࿦ࣾެࣜαΠτ
   Ͱൢചத

5. None

6. &OKPZ
   7VFKTͯ͠·͔͢ʁ

7. ϞμϯϑϩϯτΤϯυΛऔΓר͘؀ڥ શͯͷϓϩμΫτɾձ͕ࣾશ෦
   Ϟμϯ؀ڥͱ͍͏͜ͱͰ͸ແ͍
   PS
   τϨϯυ௥ै͖͍ͬͯ͠ΔΘ͚Ͱ΋ͳ͍

8. ద੾ʹٕज़ΛΞοϓσʔτɾϞμϯԽ͠ͳ͍ͱ
   Կ͕໰୊ͳͷ͔ ɾίʔυͷෛ࠴ԽɾϝϯςͰ͖ͳ͍
   ɾΤϯδχΞ࠾༻ͷ೉қ౓͕ര্͕Γ
   ɾ։ൃ͕ࣄۀͷϘτϧωοΫʹͳΔ
   ɾ΋͸΍ɺࣄۀܧଓੑ͕ة͏͍

9. ద੾ʹٕज़ΛΞοϓσʔτɾϞμϯԽ͠ͳ͍ͱ
   Կ͕໰୊ͳͷ͔ ɾίʔυͷෛ࠴ԽɾϝϯςͰ͖ͳ͍
   ɾΤϯδχΞ࠾༻ͷ೉қ౓͕ര্͕Γ
   ɾ։ൃ͕ࣄۀͷϘτϧωοΫʹͳΔ
   ɾ΋͸΍ɺࣄۀܧଓੑ͕ة͏͍

10. ͲΜͳઓུͰΞοϓσʔτ͍͔ͯ͘͠

11. 7VFKTͷϓϩάϨογϒϦϓϨΠε

12. લఏɾλʔήοτ ɾٕज़తෛ࠴ͱ޲͖߹ͬͯΔ
    ɾ7VFKTͷಋೖΛߟ͍͑ͯΔɾಋೖ࠷த
    ɾϑϩϯτΤϯυͷઃܭɾٕज़બఆΛ͢Δ
    ɾࣄۀαΠυ΁ͷઆ໌͕ඞཁͳਓ

13. લఏɾλʔήοτ ɾࠓճͷέʔε͸7VFKTϦϓϨΠεͷ΄Μͷ Ұͭͷέʔε
    ɾϓϩδΣΫτ΍αʔϏε͕ҟͳΔͱ΋ͪΖ Μख๏΍ઓུ͸มΘͬͯ͘Δ

14. ΞδΣϯμʢ࣮ࢪ߲໨ʣ ɾݱঢ়ͷௐࠪͱഎܠ
    ɾߏ଄ͷܾఆͱٕज़ௐࠪ
    ɾ݁ՌͲ͏͔ͩͬͨ

15. ݱঢ়ͷௐࠪͱഎܠ ɾ&4
    8FCQBDL
    
    FTMJOU
    
    QSFUUJFS
    ɾKFTU
    WVFUFTUJOHMJCSBSZ
    5%%
    ɾK2VFSZΛ࢖ͬͨಠࣗ'8
    ɾϑϩϯτΤϯυ૊৫͕໿̎̌ਓʢυϝΠϯ

    ͝ͱʹνʔϜ͕෼͔Ε͍ͯΔʣ

16. ݱঢ়ͷௐࠪͱഎܠ ɾ&4
    8FCQBDL
    
    FTMJOU
    
    QSFUUJFS
    ɾKFTU
    WVFUFTUJOHMJCSBSZ
    5%%
    ɾK2VFSZΛ࢖ͬͨಠࣗ'8
    ɾϑϩϯτΤϯυ૊৫͕໿̎̌ਓʢυϝΠϯ

    ͝ͱʹνʔϜ͕෼͔Ε͍ͯΔʣ ɾಠࣗ'8͕͔ͳΓߴ౓͕ͩͬͨϝϯςɾ৽ن։ൃͰ͖Δਓ͕΄ ΅͍ͳ͍
    ɾ7VF͸෦෼తʹೖ͍͕ͬͯͨɺϝΠϯ͸ಠࣗ'8ͰͰ͖͍ͯͨ
    ɾࠓճɺ͜ͷಠࣗ'8Λ7VFKTʹஈ֊తʹஔ͖׵͑Δ

17. ݱঢ়ͷௐࠪͱഎܠ IPHF GVHB QJZP ಠࣗ'8 7VF
    41" ಠࣗ'8 αʔόʔαΠυςϯϓϨʔτ ϑϩϯτΤϯυ

18. ݱঢ়ͷௐࠪͱഎܠ ɾର৅ϦϓϨΠεը໘͕໿̍̌̌ը໘ ɾશͯΛ7VFͰϦϓϨΠε͢Δ͜ͱ͕ݫ͍͠
    ɾ޻਺಺ʹऩΊΔࢪࡦΛଧͭඞཁ͕͋Δ

19. ͦ͜ͰʮϓϩάϨογϒϦϓϨΠεʯ

20. ͦ͜ͰʮϓϩάϨογϒϦϓϨΠεʯ ಉ͡ΤϯτϦʔϙΠϯτ಺ʹೋͭͷҟͳΔ'8Λಉډͤ͞Δ

21. ݱঢ়ͷௐࠪͱഎܠ ϝϦοτ σϝϦοτ 7VFϑϧϦϓϨΠε ɾϝϯς͠΍͢͞ˍ඼࣭୲อ
    ɾΤϯδχΞ࠾༻ͷ͠΍͢͞ ɾ޻਺͕࠷΋͔͔Δ ࣗࣾ'8ʹཹΊΔ ɾ޻਺͕͔͔Γʹ͍͘
    ɾϝϯςΤϯϋϯε͕ແཧ
    

    ɾϚϯύϫʔ͕࠷΋ඞཁ ϓϩάϨογϒϦϓϨΠε ɾ޻਺಺ʹऩΊΒΕΔ
    ɾҎ߱ͰϦϓϨΠε͠΍͍͢ ɾφϨοδ͕ͳ͍
    ɾ༧ظͤ͵όάͷԹচ

22. ݱঢ়ͷௐࠪͱഎܠ ͲͷઓུΛͱͬͯ΋σϝϦοτɾϦεΫ͸ඞͣ࢒Δ ϝϦοτ σϝϦοτ 7VFϑϧϦϓϨΠε ɾϝϯς͠΍͢͞ˍ඼࣭୲อ
    ɾΤϯδχΞ࠾༻ͷ͠΍͢͞ ɾ޻਺͕࠷΋͔͔Δ ࣗࣾ'8ʹཹΊΔ ɾ޻਺͕͔͔Γʹ͍͘
    

    ɾϝϯςΤϯϋϯε͕ແཧ
    ɾϚϯύϫʔ͕࠷΋ඞཁ ϓϩάϨογϒϦϓϨΠε ɾ޻਺಺ʹऩΊΒΕΔ
    ɾҎ߱ͰϦϓϨΠε͠΍͍͢ ɾφϨοδ͕ͳ͍
    ɾ༧ظͤ͵όάͷԹচ

23. ݱঢ়ͷௐࠪͱഎܠ ϦεΫͷେ͖͞ ࣌ܥྻ ɾอ༗ͨ͠ϦεΫͷฦࡁܭըʢ͍ͭɺͲΜͳखஈͰʣΛલఏͱͯ͠ɺઃܭΛબͿ
    ɾશ෦෼্͔ͬͨͰͲͷϦεΫΛอ༗͠ɺͲΜͳϝϦοτΛڗड͢Δ͔
    ɾ͜͜·ͰΛυΩϡϝϯτ΍"%3ʢ"SDIJUFDUVSF
    %FDJTJPO
    3FDPSEʣʹ࢒͢ 7VFKT ࣗࣾ'8 ϛοΫεʢ7VFࣗࣾ'8ʣ

24. ߏ଄ͷܾఆͱٕज़ௐࠪ

25. ߏ଄ͷܾఆͱٕज़ௐࠪ ը໘
    ࣗࣾ'8 Ϟʔμϧʢࣗࣾ'8ʣ Ϟʔμϧʢࣗࣾ'8ʣ Ϟʔμϧʢࣗࣾ'8ʣ ը໘
    ࣗࣾ'8 Ϟʔμϧʢࣗࣾ'8ʣ Ϟʔμϧʢࣗࣾ'8ʣ

    Ϟʔμϧʢࣗࣾ'8ʣ

26. ߏ଄ͷܾఆͱٕज़ௐࠪ ը໘
    ࣗࣾ'8 Ϟʔμϧʢࣗࣾ'8ʣ Ϟʔμϧʢࣗࣾ'8ʣ Ϟʔμϧʢࣗࣾ'8ʣ ը໘
    ࣗࣾ'8 Ϟʔμϧʢࣗࣾ'8ʣ Ϟʔμϧʢࣗࣾ'8ʣ

    Ϟʔμϧʢࣗࣾ'8ʣ ը໘
    ࣗࣾ'8 Ϟʔμϧʢ7VFʣ Ϟʔμϧʢ7VFʣ Ϟʔμϧʢࣗࣾ'8ʣ ը໘
    7VF Ϟʔμϧʢ7VFʣ Ϟʔμϧʢࣗࣾ'8ʣ Ϟʔμϧʢࣗࣾ'8ʣ

27. ߏ଄ͷܾఆͱٕज़ௐࠪ ը໘
    7VF Ϟʔμϧʢࣗࣾ'8ʣ Ϟʔμϧʢࣗࣾ'8ʣ Ϟʔμϧʢࣗࣾ'8ʣ

28. ߏ଄ͷܾఆͱٕज़ௐࠪ ը໘
    7VF Ϟʔμϧʢࣗࣾ'8ʣ Ϟʔμϧʢࣗࣾ'8ʣ Ϟʔμϧʢࣗࣾ'8ʣ ɾҟͳΔ'8ؒͰͷσʔλͱΠϕϯτͷ఻ୡ
    ɾෛ࠴Խ͠ʹ͍͘ߏ଄ͱ࣮૷ํ๏ͷཱ֬

29. ߏ଄ͷܾఆͱٕज़ௐࠪ ɾػೳ΍ӨڹൣғΛ໌ࣔతʹݶఆ͢Δ
    ɾյ͠΍͍͢ɾࣺͯΔલఏͷߏ੒

30. ߏ଄ͷܾఆͱٕज़ௐࠪ ը໘
    7VF Ϟʔμϧʢࣗࣾ'8ʣ Ϟʔμϧʢࣗࣾ'8ʣ Ϟʔμϧʢࣗࣾ'8ʣ Ϟʔμϧʢࣗࣾ'8ʣ ը໘
    7VF Ξμϓλʔ

    Ξμϓλʔ DPOOFDU૚

31. ߏ଄ͷܾఆͱٕज़ௐࠪ ɾTSDDMJFOU
    ɾɾɾ
    7VFͰ࡞ΒΕͨը໘΍෦඼܈
    ɾTSDKT
    ɾɾɾࣗࣾ'8Ͱ࡞ΒΕͨը໘΍෦඼܈
    ɾTSDDPOOFDU
    ɾɾɾೋͭͷ'8Λܨ͙Ξμϓλʔ DPOOFDU૚ͷϝϦοτ
    ɾҎ߱ͷϑϧϦϓϨΠε࣌ʹࣺͯ΍͘͢͢Δ
    ɾҟͳΔ'8͕ಉډ͍ͯ͠Δ͜ͱ͕໌ࣔతʹͳΔ

32. ߏ଄ͷܾఆͱٕज़ௐࠪ 7VF੡ը໘͔Βಠࣗ'8ͷϞʔμϧΛݺͼग़͢

33. ߏ଄ͷܾఆͱٕज़ௐࠪ ࣗࣾ'8ը໘͔Β7VFͷϞʔμϧΛݺͼग़͢

34. ߏ଄ͷܾఆͱٕज़ௐࠪ ࣗࣾ'8ը໘͔Β7VFͷϞʔμϧΛݺͼग़͢

35. ݁ՌͲ͏͔ͩͬͨ

36. ݁ՌͲ͏͔ͩͬͨ ɾ໿ਓ೔ͷ޻਺࡟ݮͭͭ͠ɺ޻਺಺Ͱ࡞Γ੾Εͨ
    ɾϑϩϯτΤϯυҎ֎ͷਓʹ߹ҙܗ੒Λͱ্ͬͨͰ։ൃͰ͖ͨ
    ɾͭͳ͗͜ΈʹΑΔσϝϦοτΛ࠷খԽ͠ͳ͕ΒɺҎ߱ͷϦϓ ϨΠεΛ͠΍͍͢౔৕Λ࡞Εͨ

37. ·ͱΊ ɾյ͠΍͍͢ɾࣺͯ΍͍͢ίʔυ͸ྑ͍ઃܭͷॿ͚ʹͳΔ
    ɾͲͷҙࢥܾఆΛͯ͠΋σϝϦοτ͸ଘࡏ͢ΔͷͰɺશͯ໢ཏ ্ͨ͠Ͱબ୒ɾܾఆͯ͠΋Β͏
    ɾϦεΫͷฦࡁܭըͷ؍఺ΛઃܭʹऔΓೖΕͯΈΔ
    ɾ7VF͕ϓϩάϨογϒϑϨʔϜϫʔΫͳͷͰɺஈ֊తʹಋೖ ͠΍͔ͬͨ͢
    

38. &OKPZ
    7VFKT͠·͠ΐ͏ʂ