Rails 5.1.0.beta1はどのようにモダンなJavaScript開発を実現しているのか？

Ruby Kansai #77

Transcript

1. 3BJMTCFUB͸ͲͷΑ͏
   ʹϞμϯͳ+BWB4DSJQU։ൃΛ
   ࣮ݱ͍ͯ͠Δͷ͔ʁ
   
   !SJUP
   

   View Slide

2. ໨࣍
   ࣗݾ঺հ
   શମ֓ཁਤ
   3BJMTCFUBϦϦʔε
   ϑϩϯτΤϯυ։ൃ؀ڥ
   +BWB4DSJQUͷϏϧυํ๏
   +BWB4DSJQUͷಡΈࠐΈํ๏
   ·ͱΊ
   

   View Slide

3. ࣗݾ঺հ
   /BNFSJUP
   5XJUUFS!DIJNBNF@SU (JU)VC!DIJNBNF
   +PC

   XFCEFWFMPQFS

   ΫϦχοΫ޲͚਍࡯༧໿ड਍ऀ؅ཧαʔϏεΛߏங
   5FDIOPMPHZ

   3VCZ 3VCZPO3BJMT +BWB4DSJQU 3FBDU 3FEVY
   EPDLFS 'MVFOUE #JH2VFSZFUD
   

   View Slide

4. શମ֓ཁਤ
   XFCQBDL XFCQBDLEFWTFSWFS
   XFCQBDLFSHFN
   ᶃϏϧυ+4Λऔಘ
   ᶃϏϧυ+4Λऔಘ ᶄϏϧυ+4Λ౉͢
   ᶃ+4ϏϧυΛࢦࣔ
   ᶃ+4ϏϧυΛࢦࣔ
   ᶄϏϧυ+4Λੜ੒
   ᶄϏϧυ+4Λੜ੒
   GSPOUFOE
   CBDLFOE
   

   View Slide

5. 3BJMTCFUB
   ϦϦʔε
   

   View Slide

6. ৮ͬͨਓ͍·͔͢ʁ
   

   View Slide

7. Ϟμϯͳ+BWB4DSJQU։ൃ͕
   Ͱ͖ΔΒ͍͠
   

   View Slide

8. ͡Ό͋ɺ΍ͬͯΈΑ͏
   

   View Slide

9. ҎԼͷίϚϯυ͓ΑͼઃఆͰ͖Δ
   HFNJOTUBMM΋͘͠͸CVOEMFJOTUBMMͰ3BJMTCFUBΛΠϯετʔϧ͢Δɻ
   SBJMTOFX͢Δ࣌ʹXFCQBDLΦϓγϣϯΛ͚ͭͯ࡞੒͢Δɻ
   ZBSOΛΠϯετʔϧ͢Δɻ
   CVOEMFFYFDSBJMTXFCQBDLFSJOTUBMMͰXFCQBDL༻ͷ+BWB4DSJQU؀ڥͷߏங͢Δɻ TLJQCVOEMFͰOFXͨ͠৔߹
   
   CVOEMFFYFDSBJMTXFCQBDLFSJOTUBMMSFBDUͰ3FBDUKTͷ؀ڥΛߏங͢Δɻ
   (FNpMFʹGPSFNBOΛ௥Ճͯ͠ɺCVOEMFJOTUBMMʹͯΠϯετʔϧ͢Δɻ
   ΞϓϦέʔγϣϯ3PPUʹCJOSBJMTTͱCJOXFCQBDLEFWTFSWFS ΋͘͠͸CJOXFCQBDLXBUDIFS
   ͷͭͷίϚϯ
   υΛهࡌͨ͠1SPDpMFΛ௥Ճ͢Δɻ
   DPOpHFOWJSPONFOUTEFWFMPQNFOUSCͷDPOpHYXFCQBDLFS<EFW@TFSWFS@IPTU>IUUQMPDBMIPTUΛίϝ
   ϯτΠϯ͢Δɻ
   CVOEMFFYFDSBJMTHTDB⒎PMETBNQMFͰTBNQMFͷDPOUSPMMFS΍WJFX౳Λ࡞੒͢Δɻ
   TBNQMFTͷJOEFYIUNMFSCʹKBWBTDSJQU@QBDL@UBHIFMMP@SFBDUͷهड़Λ௥Ճ͢Δɻ
   ඞཁͰ͋Ε͹CVOEMFFYFDSBJMTECNJHSBUFͰNJHSBUFΛ࣮ߦ͓ͯ͘͠ɻ
   CVOEMFFYFDGPSFNBOTͰ3BJMT͓ΑͼXFCQBDLEFWTFSWFSΛىಈͤ͞Δɻ
   ϒϥ΢βʹͯIUUQMPDBMIPTUTBNQMFTΛ։͘ͱ)FMMP3FBDUͱදࣔ͞Εɺ3FBDUKT͕ಈ͍͍ͯΔ͜ͱΛ֬ೝ͢
   Δɻ
   

   View Slide

10. ཁ఺͚ͩઆ໌͠·͢
    

    View Slide

11. ϑϩϯτΤϯυͷ։ൃ؀ڥ
    

    View Slide

12. CVOEMFFYFDSBJMTXFCQBDLFSJOTUBMMSFBDU
    ίϚϯυͰ࡞੒͞ΕΔ؀ڥ
    ☑SBJMTOFX࣌ʹXFCQBDLΛࢦఆ͢Δ
    ͱXFCQBDLFSͱ͍͏HFN͕ೖΔɻ
    ☑XFCQBDLFSͷHFOFSBUPS͸ैདྷͷ
    +BWB4DSJQU഑ஔ৔ॴͱ͸ҟͳΔ৔ॴ
    ʹ+BWB4DSJQUϑΝΠϧΛ഑ஔ͢Δɻ
    ☑ZBSO΍XFCQBDLͷίϚϯυΛεΫϦ
    ϓτʹ࣮ͯߦͰ͖Δɻ
    ☑XFCQBDLͷઃఆϑΝΠϧΛ഑ஔ͢Δ
    ৔ॴ͕৽ͨʹ࡞ΒΕΔɻ
    

    View Slide

13. +BWB4DSJQUͷϏϧυํ๏
    

    View Slide

14. +BWB4DSJQUͷ഑ஔ৔ॴ͕ҟͳΔ
    ˒ ࠓ·Ͱ͸zBQQBTTFUTKBWBTDSJQUTzɻ

    ࡞੒ͯ͠΋ͷ͸zBQQKBWBTDSJQUzɻ

    ˠBTTFUT؅ཧԼ͔Β֎ΕͯΔ
    ˒ ͳͷͰzBQQBTTFUTKBWBTDSJQUTBQQMJDBUJPOKTz
    Ͱ΋ಡΈࠐ·ͳ͍ɻ

    ˠͲ͏΍ͬͯCVJMEͯ͠Δͷʁ
    

    View Slide

15. XFCQBDL
    

    View Slide

16. Ϗϧυͷ࣮ߦํ๏Λͭఏڙ
    ˒ CJOXFCQBDLEFWTFSWFSˠEFWઐ༻
    ˒ CJOXFCQBDL XBUDIFS
    
    ༧Ί3BJMTͰ࣮ߦ͢ΔεΫϦϓτΛछྨ༻ҙ͍ͯ͠Δ
    

    View Slide

17. Ϗϧυ͢ΔϑΝΠϧͷಡΈࠐΈઃఆ
    FOUSZHMPCTZOD QBUIKPJO BQQ KBWBTDSJQU QBDLT KT
    
    SFEVDF
    NBQ FOUSZ
    \
    DPOTUCBTFOBNFQBUICBTFOBNF FOUSZ FYUOBNF FOUSZ
    
    
    DPOTUMPDBM.BQNBQ
    MPDBM.BQQBUISFTPMWF FOUSZ
    
    SFUVSOMPDBM.BQ
    ^ \^
    
    \IFMMP@SFBDUlઈରύεIFMMP@SFBDUKTYz^
    DPOpHXFCQBDLTIBSFEKTͷFOUSZ෦෼͕ͦΕʹ֘౰
    ͢ΔɻσϑΥϧτͰ͸ϑΝΠϧ໊ΛΩʔʹɺύεΛ஋
    ͱͯ͠࿈૝഑ྻΛઃఆ͍ͯ͠Δɻ
    

    View Slide

18. CJOXFCQBDLEFWTFSWFSͰ
    ͷϏϧυ
    ⚙ 3BJMTαʔόͱ͸ผʹXFCQBDL༻ͷαʔ
    όʢXFCQBDLEFWTFSWFSʣ͕ىಈ͢
    Δɻ
    ⚙ XFCQBDLEFWTFSWFS͸FOUSZϑΝΠ
    ϧΛϏϧυͯ͠+BWB4DSJUQϑΝΠϧΛ
    ฦ͢͜ͱ͕ՄೳͰ͢ɻ
    ͳͷͰIUUQMPDBMIPTUpMFOBNFKTͰ
    ϑΝΠϧʹΞΫηεͰ͖Δɻ
    

    View Slide

19. CJOXFCQBDLͰͷϏϧυ
    ⚙DPOpHXFCQBDLTIBSFEKTʹ্
    هͷPVUQVUઃఆ͕ͨΊɺQVCMJD
    ഑ԼʹϏϧυͨ͠+BWB4DSJQU
    ϑΝΠϧ͕ੜ੒͞ΕΔɻ
    PVUQVU\
    pMFOBNFbKT
    QBUIQBUISFTPMWF QVCMJD EJTU%JS
    
    ^
    

    View Slide

20. +BWB4DSJQUͷಡΈࠐΈํ๏
    

    View Slide

21. BTTFUT഑Լ͡Όͳ͍ͷʹͲ͏΍ͬ
    ͯಡΈࠐΜͰΔͷʁ
    

    View Slide

22. +BWB4DSJQUͷಡΈࠐΈ͸ҎԼ
    ͷهड़Λ7JFXʹ௥Ճ
    KBWBTDSJQU@QBDL@UBHIFMMP@SFBDU
    

    View Slide

23. KBWBTDSJQU@QBDL@UBHͷιʔε
    SFRVJSFXFCQBDLFSTPVSDF
    NPEVMF8FCQBDLFS)FMQFS
    EFGKBWBTDSJQU@QBDL@UBH OBNF PQUJPOT
    
    KBWBTDSJQU@JODMVEF@UBH
    8FCQBDLFS4PVSDFOFX OBNF
    QBUI
    PQUJPOT
    
    
    FOE
    FOE
    KBWBTDSJQU@JODMVEF@UBHΛݺΜͰΔ͚Ͳɺ
    QBUI෦෼͸ԿΛࢦఆ͍ͯ͠Δͷ͔ʁ
    

    View Slide

24. 8FCQBDLFS4PVSDFͷιʔε
    DMBTT8FCQBDLFS4PVSDF
    ʜ
    EFGQBUI
    JGDPOpH<EFW@TFSWFS@IPTU>QSFTFOU
    \DPOpH<EFW@TFSWFS@IPTU>^\pMFOBNF^
    FMTJGDPOpH<EJHFTUJOH>
    'JMFKPJO EJTU@QBUI EJHFTUFE@pMFOBNF
    
    FMTF
    'JMFKPJO EJTU@QBUI pMFOBNF
    
    FOE
    FOE
    QSJWBUF
    ʜ
    EFGEJHFTUFE@pMFOBNF
    8FCQBDLFS%JHFTUTMPPLVQ OBNF
    
    FOE
    EFGEJTU@QBUI
    DPOpH<QBDLT@EJTU@QBUI>σϑΥϧτͰ͸`QBDLT`
    FOE
    EFGpMFOBNF
    \OBNF^KT
    FOE
    FOE
    EFW@TFSWFS@IPTUͷઃఆ͕
    ͋Ε͹ɺ͔ͦ͜Βऔಘ͢Δɻ
    ͳ͚Ε͹EJHFTU΋͘͠͸௚
    ઀औಘ͢Δɻ
    

    View Slide

25. CJOXFCQBDLEFWTFSWFSͰ
    ͷಡΈࠐΈ
    XFCQBDLEFWTFSWFS͸ผαʔόͰ+BWB4DSJQU
    ϑΝΠϧ͕ੜ੒͞ΕΔͷͰzผαʔόΛ3BJMTʹ
    ڭ͑Δඞཁ͕͋Δɻ

    ˠͦΕ͕ઌఔͷEFW@TFSWFS@IPTUͷઃఆ
    3BJMTBQQMJDBUJPODPOpHVSFEP
    .BLFKBWBTDSJQU@QBDL@UBHMPBEBTTFUTGSPNXFCQBDLEFWTFSWFS
    DPOpHYXFCQBDLFS<EFW@TFSWFS@IPTU>IUUQMPDBMIPTU
    ʜ
    FOE
    ˠDPOpHFOWJSPONFOUTEFWFMPQNFOUSCͷ
    ɹهࡌΛίϝϯτΠϯ͢Δɻ
    

    View Slide

26. CJOXFCQBDLͰͷಡΈࠐΈ
    EFW@TFSWFS@IPTUͷઃఆ͕ͳ͚
    Ε͹1VCMJD഑Լ͕ී௨ʹಡΈࠐ
    ·ΕΔɻ
    

    View Slide

27. KBWBTDSJQU@QBDL@UBHIFMMP@SFBDU
    +BWB4DSJQUͷಡΈࠐΈ
    ઃఆʹΑΓXFCQBDLEFWTFSWFS΋͘͠͸XFCQBDL
    ͔ΒͷϏϧυ+BWB4DSJUQΛಡΈࠐΜͰ͘ΕΔɻ
    

    View Slide

28. શମ֓ཁਤ ͓͞Β͍
    
    XFCQBDL XFCQBDLEFWTFSWFS
    XFCQBDLFSHFN
    ᶃϏϧυ+4Λऔಘ
    ᶃϏϧυ+4Λऔಘ ᶄϏϧυ+4Λ౉͢
    ᶃ+4ϏϧυΛࢦࣔ
    ᶃ+4ϏϧυΛࢦࣔ
    ᶄϏϧυ+4Λੜ੒
    ᶄϏϧυ+4Λੜ੒
    GSPOUFOE
    CBDLFOE
    

    View Slide

29. ·ͱΊ
    3BJMTࣗମͰϞμϯͳ+BWB4DSJQU։ൃΛ࣮ݱͯ͠
    ͍ΔͷͰ͸ͳ͍ɻ
    8FCQBDLFSಋೖͰϞμϯͳ+BWB4DSJQU։ൃ؀ڥ
    ͱͷڮ౉͠Λ͍ͯ͠Δɻ
    

    View Slide