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

マイクロサービスとクライアント: 
理想と現実の狭間で / Ideal and Reality of microservices from the client-side

qsona
October 30, 2018

マイクロサービスとクライアント: 
理想と現実の狭間で / Ideal and Reality of microservices from the client-side

Microservices Meetup vol.9 (FiNC App & Frontend) でのウェルカムトークの資料です。

qsona

October 30, 2018
Tweet

More Decks by qsona

Other Decks in Technology

Transcript

  1. ϚΠΫϩαʔϏεͱΫϥΠΞϯτ: 

    ཧ૝ͱݱ࣮ͷڱؒͰ
    @qsona / FiNC Technologies Inc.
    2018-10-30 Microservices Meetup vol.9 

    (FiNC App & Frontend)

    View Slide

  2. ୈ1෦: ϚΠΫϩαʔϏεͷ݁߹ϨΠϠʔ

    View Slide

  3. ϚΠΫϩαʔϏεͷྑ͞
    !3
    • ٕज़ҟ࣭ੑ
    – ͦΕͧΕ࠷దͳݴޠɾϥΠϒϥϦɾσʔλετΞ౳Λར༻Ͱ͖Δ
    – ٕज़తෛ࠴ΛҾ͖ͣΓʹ͍͘
    • ճ෮ੑ (Resilience)
    – αʔϏεʹো֐͕ى͖ͯ΋શମ΁ͷӨڹ͸গͳ͍
    • σϓϩΠͷಠཱ
    • খࣗ͘͞཯ɾಠཱͨ͠૊৫
    – ίϛϡχέʔγϣϯύεΛݮΒ͠ɺҙࢥܾఆΛૉૣ͘

    View Slide

  4. αʔϏεͷૄ݁߹͔ΒདྷΔ
    ߴ͍ࣗ༝౓ɾࣗ཯

    View Slide

  5. αʔϏε͕ີ݁߹ʹͳΔͱ
    ϚΠΫϩαʔϏεͷྑ͞͸ফ͑Δ

    View Slide

  6. ϚΠΫϩαʔϏεΛ݁߹͢Δऀୡ
    ... ݁߹ϨΠϠʔΛཧղ͠ɺ
    ద੾ʹରॲ͠ͳ͚Ε͹ͳΒͳ͍
    ࣄۀܭը, ΠϯϑϥετϥΫνϟ, ϑϩϯτΤϯυ, Ӧۀ, ԣஅతͳϏδωε,
    εΩϧηοτ, σʔλ෼ੳ, ηΩϡϦςΟ, ίετϚωδϝϯτ, etc..

    View Slide

  7. ݁߹ͷྫ (1) ϚΠΫϩαʔϏεͱӦۀ
    !7
    • ;ͭ͏Ӧۀελοϑ͸ɺಛఆͷϚΠΫ
    ϩαʔϏεத৺ͷ૊৫ʹଐ͞ͳ͍
    • ͔͠͠ɺ΋͠ଐ͍ͯͨ͠Βʁ
    – Ӧۀελοϑ͕ࣗ෼ͷαʔϏεʹৄ͍͠
    – αʔϏεͷมߋʹڧ͍ (αʔϏεʹมߋ͕͋ͬ
    ͨͱ͖ʹ౰વӦۀελοϑʹप஌͞ΕΔ)
    – Ӧۀઌ͔ΒͷϑΟʔυόοΫ͕࣮૷ʹ൓ө͞
    Ε΍͍͢
    – αʔϏε΁ͷڧ͍Ѫண͕࣋ͯΔ
    ϚΠΫϩαʔϏενʔϜA ϚΠΫϩαʔϏενʔϜB
    ΫϥΠΞϯτ(Ӧۀઌ)

    View Slide

  8. ݁߹ͷྫ (1) ϚΠΫϩαʔϏεͱӦۀ
    !8
    • ΋ͪΖΜ͜Ε͸ΤϯυϢʔβʔΛແࢹ
    ͨ͠ص্ͷۭ࿦
    – ϚΠΫϩαʔϏε(ػೳ)୯ҐͰӦۀ͞Εͯ΋

    ސ٬͸خ͘͠ͳ͍
    – ΤϯυϢʔβʔ͸ϚΠΫϩαʔϏε͕౷߹͞
    ΕͨମݧΛ๬ΜͰ͍Δ
    ϚΠΫϩαʔϏενʔϜA ϚΠΫϩαʔϏενʔϜB
    ΫϥΠΞϯτ(Ӧۀઌ)

    View Slide

  9. ݁߹ͷྫ (1) ϚΠΫϩαʔϏεͱӦۀ
    !9
    • ӦۀνʔϜ͸ϚΠΫϩαʔϏεΛ౷߹
    ͢Δ (݁߹ϨΠϠʔ)
    • νʔϜΛ·͕ͨͬͨίϛϡχέʔγϣ
    ϯͷऔΓํΛߟ͑Δඞཁ͋Γ
    ϚΠΫϩαʔϏενʔϜA ϚΠΫϩαʔϏενʔϜB
    ΫϥΠΞϯτ(Ӧۀઌ)
    ӦۀνʔϜ

    View Slide

  10. ݁߹ͷྫ (2) ϚΠΫϩαʔϏεͱԣஅϏδωε
    !10
    • ෳ਺ͷϚΠΫϩαʔϏεΛԣஅతʹར༻͢Δ
    ϏδωεϞσϧ
    • FiNCͰͷྫ: ಛ஡εϚʔτΞϓϦ
    – ಛఆͷܦ࿏͔ΒΞϓϦΛΠϯετʔϧ͢Δͱ

    ಛ஡ϢʔβʔʹͳΓɺ

    ಛ஡ઐ༻ΦϯϘʔσΟϯά͕࢝·Δ
    – ಛ஡ઐ༻ϛογϣϯ͕ղ์͞ΕΔ
    – ಛ஡Ϣʔβʔ༻ʹΧελϚΠζ͞Εͨ

    push௨஌͕഑৴͞ΕΔ

    View Slide

  11. ݁߹ͷྫ (2) ϚΠΫϩαʔϏεͱԣஅϏδωε
    !11
    • ෳ਺ͷϚΠΫϩαʔϏεΛԣஅతʹར༻͢Δ
    ϏδωεϞσϧ
    • FiNCͰͷྫ: ಛ஡εϚʔτΞϓϦ
    – ಛఆͷܦ࿏͔ΒΞϓϦΛΠϯετʔϧ͢Δͱ

    ಛ஡ϢʔβʔʹͳΓɺ

    ಛ஡ઐ༻ΦϯϘʔσΟϯά͕࢝·Δ
    – ಛ஡ઐ༻ϛογϣϯ͕ղ์͞ΕΔ
    – ಛ஡Ϣʔβʔ༻ʹΧελϚΠζ͞Εͨ

    push௨஌͕഑৴͞ΕΔ
    • User Tag αʔϏε
    • Onboarding αʔϏε
    • Mission αʔϏε
    • Push௨஌ αʔϏε
    ͦΕͧΕ͕
    ϚΠΫϩαʔϏεʹରԠ

    View Slide

  12. ݁߹ͷྫ (2) ϚΠΫϩαʔϏεͱԣஅϏδωε
    !12
    • ίϛϡχέʔγϣϯܦ࿏͕ෳࡶʹͳΔ
    • ੹೚ͷॴࡏ͕͍͋·͍ʹͳΓ͕ͪ
    – ֤αʔϏε͝ͱʹରԠ͸ࡁ·͍ͤͯΔ͕…
    – end-to-end ͰͷڍಈͷνΣοΫ͕ෆे෼ͩͬͨΓ
    – ʮಛ஡εΩʔϜʯͱ͍͏ମݧͷશମΛୡ੒͢ΔͨΊͷϘʔϧ͕མͪ΍͍͢
    • ༏ઌॱҐ͚ͮͷ໰୊
    – ࣗ෼ͷαʔϏεͷλεΫͱͲͪΒΛ༏ઌͤ͞Δͷ͔
    – ಛ஡ͷ৔߹͸ʮ༏ઌॱҐ͕࠷ߴʯͰ͋Δ͜ͱ͕໌Β͔ͩͬͨͷͰɺ

    ͦ͜·Ͱ໰୊Ͱ͸ͳ͔ͬͨ

    View Slide

  13. ୈ1෦ ·ͱΊ
    !13
    • ͢΂ͯͷϚΠΫϩαʔϏε͕ૄ݁߹ͳͷ͕ཧ૝
    – ٕज़ҟ࣭ੑ, খن໛Ͱࣗ཯ͨ͠૊৫, etc...
    • ϚΠΫϩαʔϏεΛ݁߹͍ͯ͠ΔϨΠϠʔͷଘࡏ͕ݱ࣮
    • ݁߹ʹΑΓى͖͏Δ໰୊ʹର͠ɺద੾ʹରॲ͢Δඞཁ͕͋Δ
    – (۩ମࣄྫʹର͢Δղܾࡦ͸ɺࠓճ͸৮Ε·ͤΜ)
    – ͜ͷ2ͭͷࣄྫʹରͯ͠͸͋·Γ brilliant ͳղܾࡦ͸ͳ͍ɺͱ͍͏ҹ৅

    View Slide

  14. ୈ2෦: ϑϩϯτΤϯυͰͷ݁߹

    View Slide

  15. ϑϩϯτΤϯυ (Web, Native App, ...)͸
    ϚΠΫϩαʔϏεͷ݁߹ϨΠϠʔ

    View Slide

  16. ϑϩϯτΤϯυͰͷ݁߹
    !16
    • ϑϩϯτΤϯυΤϯδχΞ͸

    ΤϯυϢʔβʔΛ࠷΋ڧ͘ҙࣝ͢Δ
    – ΤϯυϢʔβʔ͕ݟ͍ͨͷ͸ϚΠΫϩαʔϏεͰ͸ͳ͍
    – ౷߹͞ΕͨϢʔβʔମݧ

    View Slide

  17. ϑϩϯτΤϯυͰͷ݁߹
    !17
    (ҎԼɺຊจΑΓҾ༻)
    ʮFOLIOͰ͸ɺBackends For FrontendsʢBFFʣΛ࠾༻͍ͯ͠Δ
    ͷͰ͕͢ɺ͜ΕʹΑͬͯ͞·͟·ͳαʔϏε΍APIΛఏڙ͢Δࡍ
    ͷ໰୊ΛΞʔΩςΫνϟతʹղܾ͠Α͏ͱࢼΈ͍ͯ·͢ɻ(தུ)

    FOLIOͷαʔϏεͰ͸ɺޱ࠲Λ؅ཧ͢ΔɺגՁΛදࣔ͢Δͱ͍ͬ
    ͨػೳ͕ɺͦΕͧΕϚΠΫϩαʔϏεͱͯ͠ػೳ͍ͯ͠·͢ɻҰ
    ํͰɺϢʔβʔ͕ݟΔը໘͔Β௚઀ݸผͷαʔϏεΛݺͼग़͢ͱɺ
    ϒϥ΢β΁ͷෛՙ͕ߴ·ΓɺੑೳྼԽͳͲͷ໰୊ΛҾ͖ىͯ͜͠
    ͠·͍·͢ɻBFFͰ֤ϚΠΫϩαʔϏεͷݺͼग़͠Λू໿͢Δ͜
    ͱͰɺ͜ΕΒͷ໰୊Λղܾ͍ͯ͠·͢ɻ·ͨBFFΛઃ͚Δ͜ͱ
    ͰɺαʔϏεUIͷ౷ҰײΛอͪ΍͍͢ͱ͍͏ར఺΋͋Γ·͢ɻϚ
    ΠΫϩαʔϏεͰଟذʹΘͨΔػೳ͕ͦΕͧΕಠཱͯ͠ಈ͍͍ͯ
    ͯ΋ɺϑϩϯτΤϯυͰ͸ɺͦΕΛू໿ͯ͠1ຕͷը໘ͰݟͤΔɻ
    Ϣʔβʔ͕ཉ͍͠ͷ͸͋͘·Ͱ΋ը໘Λ௨ͨ͡“ମݧ”ͳͷͰɺͦ
    ΕΛεϜʔζʹఏڙ͢ΔͨΊʹ֤෦ॺͱ࿈ܞͯ͠ϑϩϯτΤϯυ
    ͷҰຕͷը໘ʹू໿͢Δɻ͔֬ʹ͜Ε΋ϋϒతͳ໾ׂͰ͢Ͷʯ
    ϑϩϯτΤϯυΤϯδχΞ͸શମΛͭͳ͙“ϋϒ”ͷΑ͏ͳଘࡏ
    ΤϯδχΞʹٻΊΒΕΔίϛϡχέʔγϣϯೳྗɹࣾ಺ͷ“ϋϒ”ͱͯ͠ػೳ͢ΔϑϩϯτΤϯυΤϯδχΞϦϯάʔFOLIO ૔ݟ ༸ีࢯ - Forkwell Press

    View Slide

  18. FiNC͕औΓ૊ΜͰ͖ͨ͜ͱ
    • APIͷϦιʔεࢦ޲Խ
    • APIΨΠυϥΠϯ
    • iOS/AndroidͷઃܭΛἧ͑Δ
    • ૊৫ͷϦϑΝΫλϦϯά

    (ϏδωεͰνʔϜ෼ׂ͠ɺΫϥΠΞϯτΤϯδχΞͱ
    αʔόʔΤϯδχΞ͕ಉ͡νʔϜͰ։ൃ)
    • Backends for Frontends
    • Micro Frontends
    ※͍ͣΕ΋ࠓ೔ͷΠϕϯτͷத
    Ͱ৮ΕΔτϐοΫͰ͢

    View Slide

  19. APIͷϦιʔεࢦ޲ԽɾAPIΨΠυϥΠϯ
    !19
    • Backend API ͸ڧ͘ϦιʔεΛҙࣝ͢Δ
    – ಉ͡υϝΠϯΛද͢ͳΒಉ͡ܗࣜ
    • Backend API ͷܗࣜΛͰ͖Δ͚ͩἧ͑Δ
    – ϖʔδϯάͳͲ
    – جຊతʹن཯ΛकΔ͚ͩͰ͍͍ͷͰɺ

    όοΫΤϯυͷࣗ༝౓͕ୣΘΕΔΘ͚Ͱ͸ͳ͍
    • Ͳ͏ͯ͠΋ඞཁͳΒҳ୤Ͱ͖Δ
    • ͦ΋ͦ΋API͕ྑ͘ఆٛ͞Ε͍ͯͳ͍ͱɺ

    ΫϥΠΞϯτͰͷ݁߹ͷෛ୲͕૿͑Δ

    View Slide

  20. Backends For Frontends ͱ Micro Frontends
    !20
    • ΞʔΩςΫνϟ͔Βͷ2ͭͷΞϓϩʔν
    – ͨͩ͠ɺํ޲ੑ͸େ͖͘ҟͳΔ
    • Backends For Frontends ... ੵۃతʹ݁߹ΛҾ͖ड͚ɺෳࡶ͞ʹରॲ
    • Micro Frontends ... ݁߹ϨΠϠʔΛϑϩϯτΤϯυͷUI૚ʹͣΒ͠ɺബ͘͢Δ

    View Slide

  21. ΤϯυϢʔβʔʹͱͬͯͷཧ૝
    ։ൃऀɾ૊৫ʹͱͬͯͷཧ૝
    ͦΕΒΛݱ࣮ʹམͱ͠ࠐΉ

    View Slide