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

Transcript

2. ੴُ޿େ େن໛ϑϩϯτΤϯυͰ ͷ7VFͷ઴ਐతͳಋೖ J$BSF
   .FFUVQ
   WPM
3. ࣗݾ঺հ ɾ໊લ
   ੴُ
   ޿େʢ͍͕͠Ί
   ͜͏͍ͩʣ
   ɾॴଐ
   ΞδΞΫΤετגࣜձࣾ
   ɾ΍ͬͯΔ͜ͱ
   ϑϩϯτΤϯυΤϯδχΞ
   ɾٕज़
   7VF
   /VYUKT
   /FYUKT
   54+4
   KBNTUBDL
   ɾ޷͖ͳ͜ͱ
   ਆࣾ८Γɺࣸਅ
   ɾ5XJUUFS
   !LBNFQPO@GF
   
   RJJUB
   !JTJIJHBNF,PVEBJ
   
4. ࣗݾ঺հ 7VFͷຊΛࣥචɾग़൛͠·ͨ͠ʂ ʮ̍೔Ͱجૅ͕਎ʹ෇͘ʂ7VFKT௒ೖ໳ʯ
   "NB[PO
   ָఱɺٕज़ධ࿦ࣾެࣜαΠτ
   Ͱൢചத
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͠·͠ΐ͏ʂ