Babel plugin を作ってAST と Babel を学ぶ

【We Are JavaScripters! 3周年記念】 WeJS Festival ! で使用した資料
https://wajs.connpass.com/event/151413/

ライブコーディングで使用したコード
https://github.com/sakito21/babel-plugin-demo

Twitter
https://twitter.com/__sakito__

Transcript

1. #BCFM
   QMVHJO
   Λ࡞ͬͯ
   
 "45
   ͱ
   #BCFM
   ΛֶͿ
2. /BNF
   
   
   
   
   4BLJUP
   .VLBJ
   5XJUUFS

   
   
   
   !@@TBLJUP@@
   +PC
   
   
   
   
   
   $ZCP[V
   JOD
   

   
   
   
   
   
   
   'SPOUFOE
   &YQFSU
   5FBN

   
   
   
   
   ,BJ[FO
   1MBUGPSN
   
   
   
   
   
   
   
   'SPOUFOE
   "EWJTPS "CPVU
   NF
3. աڈʹ࿩ͨ͠಺༰͔Β
   #BCFM
   ʹϑΥʔΧεͨ͠࿩
4. w"45
   ʹ͍ͭͯ
   w#BCFM
   ʹ͍ͭͯ
   w#BCFM
   1MVHJO
   ʹ͍ͭͯϥΠϒίʔσΟϯά "HFOEB
5. "45
 "CTUSBDU
   4ZOUBY
   5SFF
   ந৅ߏจ໦
6. wϓϩάϥϜͷߏ଄ࣔͨ͠σʔλ
   wਖ਼نදݱͰ͸දݱͰ͖ͳ͍ύλʔϯʹ΋ରԠͰ͖Δ
   w+BWB4DSJQU
   Ͱ͸
   +40/
   σʔλͷܗʹͳΔ
   wجຊతͳ࢓༷͸
   &45SFF
   ʹ४ڌ͍ͯ͠Δ
   w&4
   -JOU
   #BCMF
   XFCQBDL
   ͳͲ޿͘࢖ΘΕ͍ͯΔ "45
 "CTUSBDU
   4ZOUBY
   5SFF
   ந৅ߏจ໦
7. &45SFF
 IUUQTHJUIVCDPNFTUSFFFTUSFF
8. "45
   &YQMPSFS
 IUUQTHJUIVCDPNFTUSFFFTUSFF
9. "45
   &YQMPSFS
 IUUQTHJUIVCDPNFTUSFFFTUSFF
10. #BCFMͱ͸ʁ
11. #BCFMͱ͸ʁ w+BWB4DSJQU
    ͷ
    DPNQJMFS
    w༷ʑͳ
    +BWB4DSJQU
    ͷίʔυΛม׵Ͱ͖Δ
    w +49
    ߏจ΍
    5ZQF4DSJQU
    ΋
    +BWB4DSJQU
    ʹม׵Ͱ͖Δ
12. #BCFMͷ஀ੜ wݩʑ͸
    
    UP
    
    ͱ͍͏໊લͩͬͨ
    w&4
    ͔Β
    &4
    ΁ίʔυΛม׵͢Δػೳ͔͍࣋ͬͯ͠ͳ͔ͬͨ
    w͔ͦ͜Β༷ʑͳཁ๬͕͋Γɺ#BCFM
    ʹมߋ͞Εͨ
13. ͳͥ#BCFM͕ඞཁͳͷ͔ w࢖༻Ͱ͖Δ
    +BWB4DSJQU
    ͸ϒϥ΢βʹΑͬͯҟͳΔ
    wศརͳػೳ͸࢖͍͍ͨ
    wͦ͜Ͱɺ
    ৽͍͠+
    BWB4DSJQU
    Λ
 ֤ϒϥ΢βͰ࢖༻Ͱ͖ΔΑ͏ʹ͢ΔͨΊ
    #BCFM
    Λ࢖༻͢Δ
14. #BCFMͷػೳ wߏจม׵
    wλʔήοτϒϥ΢βʹͳ͍؀ڥͷ
    1PMZpMM
    ͷఏڙ
    
    wιʔείʔυม׵
    
    DPEFNPET
    
15. #BCFM͸+BWB4DSJQUΛม׵͢Δ +BWB4DSJQU 5ZQF4DSJQU +49 +BWB4DSJQU
16. ରԠ͍ͯ͠ͳ͍ϒϥ΢β͕ଘࡏ
17. ֤ϒϥ΢βͰ࢖༻Ͱ͖Δߏจʹม׵
18. ֤ϒϥ΢βͰ࢖༻Ͱ͖Δߏจʹม׵ +BWB4DSJQU
19. ίʔυΛͲͷΑ͏ʹม׵͢Δͷ͔ʁ
20. #BCFMͷม׵ʹ͸ͭͷஈ֊͕͋Δ w1BSTJOH
    !CBCFMQBSTFS
 ιʔείʔυΛ
    "CTUSBDU
    4ZOUBY
    5SFF
    
    "45
    ʹม׵
    w5SBOTGPSNBUJPO
 "45Λม׵͢Δɺ#BCFMͷϓϥάΠϯ͕
 ͜ͷ໾ׂΛ୲͍ͬͯΔ
    w$PEF
    (FOFSBU
    !CBCFMHFOFSBUPS
 "45Λιʔείʔυʹม׵͢Δ
21. #BCFMͷม׵ʹ͸ͭͷஈ֊͕͋Δ 1BSTJOH ιʔε "45 5SBOTGPSNBUJPO "45 $PEF
    (FOFSBU ιʔε
22. ࣮ࡍʹڍಈΛ͔֬Ί͍ͯ͜͏
23. ͔͜͜ΒϥΠϒίʔσΟϯά
24. ࢖༻ͨ͠ίʔυ
 IUUQTHJUIVCDPNTBLJUPCBCFMQMVHJOEFNP
25. ͓ΘΓ