大規模開発に打ち勝つためのマルチパラダイム / Beat with multi paradigms

2018/6/16 ng-japan 2018にて発表した資料です。

Transcript

1. େن໛։ൃʹଧͪউͭͨΊͷ

   ϚϧνύϥμΠϜ
   +VO OHKBQBO
   !PLVOPLFOUBSP
   

   View Slide

2. ୭
   w Ԟ໺ݡଠ࿠!PLVOPLFOUBSP
   w גࣜձࣾϐΫηϧάϦ
   ο
   υ
   w OHKBQBO
   

   View Slide

3. $PEF(SJE
   ϑϩϯτΤϯυʹؔΘΔਓʑͷΨΠυ
   ֹ݄ԁʢ੫ࠐԁʣ

   ΫϨδοτΧʔυɺ1BZ1BMͰͷ͓ࢧ෷͍ͷ৔߹͸೔ؒͷແྉߪಡظؒ
   

   View Slide

4. ࣥච
   IUUQTCPPLJNQSFTTDPKQCPPLT
   

   View Slide

5. ͋Β͢͡
   

   View Slide

6. ͜͜·Ͱͷ͋Β͢͡
   
   
   IUUQTTQFBLFSEFDLDPNPLVOPLFOUBSP
   

   View Slide

7. ݱࡏͷঢ়گ
   w ૯ߦ਺໿ ߦ
   ʢۭߦɺ
   ςε
   τίʔ
   υؚΉʣ
   
   w ૯ϑΝΠϧ਺ ϑΝΠϧ
   ʢςε
   τؚΉʣ
   
   w ։ൃମ੍
   w ϑϩϯ
   τΤϯ
   υ
   ɾ
   ΤϯδχΞਓ
   

   View Slide

8. ೔ʑɺ
   ໰୊͕෾ग़
   w ઃܭ͸Ͳ͏͢Δ͔
   w ίʔ
   υͷॏෳ͕සൟʹੜ·ΕΔ໰୊͸Ͳ͏͢Δ͔
   w ͦͯ͠Կ౓΋มΘΔ࢓༷ॻʜ
   

   View Slide

9. ໰୊ղܾͷࠔ೉͞
   w ͋ΒΏΔঢ়گΛ৐Γӽ͑Δਖ਼ղ͸ɺ
   ͻͱͭͰ͸ͳ͍
   w ਖ਼ղ͕ݟ͔ͭΒͳ͍͜ͱ͢Β͋Δ
   w ίʔ
   υΛॻ࣌ؒ͘Α
   Γɺ
   ܾஅʹඅ΍͕࣌ؒ͢ଟ͍೔΋͋Δ
   w ܾஅ͕ɺ
   ൒೥ޙͷޙչΛট͘
   ͜ͱ΋͋Δ
   

   View Slide

10. Ҿ͖ग़͠Λଟ࣋ͭ͘
    wʮલʹಡΜͩ͋ͷຊͰ͸ʙʯ
    
    wʮ͋ͷਓ͕࿩͍ͯͨ͠ͷ͸ʙʯ
    
    wʮ࠷ۙ؍ͨΧϯϑΝϨϯεͩͱʙʯ
    

    View Slide

11. ϓϩάϥϛϯά
    ɾ
    ύϥμΠϜ
    

    View Slide

12. w ϓϩάϥ
    ϛϯάʹ͓͚Δ఩ֶͷ֓೦ɺ
    ղऍΛҙຯ͢Δ
    w खଓ͖ܕϓϩάϥ
    ϛϯά
    w ΦϒδΣΫ
    τࢦ޲ϓϩάϥ
    ϛϯά
    w ؔ਺ܕϓϩάϥ
    ϛϯά
    ϓϩάϥϛϯά
    ɾ
    ύϥμΠϜ
    

    View Slide

13. w ࣌୅ͷਐߦ
    w ٕज़ͷਐาɺ
    ٕज़త੍໿͔Βͷղ์
    w ੓࣏తͳࣄ৘
    w աڈͷผݴޠͷ൓লͱվળ
    ͳͥݴޠ͸ෳ਺͋Δͷ͔
    

    View Slide

14. w +BWB4DSJQU
    w खଓ͖ܕɺ
    ΦϒδΣΫ
    τࢦ޲ͳͲ
    w 5ZQF4DSJQU
    w ؔ਺ܕɺ
    δΣωϦ
    οΫͳͲ
    ͋ͳͨͷಘҙͱ͢Δݴޠ͸
    ʁ
    

    View Slide

15. w ύϥμΠϜ͸࣍ʑ
    ͱฤΈग़͞ΕΔ
    w ࣗ෼ͷۀ຿্ѻ͍ͬͯΔݴޠͷΈ͔͠৮͍ͬͯͳ͍ͱɺ
    

    ৽͍͠ύϥμΠϜʹ৮ΕΔػձ͕ͳ͍
    w ੵۃతʹଞͷύϥμΠϜʹ৮ΕͯΈΔ
    w ໰୊ղܾͷҾ͖ग़͠Λ޿͛Δ
    ෆ׳ΕͳύϥμΠϜʹ৮ΕΔ
    

    View Slide

16. ϚϧνύϥμΠϜΛऔΓೖΕ࣮ͨྫ
    

    View Slide

17. w ֮͑ͨύϥμΠϜΛҋӢʹೖΕͳ͍
    w खஈͷ໨తԽ͸ආ͚Δ
    w ΤϯδχΞͷࣗݾຬ଍ʹͯ͠͸ͳΒͳ͍
    w ࠓճ͸ϚϧνύϥμΠϜʹ͢΂͖ͱड़΂͍ͨΘ͚Ͱ͸ͳ͍
    w ໰୊ղܾʹ޲͚ͨൃ૝Λॊೈʹ͢ΔͨΊͷΤΫααΠζͰ͋Δͱଊ͑Δ
    w έʔεόΠέʔεͰͷۛຯ͕ඞཁ
    ஫ҙ
    

    View Slide

18. w ܖ໿ʹΑΔઃܭɺ
    %FTJHOCZ$POUSBDU %C$ͱ΋
    w ͋Δϝ
    ιο
    υΛݺͿͱ͖ɺ
    ݺͿଆͰอূ͢΂͖ෆม৚݅ɺ
    ࣄલ৚͕݅ຬͨ͞ΕΔ
    w Ͱ͋Ε͹
    w ͦͷϝ
    ιο
    υͷऴྃ࣌ʹอূ͢΂͖ෆม৚݅ɺ
    ࣄޙ৚͕݅ຬͨ͞ΕΔ
    w ࣮૷ͷޡΓͳͷ͔ɺ
    ϝ
    ιο
    υΛ࢖͏ଆͷޡΓ͔ΛϋοΩ
    Ϧͤ͞Δ
    ܖ໿ϓϩάϥϛϯά
    

    View Slide

19. w console.assert() + unassert΍JOWBSJBOU͕Φεεϝ

    `npm i invariant`
    w ಋೖ؆୯
    w ܖ໿ϓϩάϥ
    ϛϯάͷ׬શ࠶ݱ͸Ͱ͖ͳ͍͕

    ʮ࣮૷ͷޡΓͳͷ͔ɺ
    ϝ
    ιο
    υΛ࢖͏ଆͷޡΓ͔ΛϋοΩ
    Ϧͤ͞Δʯ
    

    Λڗड͢ΔͨΊͷΞϓϩʔν
    w +BWB4DSJQU։ൃʹ͓͍ͯ͸๷ޚతϓϩάϥ
    ϛϯάɺ
    ૣظϦλʔϯͳͲ΋

    ஌ࣝͱͯ͠༗༻
    "OHVMBSͳΒ͹
    

    View Slide

20. w ԣஅతؔ৺ࣄ
    ʢΞεϖΫ
    τʣ
    Λڞ௨Խ࣮ͯ͠ߦ͢ΔͨΊͷϓϩάϥ
    ϛϯάख๏
    w ༗໊ͳྫͱͯ͠͸ϩάग़ྗ
    w ͋ΒΏΔϞδϡʔϧɺ
    ͋ΒΏΔϝ
    ιο
    υͰϩάͷग़ྗ͸༗༻
    w ͨͩ͠ɺ
    ͦΕΒ͢΂ͯʹϩάग़ྗ༻ͷίʔ
    υ͕ॻ͔Ε͍ͯͨΒ

    ຊ౰ʹॏཁͳॲཧΛࣔ͢ίʔ
    υ͕ຒ΋Εͯ͠·
    ͏
    w ෭࣍తͳॲཧԣஅతؔ৺ࣄΛ෼཭͠ຒ΋Εͳ͍Α
    ͏ʹ͢Δख๏
    ΞεϖΫ
    τࢦ޲ϓϩάϥϛϯά
    

    View Slide

21. w "OHVMBS։ൃऀʹ͸͓ͳ͡Έɺ
    %FDPSBUPSΛ࢖͏
    w Ϋϥε໊΍ϝ
    ιο
    υ໊ͷ্ʹ%FDPSBUPSͱͯ͠෼཭ͨؔ͠਺Λهड़
    wʮϩάΛग़ྗͤΑʯ
    ͱ͍͏ॲཧ͸%FDPSBUPS಺෦ʹӅṭͭͭ͠ϩάग़ྗΛୡ੒
    w %FDPSBUPSॲཧ಺Ͱ͸

    1SPYZύλʔϯ (P'
    ΍Ϧ
    ϑ
    ϨΫγϣϯ
    ɾ
    ϓϩάϥ
    ϛϯάͳͲͷख๏͕༗༻
    w ௐࢠʹ৐ͬͯ΍Γ͗͢Δͱͨͩͷ೉ಡԽ
    "OHVMBSͳΒ͹
    

    View Slide

22. ࣮Ҋ݅Ͱͷྫ
    @KukerComponent()
    @Component({
    selector: 'app-foo-bar',
    templateUrl: './component.html',
    styleUrls: ['./component.scss'],
    })
    export class FooBarComponent {
    // ...
    }
    IUUQTHJUIVCDPNLSBTJNJSLVLFS
    

    View Slide

23. w ෭࡞༻Λ༻͍ͣʹҾ਺
    ʢೖྗʣ
    ͱ໭Γ஋
    ʢग़ྗʣ
    Λ΋ͬͨؔ਺Λ

    ͍ͭ͘΋૊Έ߹ΘͤΔ͜ͱͰॲཧΛ࣮ݱ͢Δख๏
    w +BWB4DSJQU͸ɺ
    ୈҰڃؔ਺Λѻ͑ΔͷͰ࠶ݱ͠΍͍͢
    w ؔ਺Λ͍ͭ͘΋૊Έ߹ΘͤΔͱ͍͏఺Ͱ͸3Y+4Ͱ΋͓ͳ͡Έ
    w ͪͳΈʹ3Y+4͸ϦΞΫςΟ
    ϒϓϩάϥ
    ϛϯάɺ
    એݴܕϓϩάϥ
    ϛϯά

    ͳͲͷύϥμΠϜͷ࣮ݱͰ͋Γɺ
    ؔ਺ܕϓϩάϥ
    ϛϯάͰ͸ͳ͍
    ؔ਺ܕϓϩάϥϛϯά
    

    View Slide

24. w ܕΛύϥϝʔλͱͯ͠ѻ͏
    ͜ͱͰɺ
    ಛఆͷܕʹґଘ͠ͳ͍࣮૷͕ՄೳʹͳΔ

    ϓϩάϥ
    ϛϯάख๏
    w 5ZQF4DSJQUʹ͓͍ͯ͸Array΍PromiseͳΒ͹ຖ೔࢖͍ͬͯΔ͸ͣ
    δΣωϦ
    οΫ
    ɾ
    ϓϩάϥϛϯά
    

    View Slide

25. w 0QUJPO΍&JUIFSͱ͍ͬͨؔ਺ܕݴޠ )BTLFMM 4DBMBͳͲ
    ͷٕज़Λഈआ
    w 0QUJPOͱ͸
    ʮ஋͕͋Δ͔ແ͍͔Λද͢ܕʯ
    
    w &JUIFSͱ͸
    ʮͭͷ͏
    ͪͲͪΒ͔Λද͢ܕʯ
    ؔ਺ܕ
    ɾ
    δΣωϦ
    οΫΛ૊Έ߹Θͤͯ
    

    View Slide

26. w ௐࢠʹ৐͍͖ͬͯͳΓ
    ʮϞφ
    υ΍Δͧʔʯ
    ͱ͔ݴ͍ग़ͤ͹େମҾ͔ΕΔ
    w ؔ਺ܕݴޠ͕ԿΛࠀ෰͢΂͘0QUJPO΍&JUIFSΛ࣮૷͍ͯ͠Δͷ͔Λཧղ͢Δ
    w ྫ͑͹getOrElse()ͷߟ͑ํͳͲ͸ೲಘ͞Ε΍͘͢ಋೖ͠΍͍͢
    ։ൃνʔϜͷཧղΛಘΔ
    

    View Slide

27. w ٸͳ࢓༷มߋͰɺ
    5ZQF4DSJQUͷܕ෇͚͚ͩͰ͸ݫ͍͠Օॴ͕Ͱ͖ͯͨͱ͖
    w EitherܕͰॲཧΛେ෯ʹม͑ͣʹରԠͰ͖ͳ͍ͩΖ͏͔
    w 5ZQF4DSJQUʹ͸strictNullChecks͕͋Δ͕ສશͰ͸ͳ͍
    w JGจΛڧཁͯ͘͠
    Δ͋ͨΓ
    w undefined, nullରࡦͷΞϓϩʔνͱͯ͠ࣄ৘Λ஌͓ͬͯ͘
    ͱΑ͍
    ٸస׵ʹඋ͑Δ
    

    View Slide

28. ϑϩϯ
    τΤϯ
    υ
    ɾ
    ΤϯδχΞͷ

    ଞݴޠͱͷ෇͖߹͍ํ
    

    View Slide

29. wʮϑϩϯ
    τΤϯ
    υ
    ɾ
    ΤϯδχΞ͔ͩΒ+BWB4DSJQU 5ZQF4DSJQUֶ͹ͳ͘
    ͪΌʜʯ
    
    wʮ)5.-΋$44΋΍Βͳ͍ͱʜʯ
    
    w ΋ͪΖΜͦΕ͸େࣄ
    w ҰํͰɺ
    ΤϯδχΞͱͯ͠ͷࢹ໺Λ޿͛Δ͜ͱ΋େࣄ
    ϑϩϯ
    τΤϯ
    υ
    ɾ
    ΤϯδχΞͱ
    ͯ͠
    

    View Slide

30. wʮ͜ͷݴޠͰ͸+4Ͱى͜
    Γ͕ͪͳ໰୊Λ͜͏΍ͬͯղܾͯ͠Δͷ͔ʯ
    
    w ˠ+4Ͱ΋ࣅͨΑ
    ͏ͳΞϓϩʔνͰղܾ͍ͯ͠ΔϥΠ
    ϒϥ
    Ϧ͕͋Δ
    ʂ
    
    wʮ࠷৽ͷݴޠʹ͋ͬͨ˓˓ߏจɺ
    +4ʹ΋ཉ͍͠ͳʔʯ
    
    w ˠ5$ͷϓϩϙʔβϧʹ΋͏ग़ͯΔ
    ʂ
    
    w ͱ͍ͬͨɺ
    +BWB4DSJQUք۾ΩϟονΞοϓʹ͓͚ΔΞϯςφͷຊ਺͕૿͑

    ൃݟ΍௥੻͕༰қʹͳΓɺ
    ڻ͔ͳ͘
    ͯࡁΉ
    ଞݴޠֶशͷར఺
    

    View Slide

31. w ΩϟονΞοϓ΁ͷযΓɺ
    ྲྀߦϥΠ
    ϒϥ
    Ϧ΁ͷܯռɺ
    ϑ
    ϨʔϜϫʔΫϓϩϨεͷউഊʜ
    w ͜Ε͸ࠣࡉͳ͜ͱ
    w ߄ͯΔ͜ͱ͸ͳ͍
    w ຊ࣭తͳղܾखஈ͸Կͳͷ͔Λߟ͑Δ
    w ྺ࢙ʹֶͿ
    w ύϥμΠϜʹֶͿ
    ߄ͯͳ͍ͨΊʹ
    

    View Slide

32. 5IBOLZPV
    

    View Slide