Micro Frontendsのモチベーション / Motivation for Micro Frontends

Transcript

1. .JDSP
   'SPOUFOETͷϞνϕʔγϣϯ

2. ࣗݾ঺հ 2 • ໊લ
   ৿
   ٱଠ࿠
   !RTPOB
   • גࣜձࣾ'J/$
   • ओʹαʔόαΠυΤϯδχΞ
   

   ͓खॊΒ͔ʹʂ
   • .JDSPTFSWJDFT
   .FFUVQओ࠵

3. ϚΠΫϩαʔϏεͱ͸ʁ 3 • ڠௐͯ͠ಈ࡞͢Δɺখن໛Ͱࣗ཯తͳαʔϏε
   • 03FJMMZ
   +BQBO
   
   ϚΠΫϩαʔϏεΞʔΩςΫνϟ
   ΑΓҾ༻
   • ͭͷϓϩμΫτΛෳ਺ͷαʔϏε͔Βߏ੒͢Δख๏
   • ͜͜Ͱ͍͏ʮϓϩμΫτʯ͸ɺΤϯυϢʔβ͔Βͷݟ͑ํ
   

   • ΤϯυϢʔβ͸;ͭ͏෼ׂΛҙࣝ͠ͳ͍

4. ϚΠΫϩαʔϏεͷϝϦοτ 4 • 
   σϓϩΠͷ෼཭
   • 
   ٕज़બ୒ͷಠཱ
   • 

   
   ૊৫ͷ෼ׂͱࣗ཯
   • 
   ϨδϦΤϯε ճ෮ੑ

5. 
   σϓϩΠͷ෼཭ 5 • ֤αʔϏε͸ଞαʔϏεͱಠཱͯ͠σϓϩΠͰ͖Δ
   • ґଘؔ܎͕গͳ͍ঢ়ଶͰɺ҆શʹσϓϩΠՄೳ
   • "1*Ͱ࿈ܞ͢Δ͜ͱ͕લఏ
   %#ϨϕϧͰ݁߹͍ͯͨ͠Γ͢

   Δͱಠཱͯ͠σϓϩΠͰ͖ͳ͘ͳΔ
   • ֤ϏδωεͰಠཱʹϦϦʔεαΠΫϧΛ࣋ͪɺߴ଎ʹ 1%$"Λճ͢͜ͱ͕Ͱ͖Δ

6. 
   ٕज़બ୒ͷಠཱ 6 • ֤αʔϏε͸ಠཱٕͯ͠ज़Λબ୒Ͱ͖Δ
   • ϓϩάϥϛϯάݴޠ
   • ϥΠϒϥϦ
   •

   σʔλετΞ
   • FUD
   • ڞ௨Ͱར༻͍ͯ͠Δ࿈ܞख๏ "1*ͷܗࣜ Λ
 कΔ͜ͱ͚͕ͩ৚݅

7. 
   ૊৫ͷ෼ׂͱࣗ཯ 7 • ͦΕͧΕͷαʔϏεΛத৺ʹ૊৫Λ෼ׂͰ͖Δ
   • σϓϩΠɾٕज़બ୒ͳͲɺͦͷ૊৫ͰಠཱʹҙࢥܾఆͰ ͖ΔϙΠϯτ͕ଟ͍
   • ྫ
   σϓϩΠ͕෼཭͞Ε͍ͯΔ
   
   ֤νʔϜ͕޷͖ͳλΠϛ

   ϯάͰαʔϏεΛσϓϩΠͰ͖ΔͷͰɺͦͷνʔϜͷࣗ༝ ౓͕ߴ͍
   • ݁Ռͱͯ͠ɺ૊৫͕Ϗδωε୯ҐͰࣗ཯Ͱ͖Δ

8. 
   ϨδϦΤϯε ճ෮ੑ 8 • αʔϏεڥք͕ʮִนʯͱͳΓɺো֐ͷ࿈࠯Λ๷͙
   • ݁Ռͱͯ͠ɺϓϩμΫτશମͰͷ
 αʔϏεϨϕϧΛߴΊΔ͜ͱ͕Ͱ͖Δ

9. ϚΠΫϩαʔϏε͸࠷ߴ
   

10. None

11. ΤϯυϢʔβͷࢹ఺ 11 • ϓϩμΫτΛར༻͢ΔϢʔβ͸ɺجຊతʹ
 ϚΠΫϩαʔϏεΛҙࣝ͠ͳ͍
    • ϚΠΫϩαʔϏε͕౷߹͞Εͨɺ
 ͭͷϓϩμΫτΛ࢖͏

12. ϑϩϯτΤϯυͰͷ౷߹ 12 • ϑϩϯτΤϯυ͸ɺΤϯυϢʔβʹ޲͚ͯ
 ౷߹͞ΕͨମݧΛఏڙ͠ͳ͚Ε͹ͳΒͳ͍
    • ϖʔδʹෳ਺ͷϏδωευϝΠϯ
    • 6*ɾ69ͷ౷Ұײ
    •

    γʔϜϨεͳભҠ

13. ϑϩϯτΤϯυɾϞϊϦε 13 • ౷߹͞ΕͨମݧΛఏڙ͢ΔͨΊɺϑϩϯτΤϯυ͸
 ϞϊϦγοΫͳΞϓϦέʔγϣϯʹͳΓ΍͍͢
    • ෳ਺ͷϚΠΫϩαʔϏεΛ౷߹͍ͯ͠Δ https://micro-frontends.org

14. ϑϩϯτΤϯυɾϞϊϦεͷ໰୊఺ 14 • ϚΠΫϩαʔϏεͰ͋Ε͹ಘΒΕΔ͸ͣͷϝϦοτ͕ɺ ಘΒΕͳ͘ͳͬͯ͠·͏
    • 
    σϓϩΠ͕෼཭͠ͳ͍
    • 

    
    ٕज़બ୒͕ಠཱ͠ͳ͍
    • 
    ૊৫͕෼ׂࣗ཯͞Εͳ͍
    • 
    ϨδϦΤϯε ճ෮ੑ ͕௿͍

15. 
    σϓϩΠ͕෼཭͠ͳ͍ 15 • όοΫΤϯυ୯ମͰσϓϩΠͰ͖Δػೳ͸໰୊ͳ͍
    • ϑϩϯτΤϯυ·ͰؚΜͩػೳͷ৔߹ɺͦͷϏδωε୯ ମͰ͸σϓϩΠͰ͖ͣɺϑϩϯτΤϯυશମͰௐ੔͢Δ ͜ͱʹͳΔ

16. 
    ٕज़બ୒͕ಠཱ͠ͳ͍ 16 • جຊతʹ͸ಉ͡ݴޠɾϑϨʔϜϫʔΫʹറΒΕΔ
    • ྫ
    'MPX
    
    3FBDU
    
    3FEVY
    
    SFEVYTBHB
    

    • ޙ൒ͷํʹߦ͚͹͍͘΄Ͳɺผͷ΋ͷͱڞଘͰ͖ͳ͘͸ͳ͍ ͕

17. 
    ૊৫͕෼ׂࣗ཯͞Εͳ͍ 17 • ૊৫Λ෼ׂ͠ͳ͍৔߹
    • ϑϩϯτΤϯυνʔϜ͕։ൃ
    • ৬ೳͱͯ͠ͷ૊৫ʹͳΔͨΊɺϏδωε্ͷ,1*ΛҰॹʹ௥ ͏ͷ͕೉͍͠
    

    • ૊৫Λ෼ׂ͢Δ৔߹
    جຊతʹ͸ͦ͏͍͕ͨ͠
    • ෳ਺ͷϏδωενʔϜͰͭͷϑϩϯτΤϯυΛ։ൃ
    • σϓϩΠ͕෼཭͠ͳ͍ͷͰɺ౎౓ௐ੔͕ඞཁ
    • ٕज़બఆ΋റΒΕΔ
    • ࣗ཯Ͱ͖͍ͯͳ͍

18. 
    ϨδϦΤϯε ճ෮ੑ ͕௿͍ 18 • Ͳ͔͜ͷίϯϙʔωϯτ͕+BWB4DSJQUͷΤϥʔΛు͍ͨ Βɺϖʔδશମ͕ࢭ·Δ
    • ͦͷΤϥʔ͸HMPCBMʹӨڹ͍ͯ͠ΔՄೳੑ͕͋ΔͨΊɺϋ

    ϯυϦϯά͢Δ৔ॴ͕೉͍͠
    • ͔ͤͬ͘όοΫΤϯυͰো֐ΛہॴԽͯ͠΋ɺ
 ΤϯυϢʔβͷͱ͜ΖͰো֐͕࿈࠯ͯ͠͸ҙຯ͕ͳ͍

19. ϑϩϯτΤϯυʹ΋
 ϚΠΫϩαʔϏεΛಋೖ͍ͨ͠
    

20. .JDSP
    'SPOUFOET 20 • όοΫΤϯυ͚ͩͰͳ͘ɺϑϩϯτΤϯυ·ͰؚΊͨ
 ϚΠΫϩαʔϏε෼ׂʹ͍ͨ͠ https://micro-frontends.org

21. .JDSP
    'SPOUFOET 21 • όοΫΤϯυ͚ͩͰͳ͘ɺϑϩϯτΤϯυ·ͰؚΊͨ
 ϚΠΫϩαʔϏε෼ׂʹ͍ͨ͠
    • ϑϩϯτΤϯυ΋όοΫΤϯυͱಉ͡Α͏ʹϝϦοτΛ ڗड͍ͨ͠

22. .JDSP
    'SPOUFOETͷ౷߹ 22 • ҰํͰɺΤϯυϢʔβʹ͸౷߹͞ΕͨମݧΛఏڙ͍ͨ͠
    • ֤αʔϏεͰఏڙ͢Δ6*Λ߹੒͢Δඞཁ͕͋Δ
    • ϑϩϯτΤϯυɾϞϊϦεͷ৔߹
    • ֤αʔϏε͸+40/ͳͲͷσʔλΛ"1*Ͱఏڙ
    

    • σʔλΛ߹੒ͯ͠ɺΞϓϦέʔγϣϯΛ࡞͍ͬͯΔ
    • ϚΠΫϩϑϩϯτΤϯυͷ৔߹
    • ֤αʔϏε͸ɺ6*Λఏڙ͢Δ
    • 6*Λ߹੒ͯ͠ɺΞϓϦέʔγϣϯΛ࡞͍ͬͯΔ
    • ߹੒͢ΔϨΠϠ͕ඞཁͳͷ͸มΘΒͳ͍͕ɺബͯ͘ࡁΉ

23. .JDSP
    'SPOUFOETͰඞཁͳ͜ͱ 23 • ֤αʔϏεͷ6*Λ߹੒͢Δ
    • 6*ύʔπ΍ελΠϧͷڞ௨Խ
    • αʔϏεؒͷ࿈ܞ
    • ٕज़બ୒ͷಠཱͷͨΊɺඪ४ͷٕज़Λ࢖͍͍ͨ