1
View Slide
Toro_Unit෦ ߛ (͏Β ͻΖ͠)• Frontend Engineer• WordPress Plugin and ThemeDeveloperGithub: @torounitTwitter: @Toro_Unit2
Plugins and Themes• Custom Post Type Permalinks• Advanced Posts Blocks• Simple Post Type Permalinks• Powerful Posts Per Page (PPPP)• Vanilla• and more...3
4
WordPress Meetup Map• React Ͱग़དྷͯ·͢ɻ• https://github.com/torounit/wp-meetup-map• ϓϧϦΫ͍ͩ͘͞ɻ5
6
ݝদຊࢢ͔Β͖·ͨ͠• Shinshu WordPress Meetup• ຖճϐβ৯ͬͯ·͢ɻ• ࠓΞυ֗οΫఱࠃ͕দຊಛूɻ• ߚ༿͕ݟ͝Ζɻ৽ͦɻ7
͍8
2019.11.129
WordPress 5.3 ϦϦʔε༧ఆ10
11ϲ݄લ11
2018.12.0612
WordPress 5.0 !!!13
͓͞Β͍ɿWordPress 5.0• 1ͿΓͷϝδϟʔΞοϓσʔτ• ͪʹͬͨɺϒϩοΫΤσΟλʔɺGutenberg ͷϚʔδɻ( ver 4.6 )14
͜͜ʹࢸΔ·Ͱɺ͍Ζ͍Ζ͋Γ·ͨ͠15
ߋʹ1ϲ݄લ16
2018.11.13• WordPress 5.0 beta 4, Gutenberg 4.3 ͷϦϦʔεɻ• Gutenberg 4.3 WordPress ʹϚʔδࡁΈ• ͜ͷ࣌Ͱɺ11/27 ϦϦʔε༧ఆɻ17
9:00 ͝Ζɻ• ʮGutenberg Ͱຊޠ͕ೖྗग़དྷͳ͍ŋŋŋʯ• ʮ5.0 Beta 4 Ͱຊޠ͕͏·͘ೖྗग़དྷͳ͍ŋŋŋʯͷͭͿ͖͕ͪΒ΄Βͱɻ18
ຊޠೖྗͷෆ۩߹͕ൃੜ!!!19
• ຊޠೖྗͰɺ1จࣈ͕֬ఆ͞Εͯ͠·͏όάɻ• kakikukeko → ͕ɺʮk͖͚͋͘͜ʯ• https://github.com/WordPress/gutenberg/issues/11813• ϦετϒϩοΫͰɺશͯͷจࣈͰൃੜɻ• kakikukeko → ͕ɺʮk͋k͍k͏k͑k͓ʯ• https://github.com/WordPress/gutenberg/issues/1179520
15:00 ࠒhttps://github.com/WordPress/gutenberg/issues/11795ΩλδϚ͞Μ͕ issueใࠂɻϦετϒϩοΫͷຊޠೖྗ͕͓͔͍͠ͱ͍͏༰ɻ͜ͷ͕ɺGutenberg 4.3 ͔Βൃੜͨ͜͠ͱɻ21
23:30 ࠒhttps://github.com/WordPress/gutenberg/issues/11813ؔ࿈Λൃݟ͠ใࠂɻͲ͏Βɺ ͱ͍͏ίϯϙʔωϯτΛ͍ͬͯΔͷશͯͰൃੜ͢Δ͜ͱɻΩλδϚ͞Μͷͱ·ͨผͷέʔεͰຊޠೖྗ͕͓͔͍͜͠ͱΛใࠂɻ22
͜ͷͱ͖ͷ΅͘ͷ͖ͪ23
γϟϨʹͳΒΜʂʂʂʂ24
• ϒϩοΫΤσΟλʔΛ͏ͧʂͱ͍͏Ҋ݅ΛఏҊ͍ͯͨ͠ɻ• ͜ͷ··ϦϦʔε͞ΕͨΒɺʮWordPress ͬͯόάͬͯΔΜͰ͠ΐʁʯΈ͍ͨͳ͜ͱΛݴΘΕΔͷɺ৺͕௧͍ɻετϨεɻ• Classic Editor ΛೖΕΔͷ͕ͨΓલʹͳΔͱɺࠓ͍ͭɺϒϩοΫΤσΟλʔʹ͢Δͷͱ͍͏ɻ• ࠓޙϢʔβʔɾΫϥΠΞϯτʹઆ໌͢ΔͷҰۤ࿑ɻɻɻ25
UIͰղΓ͘͢όάΔͷɺϓϩμΫτͷ৴༻ʹؔΘΔɻ26
2018.11.14• 4.2 Ͱൃੜ͠ͳ͍͜ͱ͕໌ɻ• ΄͔ͷຊਓ͔Βಈ͔ͳ͍Αʔͱͷใࠂ͕͕݅͋Δɻ• ͳΜͱ͔ݪҼ͕ىͬͨ͜ϑΝΠϧͷಛఆʹޭ͕ͨ͠ɺղΒͣɻ27
2018.11.15ͨͪͳ͞Μ͕ɺMaking WordPress (ެࣜ Slack) ͷ #core-editorνϟϯωϧͰใࠂɻ͔͜͜Β͕ಈ͖࢝ΊΔɻ28
toru ͞ΜʹΑΔৄࡉͳίϝϯτɻ29
19:18ίϛολʔͷElla ͞Μ͕ɺΩλδϚ͞Μͷ issue ʹίϝϯτɻMac ͷ "ͻΒ͕ͳ" ͷຊޠೖྗγεςϜΛೖΕͯΈ͚ͨͲɺྑ͘ղΒͳ͍ɻͬͱใ͕ཉ͍͠ʂͱͷ͜ͱɻ͔͜͜Βɺ̍࣌ؒ΄ͲɺΩλδϚ͞ΜͱɺElla͞ΜͷΓͱΓɻ30
21:5031
• ίϛολʔͷ Ella ͞Μ͔Β Gutenberg ͷमਖ਼൛ͷZIP͕ඈΜͰ͘Δɻ͔͜͜Β͠Β͘ɺElla ͞Μ͕ͨ͠ͷΛ͕खݩͰݕূ͢Δɻ• ӳޠྑ͘ղΒͳ͍͚Ͳɺֆจࣈͱ Google ༁Ͱ͔ͳΓίϛϡχέʔγϣϯ͕औΕΔɻ• ͪΌΜͱಈ͍ͯͳ͍ͱ͖ɺͱΓ͋͑ͣɺʮOh no...ʯͱ͔ݴ͑Θͬͨɻ32
22:30WordPress ͷίΞίϛολʔͷ ocean90 ͔Βɺhttps://input-inspector.now.sh/ ΩʔϘʔυͷೖྗΠϕϯτΛՄࢹԽ͢ΔπʔϧΛڭ͑ͯΒ͏ɻ33
34
͜ΕҎ߱ɺ1. Ella ͞Μ͕ Gutenberg Λमਖ਼2. ͷखݩͷ WordPress ʹΠϯετʔϧɺݕূɻ3. ಈ࡞ใࠂͱɺhttps://input-inspector.now.sh/ ͷ݁ՌΛ࿈བྷɻ4. ݴޠԽɺӳޠԽ͠ʹ͍͘ϞϊɺಈըΛࡱͬͯͦΕΛڞ༗ɻͱ͍͏ྲྀΕͰमਖ਼ɾݕূ͕ਐΉɻ10~20ʹҰ͜ΕΛࢼͯ͠ʔͱ͍͏࿈བྷ͕དྷΔͷͰɺͦΕΛͻͨ͢Βݕূɻ35
23:30ʮWordPress 5.0 RCʯͷϚΠϧετʔϯɺʮ[Priority] Highʯ͕ઃఆ͞ΕΔɻ• ͜ͷ͕ɺॏཁͳͱίϛολʔਞ͕அͨ͠ɻ• ͜Ε͕ղܾ͞Εͳ͍ݶΓ WordPress5.0 RC (ϦϦʔεީิ൛) ग़ՙ͞Εͳ͍ɻͱ͍͏͜ͱ͕ܾ·Δɻ҆৺ͨ͠ͱಉ࣌ʹɺۤ࿑͕ใΘΕͨؾ͕ͨ͠ɻ36
11.16 0:35ͷใࠂͨ͠ɺIssue ͕ Chrome Ͱղܾ͞Εͨ͜ͱΛ֬ೝɻ΄͔ͷϒϥβͰಈ࡞͍ͯ͠Δ͜ͱΛ֬ೝɻ0:49master ϒϥϯνͷөɻ01:00 ͝Ζ΄͔ͷϒϩοΫͰͻͱ·ͣେৎͦ͏ͳ͜ͱΛɺToru ͞Μ͕ใࠂ37
https://github.com/WordPress/gutenberg/pull/1190838
39
40
41
ͦͷޙɺͳΜ͔Μ͋ͬͯɺGutenberg 4.4 / WordPress 5 beta 5ϦϦʔε42
݁ہ͕ͬͨ͜ͱ݁ہ͕ͬͨ͜ͱ1. ͞Εͨ ϓϥάΠϯΛΠϯετʔϧͯ͠ɺೖྗςετ2. https://input-inspector.now.sh/ ͷ݁ՌΛใࠂ3. εΫϦʔϯΩϟϓνϟࡱӨɻGithubʹషΔͨΊʹɺgif ʹมɻ4. ͱΓ͋͑ͣGoogle ༁Ͱίϝϯτͱ͔ΛಡΉɻ5. OK!!! ͱ͔ Oh No.. ͱ͔ݴ͏ɻͪΐͬͱෳࡶͳ͜ͱݴ͍ͨ͘ͳͬͨΒɺGoogle ༁ɻ43
ඞཁͳεΩϧɺϞϊ• Making WordPressͷSlackΞΧϯτɻ• WordPress.org ΞΧϯτͱҰॹʹऔΕΔɻ• Github ΞΧϯτ• WordPress ڥɻʢͳΜͰ͍͍ɻʣ• Google ༁ɻ44
͋ͬͨΒศརͳεΩϧ• ͪΐͬͱͷ Git ྗɻ• npm install, npm run buildग़དྷͳͯ͘ɺzip ͰσʔλΛૹͬͯ͘ΕͨͷͰɺ΄ΜͱʹඞਢͰແ͍ɻ45
ಛผͳεΩϧඞཁͳ͍46
• ಈըࡱӨͷΓํͦͷͰάάͬͨɻ• SlackɺGithubย͔ͬΒGoogle༁ʹ͔͚ͨɻ• ྑ͘ղΒΜ୯ޠάάͬͨΒࣙॻ͕ग़ͯ͘Δɻ47
ಈըࡱӨmov Github ͷίϝϯτʹషΕͳ͍ͷͰɺGif Ξχϝʹม͢ΔɻWindows : ScreenToGif: Ωϟϓνϟ͔ΒGifੜ·ͰҰൃͰग़དྷΔɻmac1. command + shift + 5 Ͱ mov ࡱӨ2. ffmpeg Ͱ mov -> gif ͕؆୯ɻCLI.$ ffmpeg -i issue.mov -r 24 issue.gif48
OSS ڞಉ࡞ۀͷΓํyouknowriad: Awesome collaboration work on this PROSSΈΜͳͰιϑτΣΞΛΑ͍ͯ͘͘͠Ұͭͷํ๏ɻ49
͍͔ͭͩΕ͔͕উखʹͯ͘͠Εͳ͍ɻ• ͦͦӳޠͰ͔͠ύιίϯΛ͍ͬͯͳ͍ਓ͓ͦΒ͘͜ͷෆ۩߹ΛൃݟͰ͖͍ͯͳ͍ɻCJK ͕ࠃޠͳਓͬͺΓগͳ͍ɻ• ใࠂ͞Εͯɺਖ਼Α͘Θ͔Βͳ͍͔Βςετͮ͠Β͍ɻ• όάϨϙʔτɾςετʹࢀՃ͢Δ͜ͱɺॏେͳͩͱײ͡ΔͷͰ͋ΕɺSlack ʹಥܸͯ͠ҙݟΛڼ͙ɺॏཁɻ50
ʮWordPress όάͬͯΔΑͶʔɻʯʮGutenberg ͙ͬͯΔΑͶʔʯͱSNSͷย۱Ͱ΅͍͍ͯΔ͚ͩͰɺԿղܾ͠ͳ͍ɻΈΜͳෆɻ51
• SNS ͷย۱Ͱจ۟Λݴ͍ͬͯΔ͚ͩͰɺෆ۩߹Βͳ͍͠ɺݴΘΕͨଆDisΒΕͨ͜ͱ͔͠Θͬͯ͜ͳ͍ͷͰɺෆ͕ෆΛੜ࢈͢Δ͚ͩɻ• όάϨϙʔτʹ͢Δ͜ͱͰɺੜ࢈తͳΓͱΓʹɻ• 4.3 ͷෆ۩߹͕ղফ͞Εͳ͍··ग़ՙ͞Ε͍ͯͨΒͱ૾͢Δͱɺ΄ΜͱʹڪΖ͍͠ɻ52
ͳͥʹϦϓϥΠ͕ඈΜͰ͖ͨͷ͔ɻ• ͨ·ͨ·ɺ͜ͷ݅Ͱใࠂ͍ͯͨ͠ਓؒͷதͰɺSlack ͕͓ٳΈϞʔυʹͳ͍ͬͯͳ͔ͬͨɻͨ·ͨ·ɺݱʹډ߹Θ͚ͤͨͩɻ• ͋ͱɺ͔̍࣌ؒͬͨΒ…53
݁ہίϛϡχέʔγϣϯॏཁɻ• ʮςετ͘Β͍ͩͬͨΒԶʹग़དྷΔͧʂʯͱ͍͏ਓɺίϝϯτ͢Δ͜ͱ͕ॏཁɻ૬ख୭ʹ૬ஊͨ͠Βྑ͍ͷ͔ղΒͳ͍ɻ• Issue Λใࠂ͢ΔɺSlack Ͱίϝϯτ͢Δͱ͍͏͜ͱɺ։ൃʹࢀՃ͍ͨ͠ʂͱ͍͏ҙࢥදࣔɻ54
؍ऀޮՌ΄Μͱʹ͜Θ͍ɻ؍ऀޮՌʢ΅͏͔Μ͠Ό͜͏͔,ӳ:bystander effectʣͱɺࣾձ৺ཧֶͷ༻ޠͰ͋Γɺूஂ৺ཧͷҰͭɻ͋Δࣄ݅ʹରͯ͠ɺࣗҎ֎ʹ؍ऀ͕͍Δ࣌ʹઌͯ͠ߦಈΛى͜͞ͳ͍৺ཧͰ͋Δɻ؍ऀ͕ଟ͍΄ͲɺͦͷޮՌߴ͍ɻwikipedia ΑΓɻ55
56
57
ʮ͋ͳ͕ͨݺͼ·͠ΐ͏!!! ফं!!!ʯ©ͷΓ͚ͭխय़ʗখֶؗ ʰ͋͠ΘͤΞϑϩాதʱ4רΑΓ58
• Βͳ͍͔Βɺ͍͠ͳͷͰŋŋŋ → ͩΕใࠂͯ͠ͳ͍ɻ• ͩΕ͔ใࠂͯͨ͠Β໎ͳͷͰŋŋŋ → ॏෳ͍ͯ͠ΔͳΒͦͬͪʹ༠ಋͯ͘͠ΕΔ͠ɺෳͰى͍ͬͯ͜Δ͜ͱ͕ՄࢹԽ͞ΕΔɺใࠂ͞Εͳ͍͜ͱͷํ͕ɻ• ผʹΠϥοͱ͞Εͳ͍͔Βେৎɻ5ௐͯͦΕͬΆ͍Ϟϊ͕ແ͚Εใࠂ͞Εͯͳ͍ͱࢥͬͯ issue ॻ͘ɻ59
ΜۄʹͳΖ͏ɻ• ίΞͷ Slack, Trac, Github ͰٞͷٞʹࢀՃ͢Δ͜ͱ͕େࣄɻʮ୭͔͕දͯ͠ŋŋŋʯͦͷਓҰਓͷʹ͔͠ݟ͑ͳ͍ɻ• ʮेͳΜۄ͕͋Εɺશͯͷόάચ͍ग़͞ΕΔʯ(Ϧʔφεͷ๏ଇ)60
Slack Ͱͷ APAC TimezoneͷϛʔςΟϯά࢝·ͬͨɻ#coreɺ#core-editor Ͱɺຊ࣌ؒͷޕޙʹɺϛʔςΟϯά͕࢝·ͬͨɻ• #core-editor Λݟ͍ͯΔͱɺʮ͜Ε࠶ݱ͢ΔʁʯΈ͍ͨͳଟ͍ɻ61
όάϨϙʔτॻ͘ͷͦ͜·ͰେมͰͳ͍ɻ1. ຊޠͰॻ͘ɻ2. Google ༁ʹ͔͚Δ3. εΫϦʔϯγϣοτɾಈըɻׂͱӳޠྗແͯ͘ɺͳΜͱ͔ͳΔಈըҒେɻ62
େͳͷɺ·ͣɺ͑Α͏ͱ͢Δ͜ͱɻҰͷ Issue Ͱશ෦ΘΔͱࢥΘͳ͍ɻ63
• νϟοτʹࢀՃ͢ΔɺνϟοτͰίϛϡχέʔγϣϯΛऔͬͯΈΔɺ࣭ͯ͠ΈΔɻ• ʮ͛͐͢ʂʯͬͯݴ͏͚ͩͰҹมΘΔɻ• Issue Λॻ͘ɻ• طʹ͋ΔɺIssue / Pull Request ʹಈ࡞ใࠂ͢Δɻ͜Μͳͱ͜Ζ͔ΒॳΊͯΈ·ͤΜ͔ɻ64
͋ͳ͕ͨݺͼ·͠ΐ͏ɺফं!!!65
͋ͳ͕ͨॻ͖·͠ΐ͏ɺόάϨϙʔτ!!!66
Thanks!• @Toro_Unit on Twitter and WordPress.org• @torounit on Github and Making WordPress67