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

大規模Angular in 現場 / Large scale Angular in real world

大規模Angular in 現場 / Large scale Angular in real world

2018/6/26 市ヶ谷Geek★Night #18にて発表した資料です。

OKUNOKENTARO

June 26, 2018
Tweet

More Decks by OKUNOKENTARO

Other Decks in Technology

Transcript

  1. େن໛"OHVMBSJOݱ৔
    +VO ࢢϲ୩(FFL˒/JHIU
    !PLVOPLFOUBSP

    View Slide


  2. w Ԟ໺ݡଠ࿠!PLVOPLFOUBSP
    w גࣜձࣾϐΫηϧάϦ
    ο
    υ
    w "OHVMBS+BQBO6TFS(SPVQ

    View Slide

  3. ࣥච
    IUUQTCPPLJNQSFTTDPKQCPPLT

    View Slide

  4. ͲΕΛ࢖͑͹͍͍
    ʁ
    w "OHVMBS
    w 3FBDU
    w 7VFKT

    View Slide

  5. ͲΕΛ࢖͑͹͍͍
    ʁ
    w "OHVMBS
    w 3FBDU
    w 7VFKT
    ޷͖ʹ͠Ζ

    View Slide

  6. ࢲͱେن໛

    View Slide

  7. େن໛ͷྺ࢙


    IUUQTTQFBLFSEFDLDPNPLVOPLFOUBSP

    View Slide

  8. ݱࡏͷঢ়گ
    w ૯ߦ਺໿ ߦ
    ʢۭߦɺ
    ςε
    τίʔ
    υؚΉʣ

    w ૯ϑΝΠϧ਺ ϑΝΠϧ
    ʢςε
    τؚΉʣ

    w ։ൃମ੍
    w ϑϩϯ
    τΤϯ
    υ
    ɾ
    ΤϯδχΞਓ

    View Slide

  9. ͳͥ"OHVMBSʹͨ͠ͷ͔
    w ։ൃ։࢝࣌"OHVMBSWYΛબ୒
    w ࠓճ͸"OHVMBS+4ΞϓϦέʔγϣϯͷϦ
    ϓϨʔεͩͬͨ

    ʢͳ͓ฐࣾ͸डୗઐ໳ͳͷͰϦ
    ϓϨʔε͸ΫϥΠΞϯ
    τଆͷҙ޲ʣ

    w "OHVMBS+4൛Λ։ൃͨ͠ελοϑ͕ͦͷ··։ൃΛ͢Δ͜ͱ΋͋Γ

    "OHVMBSΛબ୒
    w ͦ͜ʹ"OHVMBS+BQBO6TFS(SPVQͷ!PLVOPLFOUBSP͕ೖࣾ

    View Slide

  10. ͳͥେن໛ʹͳͬͨͷ͔
    w "OHVMBS+4൛ͷը໘਺͕΂Β΅͏ʹଟ͍
    w ը໘Ҏ্
    w ը໘಺ͷػೳ΋ଟ͍
    w ͦͷΞϓϦͷϦ
    ϓϨʔεͳ࣌఺Ͱن໛ͷ༧૝͕ͭ͘

    View Slide

  11. ͳͥখن໛ʹ͠ͳ͔ͬͨͷ͔
    w ը໘ΛΞϓϦʜͱ·Ͱ͸͍͔ͣͱ΋

    ͳ͍͔ͥͭ͘ͷΞϓϦʹ෼ׂ͠ͳ͔ͬͨͷ͔
    w "OHVMBS+4൛։ൃ࣌୅ʹઃܭίʔ
    υ
    ϨϏϡʔͱ͍͏֓೦͕ͳ͘

    ͦΕͧΕͷελοϑ͕ɺ
    ͦΕͧΕʹ࡞ͬͨ
    w ݁Ռతʹɺ
    ͦͷελοϑ͕୲౰͍ͯ͠ͳ͍ը໘Λमਖ਼͢Δͱ͖ͷίε
    τ͕૿େ
    w ͦͷ൓ল͔Β
    ʢ"OHVMBS͕41"ʹ޲͍͍ͯΔͱ͍͏໡৴΋Ճຯͯ͠ʣ

    ௒ڊେ4JOHMF1BHF"QQMJDBUJPOʹ͠Α
    ͏
    ͱ͍͏ํ਑ʹͳͬͨ

    View Slide

  12. ઌʹ݁࿦Λݴ͏
    w ෼͚Ζ

    View Slide

  13. େن໛ͷޭͱࡑ

    View Slide

  14. େن໛ʹͯ͠Α͔ͬͨ఺
    w ͋ΒΏΔը໘ΛͲͷΑ
    ͏ʹۉҰʹ࣮૷͢Δ͔ɺ
    ઃܭΛೖ೦ʹߦͬͨ
    w େن໛։ൃ͕͢Ͱʹ༧૝Ͱ͖ͨ͜ͱ͔Βɺ
    νʔϜͷਓ਺͕૿͑Δ͜ͱ΋༧૝Ͱ͖ͨ
    w ୭͕։ൃͯ͠΋ಉ͡ʹͳΔΑ
    ͏ͳݎ͍ΞʔΩςΫνϟʹͨ͠
    w %%%ͷಋೖɺ
    $234ʹΑΔઃܭ
    w ͜ͷลͷϊ΢ϋ΢͸Ҏ߱ͷաڈεϥΠ
    υʹͯ

    View Slide

  15. େن໛ʹͯ͠Α͔ͬͨ఺
    w ࣮͸͜Ε
    ʮେن໛ʹͯ͠Α͔ͬͨʯ
    Ͱ͸ͳ͘
    ʮઃܭͯ͠Α͔ͬͨʯ
    ʹ͗͢ͳ͍
    w ୭͕Ͳͷը໘Λ࣮૷ͯ͠΋ಉ͡Α
    ͏ͳίʔ
    υʹͳΔͷ͸

    ࣮ࡍϝ
    Ϧ
    ο
    τͩͬͨ
    w େن໛͸ɺ
    ઃܭͷϝ
    Ϧ
    ο
    τΛ্ճ͍ͬͯ͘
    σϝ
    Ϧ
    ο
    τΛ๊͑ͨ

    View Slide

  16. େن໛ʹͯ͠ޙչͨ͠఺
    w ޙչ࢝͠Ίͨͷ͸։ൃ։͔࢝Β೥൒ܦ͔ͬͯΒ͘
    Β͍
    w ͦΕ·Ͱ΋ޙչͷલஹ͸͕͋ͬͨɺ
    ͍ͭ΋ߟ͑ͳ͍Α
    ͏ʹ͍ͯͨ͠
    w ·͞ʹޙչઌʹཱͨͣ
    w ͷൃදͰ΋৮ΕͨΑ
    ͏ʹ
    w Ϗϧυ͕஗͍ɺ
    ςε
    τ͕஗͍ɺ
    $*͕஗͍

    View Slide

  17. ஗͞
    w ෺ཧతͳ
    ʮϏϧυͷ஗͞ʯ
    ͸શελοϑͷ։ൃޮ཰Λஶ͘͠Լ͛Δ
    w ϚγϯͷਐԽΛ΋ͬͯͯ͠΋ສߦϏϧυʹ͸ఢΘͳ͍

    ʢ"OHVMBSWͰগ͠Ϛγʹͳͬͨʣ

    w ͜Ε͔Βେ͖͍ΞϓϦΛ։ൃ͢Δॾࢯʹஔ͔Εͯ͸

    ৗʹϏϧ
    υ଎౓ͷ௿ԼΛ๷͙ͨΊͷ͋ΒΏΔࢪࡦΛߨ͡Δ΂͖

    View Slide

  18. େن໛͸Ұ࿇୑ੜ
    w Ұ౓େن໛ʹ࡞ΓࠐΜͰޙ͔Βͷ෼ׂ͸ݫ͍͠

    ʢ޻਺
    ɾ
    ༧ࢉ໘ɺ
    ج൫ൈ͖ग़͠ͷ೉͠͞ʣ

    w େن໛ʹͳΔͱΘ͔͍ͬͯΔͳΒ͹ɺ

    Έ͢Έ͢େن໛ʹਐΜͰ͍͘ͷ͸ߟ͑௚ͨ͠΄͏͕͍͍
    wʮ"OHVMBS͸େن໛͕ಘҙʯ
    ͱ͍͏ҙݟ͕͋ͬͨͱͯ͠΋

    ʮେن໛ʹ͢΂͖ʯ
    ͱ͸ҟͳΔ
    w "OHVMBSͩΖ͏͕ԿͩΖ͏͕େن໛͸஗͘ͳΔ
    w ͦ΋ͦ΋େن໛։ൃΛ͠ͳ͍

    View Slide

  19. ࠓ΍ΔͳΒͲ͏͢Δ͔
    w ը໘୯ҐͰΞϓϦΛෳ਺ɺ
    ج൫͸ڞ௨ίʔ
    υΛ࢖༻
    w ը໘ؒભҠ͸ී௨ʹϖʔδߋ৽
    w ը໘ؒσʔλڞ༗͸ɺ
    εΩʔϚΛ͔ͬ͠Γఆٛͨ͠

    63-2VFSZ -PDBM4UPSBHF 4FTTJPO4UPSBHF PS#BDLFOE

    View Slide

  20. 5IBOLZPV
    ߴ଎Խ͸·ͣ։ൃ؀ڥ͔Β

    View Slide