「Gutenberg 以降のテーマ作成に向けて、今学ぶべきこと」について登壇しました
12月6〜7日に開催された WordCamp Osaka 2019 の2日目セッションデイにて「Gutenberg 以降のテーマ作成に向けて、今学ぶべきこと」というタイトルで登壇させていただきました。本セッションは、難しいコードが沢山でてくるような内容ではないものの、既にテーマを数年間作ってきた中級レベル以上の開発者を主な対象とした内容でした。
当日は、開始10分前に既に立ち見満席となりビックリしています。
ブロックエディターが実装された WordPresss 5.0 がリリースされたのが2018年12月。ちょうど1年は経ちますが、その頃も、また今でも、「JavaScript と React ができるようにならなければ、ブロックに対応してくことができない…」という声をよく聞きます。ブロックエディターの現状、カスタムブロックを作ろうとすると React のスキルが必要になってくるのは確かにそうなのですが、ブロックエディターの利用を前提としたテーマの作成に関わっていると「今のスキルセットに React のスキルだけ上乗せすれはOK！」という単純な状況ではないぞ、と強く思うようになりました。
セッションでは今学ぶ（もしくは学び直す）べきこと、として以下の3つを取り上げました：
- PHP スキル
- CSS 設計
- ブロックエディター
1. PHP スキルのレベルアップ
前述のように、ブロックエディターは React で作られていますが、後方互換を大切にしている WordPress においてテーマ作成から PHP が土台であることはしばらく続くと思われます。加えて、今年になって PHP 5.6.20 が必須となり、PHP 7 の必須是非についても議論が交わされています。WordPress と PHP 7 というと処理速度が速くなる事が多く語られますが、プラグインやテーマでもよりモダンな PHP が少しづつ使われ始めています。今こそ、遅くないので、PHP の基本スキルを再レベルアップしましょう。
2. CSS 設計の考え方
ブロックエディターになり、様々なコントロールがエディタ上に追加された結果、出力されるスタイルがいくつも追加されています。フロント側で反映させるために Bootstrap のような CSS フレームワークをとりあえず読み込んでおけば…だけでは今後は対応が難しくなりそうです。工数も上がりますし、時間も掛かります。「良いCSS」、特に「再利用」と「拡張」を高品質で保つには、設計段階から見直しが必要ではと考えます。
3. ブロックエディターそのもの
カスタムブロックの作成や、独自の処理をデフォルトのブロックに追加するといった実装は（少なくとも現状は） React のスキルを上げていくしかありません。しかし、そもそもブロックエディターが開発された経緯にユーザーエクスペリエンス（UX）の向上、というのがあります。React を駆使して実装を追加しても、UX を下げるような実装ではマイナスです。しかし逆に、UXを大幅に向上させるうようなブロックの実装ができれば、それは大きなプラスとなります。
引き続き前へ
学ぶ「べき」こと、と言い切ったタイトルになっていますが、私自身もまだまだ学ぶ事が沢山あります。引き続き前に進んでいこうと思います。
全ての内容は開発者向けなのですが、3つ目のブロックエディターに関して最後の方で述べさせていただいた「まずは、ブロックエディターを使い倒そう」（スライド76枚目）というのを、開発者・一般ユーザーに関係なく、まだの方はまずこれを実践していただければと思います。
