Gatsby.jsでWordPressのフロントエンドを作る

[京都] Kansai WordPress Meetup #2 @京都「今年もお疲れ様でした会」 のスライド

Transcript

1. (BUTCZKTͰ

   8PSE1SFTTαΠτͷ

   ϑϩϯτΤϯυΛ࡞Δ
   %BJTVLF,0/*4)*
   

   View Slide

2. Daisuke KONISHI
   w ޷͖ͳ΋ͷ͸ɺԻָɺञɺϥʔϝϯ
   w དྷ೥͸খ͍͞ΞϓϦͭ͸࡞Δ
   w ಉ͍೥͘Β͍ͷಉۀऀΛ୳ͯ͠਺೥໨
   DPSPVUJOFJOD8FCΤϯδχΞ
   !TLE@OX
   

   View Slide

3. View Slide

4. View Slide

5. ࠓ೔ͷ࿩
   ʁʁʁʮ(BUTCZ͍ͬͯ͏੩తαΠτδΣωϨʔ
   λʔͰɺ8PSE1SFTTͷσʔλ࢖ͬͯαΠτ͕

   ࡞ΕΔΒ͍͠Αʯ
   ʁʁʁʮϫʔΦϞγϩι΢΍ͬͯΈΑ

   ࣌ؒग़དྷͨΒ
   ʯ
   

   View Slide

6. w 8PSE1SFTTͰϒϩάΛ΍͍ͬͯΔ
   w +BWB4DSJQU͸޷͖
   w ࠷ۙՋͳΜͩΑͶ
   ͳਓ͸΍ͬͯΈΔͱ໘ന͍͔΋ʁ
   

   View Slide

7. (BUTCZͰαΠτΛ࡞Δͱ
   

   View Slide

8. View Slide

9. 3&45"1*
   

   View Slide

10. αΠτΛ࡞Δ·ͰͷྲྀΕ
    8PSE1SFTTͰαΠτΛ্ཱ͓ͪ͛ͯ͘
    (BUTCZͷ؀ڥΛ࡞੒

    $-*πʔϧͷಋೖɺαΠτͷ਽ܗΛ࡞੒
    
    (BUTCZϓϥάΠϯͷಋೖ
    (BUTCZ্Ͱ͍͔ͭ͘ઃఆ
    αΠτΛੜ੒
    

    View Slide

11. (BUTCZͷ؀ڥΛ࡞੒
    OQNJOTUBMMHMPCBMHBUTCZ
    HBUTCZOFX4*5&@/".&αΠτͷ਽ܗੜ੒
    DE4*5&@/".&
    ZBSOTUBSU
    

    View Slide

12. 8PSE1SFTT༻ͷϓϥάΠϯΛಋೖ
    

    View Slide

13. 8PSE1SFTT༻ͷϓϥάΠϯΛಋೖ
    ZBSOBEEHBUTCZTPVSDFXPSEQSFTT
    w 8PSE1SFTTαΠτͷσʔλΛݩʹαΠτΛ

    ੜ੒Ͱ͖ΔΑ͏ʹͳΔ
    w ࣗ෼ͰϗεςΟϯά͍ͯ͠Δ΋ͷɺ

    DPNͰӡ༻͍ͯ͠Δ΋ͷͲͪΒͰ΋࢖͑Δ
    w ๭ΧελϜϑΟʔϧυͷϓϥάΠϯʹ΋ରԠ
    

    View Slide

14. PQUJPOT\
    CBTF6SMA803%13&44@4*5&@%0."*/A
    QSPUPDPMAIUUQTA
    IPTUJOH81$0.USVF
    VTF"$'GBMTF EFGBVMUUSVF
    BVUI\
    XQDPN@BQQ@DMJFOU4FDSFUQSPDFTTFOW803%13&44@$-*&/5@4&$3&5
    XQDPN@BQQ@DMJFOU*EQSPDFTTFOW803%13&44@$-*&/5@*%
    XQDPN@VTFSQSPDFTTFOW803%13&44@64&3
    XQDPN@QBTTQSPDFTTFOW803%13&44@1"44803%
    ^
    >
    HBUTCZDPOpHKT Ұ෦
    
    

    View Slide

15. (SBQI2-ͰσʔλΛҾ͘
    \
    BMM8PSEQSFTT1BHF\
    FEHFT\
    OPEF\
    JE
    UJUMF
    DPOUFOU
    FYDFSQU
    EBUF
    NPEJpFE
    TMVH
    TUBUVT
    ^
    ^
    ^
    ^
    ։ൃ༻αʔόʔΛ্ཱͪ͛Δͱɺઐ༻ΤσΟλʹ
    ΞΫηεͯ͠ɺΫΤϦΛࢼ͢͜ͱ͕ग़དྷΔɻ
    ͨͩɺ͜ͷลΓͷυΩϡϝϯτ͕ແ͍ɻ
    υΩϡϝϯτʹॻ͍ͯ͋ΔαϯϓϧΛݩʹख୳Γ͔ɺ
    (JUIVCͷαϯϓϧίʔυΛࢀߟʹॻ͘͜ͱʹͳΔ
    

    View Slide

16. View Slide

17. View Slide

18. Ұཡ΍ৄࡉϖʔδͷੜ੒ɾ
    ϦϯΫͰܨ͙͜ͱ͕ग़དྷͨ
    

    View Slide

19. ΍ͬͯΈͯ
    w ͋Δఔ౓ͷͱ͜Ζ·ͰདྷΔͱޙ͸͍ͭ΋ͷ41"։ൃͬΆ͍
    w ͋Δఔ౓·Ͱ͕͠ΜͲ͍
    w υΩϡϝϯτͷ଍Γͯͳ͞
    w ϓϥάΠϯ͕৽όʔδϣϯ W
    Ͱ্ख͘ಈ͔ͳ͘ͳͬ
    ͯΔ

    HJUIVCͷαϯϓϧͱಉ͡WͰ͸ಈ͍ͨ
    w (SBQI2-΁ͷ׳Ε͕ඞཁ
    

    View Slide