初心者でもOK!男木島に思いを馳せながらブロックエディターを使ってページを作ろう!

WordCamp Ogijima 2020で開催したワークショップのスライドです。

スピーカー、アシスタント:
Oyuki
Naoko Takano
Ippei Sumida
Minami Sugaya
Chiaki Kouno
Shusei Toda

Transcript

1. 8PSE$BNQ0HJKJNB
   ॳ৺ऀ΋0,
   உ໦ౡʹࢥ͍Λ஘ͤͳ͕Β
   ϒϩοΫΤσΟλʔΛ࢖ͬͯϖʔδΛ࡞Ζ͏ʂ
   

   View Slide

2. Α͏ͦ͜ʂ
   

   View Slide

3. ॾ஫ҙͳͲ
   w ࡞੒͍͍ͨͩͨϖʔδΛάϥϨϙͳͲʹར༻͍ͨ͠·͢ɻ
   w ౰ϫʔΫγϣοϓ͸࿥ը͓ͯ͠Γ·͢ɻ
   w ߦಈنൣΛࠓҰ౓֬͝ೝ͓ئ͍͠·͢ɻ
   w ͳʹ͔͋Γ·ͨ͠Βɺԕྀͳ͘ελοϑ·Ͱ͓ਃ͠ग़͍ͩ͘͞ɻ
   w ൃݴɺνϟοτͲͪΒͰ΋0,Ͱ͢ɻ
   

   View Slide

4. ౰ϫʔΫγϣοϓʹ͍ͭͯ
   w 8PSE1SFTTDPN 8PSE1SFTTΛར༻ͯ͠ɺݻఆϖʔδΛϖʔδ࡞੒͠·͢
   w ϖʔδͷςʔϚ͸ʰஉ໦ౡ΁ͷ૝͍ʱͰ͢
   w ࡞੒ͨ͠ϖʔδͷެ։·ͰΛ໨ࢦ͠·͢
   

   View Slide

5. ౰ϫʔΫγϣοϓͷ໨ඪ
   w 8PSE1SFTTͰͷʰݻఆϖʔδʱͷ࡞੒Λମݧ͢Δ
   w ϒϩοΫΤσΟλʔΛ࢖ͬͨϖʔδͷ࡞੒ͷྲྀΕΛशಘ͢Δ
   w ࡞ͬͨϖʔδͷެ։ɺ4/4ͳͲͰͷγΣΞΛମݧ͢Δ
   

   View Slide

6. λΠϜςʔϒϧ
   ొஃऀɺελοϑ঺հ
   8PSE1SFTTɺ8PSE1SFTTDPNɺϒϩοΫΤσΟλʔʹ͍ͭͯͷઆ໌
   உ໦ౡʹࢥ͍Λ஘ͤΔ
   ࠓճ࡞੒͢Δϖʔδͷઆ໌
   ϖʔδ࡞੒ϫʔΫγϣοϓ
   ϖʔδެ։
   ్தͰ΋0,Έͳ͞Μͷϖʔδഈݟ
   ;Γ͔͑Γˍ࣭ٙԠ౴
   

   View Slide

7. ొஃऀɺελοϑ঺հ
   

   View Slide

8. ͓Ώ͖
   ΢ΣϒαΠτ੍࡞ʢओʹϚʔΫΞοϓΤϯδχΞʣ
   ΧϨʔͱϙετ͕޷͖
   

   View Slide

9. ͜͏ͷ͖ͪ͋
   ΢Σϒσϕϩούʔɾ຋༁ɾ࣌ʑϚʔέολʔ
   தࠃ஡ͱҿ஡ͷ఺৺ͷछྨʹৄ͍͠Ͱ͢ʂ
   

   View Slide

10. 4IVTFJ5PEB
    ίϛϡχέʔγϣϯσβΠφʔʗΫϦΤΠςΟϒσΟϨΫλʔ
    ೔ຊͷ΋ͷͮ͘Γʹৄ͍͠Ͱ͢ʂ
    

    View Slide

11. ੁ୩ඒಸւ
    ߳઒େֶେֶӃ೥
    ੉ށ಺ͷౡΊ͙Γ͕޷͖Ͱ͢
    

    View Slide

12. ߴ໺௚ࢠ
    ϩʔΧϦθʔγϣϯϓϩδΣΫτϚωʔδϟʔ
    Ҏલ͸8PSE1SFTTDPNͷαϙʔτελοϑͰͨ͠ɻ
    ԿͰ΋ฉ͍͍ͯͩ͘͞ʂ
    

    View Slide

13. ͢Έͩɹ͍ͬ΃͍
    ΢Σϒσϕϩούʔ
    εϓϥτΡʔϯͱ΍͖ͱΓ͕͖͢
    

    View Slide

14. 8PSE1SFTTͱ8PSE1SFTTDPN
    

    View Slide

15. View Slide

16. Πϯετʔϧܕ WordPress ͱ WordPress.com ͷҧ͍
    ಛ௃ Πϯετʔϧܕ (WordPress.org) Ϩϯλϧϒϩάܕ (WordPress.com)
    Ұߦઆ໌ Φʔϓϯιʔεͷ CMS/ϒϩάιϑτ΢ΣΞ WordPress ιϑτ΢ΣΞΛ࢖ͬͨϗεςΟϯάαʔϏε
    ӡӦاۀ ͳ͠ (ίϛϡχςΟӡӦ) Automattic
    ϗεςΟϯά ϨϯλϧαʔόʔͳͲͷ༻ҙ͕ඞཁ ແྉ·ͨ͸༗ྉϓϥϯʹؚ·ΕΔ
    υϝΠϯ
    ௨ৗ༗ྉɻϨϯλϧαʔόʔʹΑͬͯ͸ແྉ
    αϒυϝΠϯ΋͋Γɻ
    *.wordpress.com ͳΒແྉɺͦΕҎ֎͸༗ྉ
    όʔδϣϯΞο
    ϓ
    ίΞͷϝδϟʔΞοϓάϨʔυҎ֎͸σϑΥ
    ϧτػೳͰࣗಈରԠՄೳ
    શࣗಈɺ΄΅ϝϯςφϯεෆཁ
    ϓϥάΠϯɺς
    ʔϚ
    Πϯετʔϧͷ੍ݶͳ͠ ͢Ͱʹؚ·ΕΔػೳ΋ଟ͍͕ɺ೚ҙͷϓϥάΠϯɾςʔϚ
    Πϯετʔϧ͸༗ྉϓϥϯͷΈ
    αϙʔτ
    ίϛϡχςΟϑΥʔϥϜͱϗεςΟϯάɾ༗
    ྉϓϥάΠϯɾςʔϚͷαϙʔτ
    ελοϑʹΑΔϝʔϧαϙʔτ͋Γʢνϟοταϙʔτ͸
    ӳޠͷΈʣ
    

    View Slide

17. ϒϩοΫΤσΟλʔͱΫϥγοΫΤσΟλʔͷҧ͍
    ಛ௃ ϒϩοΫΤσΟλʔ ΫϥγοΫΤσΟλʔ
    Ұߦઆ໌ ͍Ζ͍ΖͳϒϩοΫΛฒ΂ͯϖʔδΛ࡞੒ จষΛฤूπʔϧόʔΛ࢖ͬͯ૷০ͯ͠ϖʔδΛ࡞੒
    ݱࡏ͸ʁ σϑΥϧτͷΤσΟλʔ ϓϥάΠϯͰఏڙ
    ࢖͑Δظؒ͸ʁ ࠓͷͱ͜Ζͣͬͱ 2021೥຤·Ͱ
    ࣅ͍ͯΔͷ͸ʁ Medium, Notion, Markdown Google Docs, Word
    

    View Slide

18. உ໦ౡʹࢥ͍Λ஘ͤΔ
    

    View Slide

19. View Slide

20. உ ໦ ౡ ͱ ͝ ԑ
    

    View Slide

21. Ξʔτͳஉ໦ౡ
    

    View Slide

22. ΦϯόɾϑΝΫτϦʔ
    

    View Slide

23. உ໦ౡɺະདྷͷڭҭϓϩδΣΫτ
    

    View Slide

24. உ໦ౡਤॻؗ
    

    View Slide

25. Ͱ͸࡞͍͖ͬͯ·͠ΐ͏ʂ
    

    View Slide

26. ͸͡ΊΔલʹ
    w ؾܰʹϖʔδͷ࡞੒Λָ͓͠Έ͍ͩ͘͞
    w ࣗ෼ͷϖʔεͰ࡞͍͍ͬͯͨͩͯେৎ෉Ͱ͢ʢ׬੒͠ͳͯ͘΋0,ʂʣ
    w ϖʔδͷ࡞੒ϫʔΫγϣοϓޙʹɺ໊͓લɾϋϯυϧ໊ͱ63-Λίϝϯτ͍ͯͩ͘͠͞
    w Θ͔Βͳ͍͜ͱ͕͋Ε͹ɺ·ͣ͸νϟοτͰ࣭͝໰͍ͩ͘͞
    w ϑΝγϦςʔλʔ͕र͍·͢ɻ಺༰ʹΑͬͯ͸ݸผରԠ͍ͨ͠·͢
    w ϚΠΫ͸جຊϛϡʔτͰ͓ئ͍͍ͨ͠·͢
    w αϯϓϧจষɺαϯϓϧࣸਅΛ͝༻ҙ͍ͯ͠·͢
    w 63-͸νϟοτʹͯ֬͝ೝ͍ͩ͘͞
    

    View Slide

27. ϖʔδΛެ։ʂ
    

    View Slide

28. View Slide

29. View Slide

30. Έͳ͞ΜͷϖʔδΛഈݟʂ
    

    View Slide

31. ໊͓લɾϋϯυϧ໊ͱ63-Λίϝϯτ͍ͯͩ͘͠͞
    ్தͰ΋0,
    

    View Slide

32. ;Γ͔͑Γ
    

    View Slide

33. w جຊ͸ʰ౤ߘʱͱಉ͡
    w ౤ߘͱͷҧ͍͸ʜ
    w ୯ମͷϖʔδΛ࡞੒
    w ϖʔδຖʹϨΠΞ΢τมߋ
    Ͱ͖Δ
    w هࣄҰཡ͸Ͱ͖ͳ͍
    w ళฮ৘ใͳͲهࣄҎ֎ͷ
    ϖʔδ࡞੒ʹ
    ݻఆϖʔδΛ࡞Γ·ͨ͠
    

    View Slide

34. ʹ;Ε·ͨ͠
    w ϒϩοΫΛ૊Έ߹Θͤͯϖʔδ
    Λ࡞੒
    w ϒϩοΫ͸ҠಈՄೳ
    w ϒϩοΫຖʹઃఆ
    w (PPHMF%PDTͳͲΛίϐϖͰ͖Δ
    ϒϩοΫΤσΟλʔ
    

    View Slide

35. w 63-͸ύʔϚϦϯΫͰઃఆ
    w ౤ߘͱಉ͘͡ɺ
    Լॻ͖ɾ༧໿ެ։Մೳ
    w 4/4ͰγΣΞ࣌ʹɺΞΠΩϟο
    νը૾͕දࣔ͞ΕΔ
    ϖʔδΛެ։͠·ͨ͠
    

    View Slide

36. ͓͔ͭΕ͞·Ͱͨ͠ʂ
    

    View Slide

37. ͭ͗͸உ໦ౡͰձ͍·͠ΐ͏
    

    View Slide