Shifter（WordPress）を Headless CMSにした自社サイトを GridsomeとNetlifyで作ってる話 - Shifter Meetup Vol.8 / shifter-headlesscms-gridsome-netlify

Transcript

1. Vol.8 Fumito Abe 2020.02.05 at Shibuya, Tokyo Shifter Meetup ShifterʢWordPressʣ Λ
   Headless CMSʹͨࣗࣾ͠αΠτΛ
   GridsomeͱNetlifyͰ࡞ͬͯΔ࿩
2. ࣗݾ঺հ About us 1
3. ΫϦΤΠςΟϒσΟϨΫλʔ
   
   σβΠϯΤϯδχΞ Ѩ෦
   จਓ ౦ژ౎ࡏॅ
   
   ౦ژ౎ग़਎
   2016೥10݄ʹגࣜձࣾneccoΛ૑ۀɻ
   4ظ໨ɺࣾһ5໊ Πϯλʔϯ2໊ɻ
   2019೥6݄౦ژΦϑΟεΛ։ઃ
   ೣ2ඖͱੜ׆ɻ
   ओʹϒϥϯυσβΠϯ੍࡞શମͷσΟϨΫγϣϯ͔Βઓུɺ
   69ɾ৘ใઃܭɺ6*σβΠϯɺϑϩϯτΤϯυ࣮૷Λ୲౰ɻ גࣜձࣾnecco @abefumito ɾWordCampͷొஃ2ճ
   ɾJAWS-UG Tohoku
   ॴଐ ɾJP_Stripes Akita
   ӡӦ
   2ճ໨ͦΖͦΖ
   ɾCSS Nite LP 64ొஃ ୅දऔక໾
10. About Company ձࣾ঺հ ϒϥϯυͮ͘Γͷ͓ख఻͍Λى఺ʹ
    σβΠϯɹͱɹ΢ΣϒαΠτɹΛ
    ͍ͭͬͯ͘·͢
11. necco Members ϝϯόʔߏ੒ ɾσΟϨΫλʔˍσβΠϯΤϯδχΞ
    ɾΤσΟλʔˍϑΥτάϥϑΝʔ
    ɾσβΠφʔ
    ɾΤϯδχΞ 1໊
    1໊
    1໊ʢ
    
    Πϯλʔϯ2໊ʣ
    1໊ʢ
    
    ΞϧόΠτ1໊ʣ
    ߹ܭ
    ໊ ळాΦϑΟε໊
    
    ౦ژΦϑΟε໊
26. ຊ୊
27. Έͳ͞ΜͰ΋
    ͙͢࡞Ε·͢ʂ ࠓ೔ͷJamstackͳߏ੒͸
28. https://riotz.works/articles/lulzneko/2019/12/24/first-website- with-shifter-webhooks-and-gridsome-on-netlify/ https://github.com/torounit/gridsome-shifter
29. ࠓ
31. ཧ૝
33. ݱ࣮
35. डୗ੍࡞ձࣾͰ
    ࣗࣾαΠτͪΌΜͱ
    ͯ͠Δਓଚܟ
36. γεςϜߏ੒
37. Webhooks→Import Headless CMS Vue.js Framework Build & Hosting Data Source →
38. ېࢭࣄ߲
39. ͦ΋ͦ΋
    4IJGUFS͚ͩͰ͍͍ΑͶʁ
40. Gridsome ࢖ͬͯΔਓʙʁ
41. (SJETPNFͬͯʁ
44. Vueϕʔεͷ'8Λ࢖ͬͯΈ͍ͨʂ ৽͍ٕ͠ज़͸ࣗ෼Ͱࢼͯ͠νʔϜʹڞ༗ ੩త͔ͩΒ΍ͬͺΓಡΈࠐΈ଎͍ʂ WordPress + αͰ։ൃͷ෯Λ޿͍͛ͨ GraphQL? ྑ͍ײ͡ʹྑ͍Β͍͠w 1 2 3 4 5 ͳͥ8PSE1SFTTςʔϚͰͳ͘(SJETPNF
45. ίϯςϯπͱϑϩϯτ։ൃ͸׬શ෼཭ ϝϯόʔ͕ͲΜͲΜߋ৽ͯ͠΋໰୊ͳ͠ʂ ΤσΟλʔͱͯ͠ͷWordPress͸ͦͷ·· ϩʔΧϧ΋ຊ൪΋ίϯςϯπ͸ৗʹಉظ JS΍SPAͷ։ൃٕज़޲্͕Ͱ͖Δ͔΋ʁ 1 2 3 4 5 ϑϩϯτ͕(SJETPNFͰ΋
46. ύϑΥʔϚϯε͸ʁ
51. ͦ΋ͦ΋
    4IJGUFS͚ͩͰ͍͍ΑͶʁ
52. 4IJGUFSͰ
    ίϯςϯπΛߋ৽͠ ͨޙͷಈ͖͸ʁ
57. ઃఆ͸ʁ
61. ৄ͘͠͸
62. https://riotz.works/articles/lulzneko/2019/12/24/first-website- with-shifter-webhooks-and-gridsome-on-netlify/ https://github.com/torounit/gridsome-shifter
63. ࠷ޙʹʂ
    8PSE1SFTTςʔϚͷ ৔߹ͷσϓϩΠͰ
    ࣭໰͕͋Γ·͢ɻ
65. 81ͷςʔϚ։ൃ࣌ͷ σϓϩΠͷࣗಈԽɾ ؆ུԽͰ͖·͔͢ʁ
67. Webhooks→Import Headless CMS Vue.js Framework Build & Hosting Data Source →
68. TUZMFDTTͷόʔδϣϯΛΠϯΫϦϝϯτʢࣗಈՄʣ ݱࡏͷλάόʔδϣϯΛ֬ೝ
    (JU
    UBH
    MJTU HJU
    UBH
    Y
    NBTUFS
    λά7FSੜ੒ HJU
    QVTI
    PSJHJO
    Y
    ࠷৽λάΛ164) ShifterͷWPμογϡϘʔυ͔ΒςʔϚߋ৽ 1 2 3 4 5 ݱঢ়
    
    ϦϞʔτϦϙδτϦͷ81ςʔϚΛ࠷৽ͰσϓϩΠ͢Δʹ͸
69. UBH
    QVTIͨ͠Βͦͷ··ɺࣗಈͰ 4IJGUFS্ཱ͕͕ͪΔ ࢦఆͨ͠όʔδϣϯΛऔಘͯ͠ల։ (FOFSBUF
    "SUJGBDU͢Δ ੩తϑΝΠϧΛσϓϩΠ͢Δ 1 2 3 4 5 ͜͏ͳͬͯ΄͍͠
70. ΋ͬͱ͍͏ͱͰ͖Ε͹
71. UBHͰ[JQϑΝΠϧͷੜ੒Λ͠ͳ͍Ͱ ΋(JUIVC্Ͱ13Λग़ͯ͠
    .BTUFS
    #SBODIʹϚʔδͨ͠Β
    ࣗಈͰϚελʔͷ81ςʔϚ͕൓ө ͞Ε(FOFSBUF·ͰͰ͖·ͤΜ͔ʁ
72. ςʔϚ։ൃऀ͕4IJGUFSʹ
    ೖΒͳͯ͘΋࠷৽ͷςʔϚʹʂ
    (FOFSBUF͢Δඞཁ͕ͳ͘ͳΔ
73. %9
    %FWFMPQFS
    &YQFSJFODF͕
    ര্͕Γʁ
74. Thank you! ͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ʂ