見出し画像

Wordpress学習者・開発者がJavaScriptに習熟すべき5つの理由

こんにちは、Teshi(@atsuhio)です。フィリピンに住みつつ、欧米の子供向けプログラミングスクールCodeGrit Jrを開発中です。オンライン英会話サービスも運営しています。

今回の記事は、Wordpressを利用したWeb開発を勉強されていたり、これから就職やフリーランスを目指す方へ向けて書いています。既に開発をされている方は最初の方は既に知っていることばかりかと思いますので飛ばしていただければと思います。

WordPressは万能ではない

WordPress開発者を目指している方の中には、Wordpressを学べばメルカリのようなWebアプリも作れる。と思われているかもしれません。

しかし、Wordpressは万能ではなく頑張れば簡単なECサイトなどは作れますが、より複雑なことをするには向いていません。

勉強が進んでいくとわかってきますが、例えばECサイト制作であればShopify、本格的なWebアプリならRuby on RailsなどのWebフレームワーク。最近であれば簡単なプロトタイプならノーコードのツールを使って作るなど分野や用途によって利用すべき技術は変わってきます。

WordPressの得意な分野とは?

逆にWordpressが得意なことは、ブログや企業のサービスサイトなどを作ることです。世界中の多くの企業がブログや自社サイトの構築にWordpressを利用しています。このブログでもWordpressを利用しています。そのために、世界のWebサイトの30%はWordpressで出来ていると言われています。 多くの会社がブログや自社サイトをWordpressで作るので当然とも言えますね。

なぜWordpressがCMSとして最も人気が高いのか?

WordPressはCMSと呼ばれる種類のソフトウェアの一つです。CMSとはコンテント・マネジメント・システムの頭文字から来ています。言葉の通り、コンテンツを管理するためのシステムです。

Webページを作る時に毎回毎回HTML/CSSを打ち込んで構築するのは大変です。CMSを利用すると、テンプレートを作成することが出来、このテンプレートを利用することで複数ページを基本的に同じデザインで簡単に生成することが出来ます。

CMS自体はWordpressだけではなくたくさん存在しています。僕が今書いているこのnoteのエディタもコンテンツ・マネジメント・システムですね。その中でも、Wordpressは開発者の多さやプラグインの充実度でほかを圧倒しています。

例えばGhostというCMSは僕も利用経験がありとても優れたCMSです。ブログを作るという目的でいうと、基本的な使い勝手はWordpressよりいいと思います。しかし、それでもWeb上に豊富にあるノウハウや、プラグイン、テーマのこと、更にWordpressに慣れ親しんだライターがたくさんいること、などを総合的に考えるとまだWordpressに軍配が上がります。

このように単純な使い勝手だけでなく、様々な要素が組み合わさりWordpressが一番人気となっています。

Wordpress開発者が知っておくべき動向その1: ヘッドレスCMSの人気の高まり

さて、そんなWordpressが圧倒していたCMS業界を今新しい波が襲っています。それがヘッドレスCMSの登場です。

ヘッドレスCMSとは、Wordpressなどの実際のコンテンツ表示部分を取り払い、裏側のコンテンツ管理部分に特化したソフトウェアのことを言います。コンテンツ表示部分(フロントエンド)のことをヘッドと考えて頭がないシステムということですね。

ヘッドレスCMSにおいては、Web APIという仕組みを利用して、フロントエンド側にコンテンツを送信します。つまり、Web APIを受け取ることが出来るならフロントエンド側にはどんなコードを利用してもいいことになります。

なぜヘッドレスCMSの人気が高まっているのか?

ではなぜ、ヘッドレスCMSの人気が高まっているのでしょうか?

理由1 - React.jSやVue.jsの普及

これには、JavaScriptのUIライブラリの充実が大きく関係しています。

以前のWebサイト開発では、単純なHTML/CSSでサイトを構築し、サイトの一部分にjQueryを導入するというものが主でした。しかし現在ではReact.jsやVue.jsといったJavaScript製のUIライブラリを利用して、よりフロントエンド側をリッチに作る(動きを与える、ページ読み込み無しで画面をまるごと切り替えるなど)ことが普通になってきています。

CMSの場合もReact.jsやVue.jsを導入することで、通常のWebサイトに比べて圧倒的に早くコンテンツを表示することが出来ます。

理由2 - Webアプリの一部分へのCMS導入

もう一つ大きいのがこちらです。先程説明した通りWordpressを利用してECサイトなどより複雑なサービスを作成することはなかなか難しいです。

しかしヘッドレスCMSを利用すれば、例えばECサイトをRuby on Railsなどの言語を利用して構築し、サイト内のコンテンツ部分のみCMSからWeb APIを利用して引っ張ってくるということが出来ます。

実際、CodeGritのサービスサイトでも、WordpressのWeb APIを利用してブログのコンテンツを取ってくる、自社のWeb APIから別のコンテンツを取ってくる、というように複数のサービスを組み合わせています。

理由3 - コンテンツの自由度の高さ

例えば、CodeGrit Jrでは現在StrapiというヘッドレスCMSを使って教材コンテンツの作成を行っております。ヘッドレスCMSはWordpressに比べて作成できるコンテンツの自由度が圧倒的に高く、個人的にはブログ以外の用途で開発者がいればStrapiなどのヘッドレスCMSのメリットが大きいとは思います。これについてはまた別の記事で詳細を書こうと思います。

例えばですが、CodeGrit Jrの教材コンテンツは、Courses、Lessons、Concepts、Blocks、Atomsといった異なる形式のデータを持っています。コースは複数のレッスンを持ち、レッスンは複数のコンセプト、コンセプトは複数のブロック、ブロックは複数のアトムを持つという感じです。これをWordpressで実現するのは正直かなり難しいです。

そんなわけで複雑なものを作るならこれからはヘッドレスCMSが使われることが増えるかもしれません。

Wordpress開発者が知っておくべき動向その2: WordPress5のリリース

WordPress5のリリースは大きなニュースでした。グーテンベルクという仕組みが導入されてたからです。

グーテンベルクは、Wordpressの記事編集画面をより便利にするためにできました。記事編集画面でブロック(定型のコンテンツを入れる固まり)を利用してコンテンツを構成することが出来るようになり、様々なレイアウトを自在に表現出来るようになりました。

ブロックは、編集画面上での表示内容と、実際のコンテンツ上での表示内容の2つを作成することになります。作成時にはReact.jsをベースにした独自の書き方をします。

僕も利用したのですが、React.jsに慣れ親しんでいればすぐにブロックを自分で作れるようになります。

純粋なヘッドレスCMSと比べたときの自由度では劣りますが、企業のWebサイトやブログでは威力を発揮すると思います。

WordPress開発者が今すぐJavaScriptに取り組むべき理由

理由1 - 新規開発はWordpress5に移行されていくから

さて、ここからが本題となるのですが既に上記の項目でほぼ言いたいことが書かれていますね。

WordPressの開発ではこれまで小規模から中規模なWebサイトの開発がメインで行われてきました。そのため、JavaScriptはjQueryのプラグインを少し利用したりするだけのことが多く、構成などにあまり気を使う必要はありませんでした。そのため、Wordpress開発者でJavaScriptに習熟した人はそれほど多くありませんでした

しかし、Wordpress5がリリースされた現状とあっては当然依頼者側としてもグーテンベルクを活用して、より自由度の高いWebサイトを構築したいと考えるのが普通です。

現状は事例が少ないので依頼者側も作成側もどういうことが出来るのかまだ把握出来ていないかもしれませんが、状況はすぐに変わるかと思います。

理由2 - WordPress APIのみを利用した開発案件が増える

次の理由として、Wordpress APIを利用してWordpressをヘッドレスCMSとして利用してしまうような案件が今後増えることが考えられます。

WordPressを利用すると、どうしてもPHPを使う必要があります。しかし、WordpressをヘッドレスCMSとして利用すればその制限はなくなります。React.jsにRuby on RailsやExpress.js、Go言語など自由なフレームワーク、UIライブラリ、言語を利用してフロントエンド側のアプリを構築できます。

こうなってくると、現在Wordpressの開発を主に行っている開発会社でも必然的にフロントエンドをReactで開発したりする案件が増えてきます。それに対応出来ない制作会社は淘汰されていきます。

理由3 - 既存WordpressサイトのWordpress5以降が行われるから

これは新規開発と近いのですが既存のWordpressで出来たWebサイトも当然ながら、今後Wordpress5へと順次移行していきます。もちろん今まで通りのエディタも使えるのですぐには進まないでしょうが、時代は前にしか進みません。

付き合いがある会社に既存サイトの開発を引き続き依頼する会社ももちろん多いでしょうが、より自由度の高いWebサイトを作りたい企業はWordpress5での開発に長けた企業やヘッドレスCMSを使える企業をパートナーに選んでいくはずです。

理由4 - Wordpress開発だけでも稼げるけど茨の道かも

さて、ネット上ではWordpressを学べば月15万円はすぐに稼げる、というようなことを書いている人が結構います。それだけあれば例えば僕の住んでいたセブなら余裕で生活できるし、アジアを仕事しながら旅をする、ということも可能です。

個人的な意見では、すぐとは言わずともクラウドソーシングなどでWordpress案件を獲得し月15万円を稼ぐことは可能です、が非常にストレスの高い仕事になるでしょう。

なぜかというと、クラウドソーシング上のクライアントは値段第一という方も多く質の低いクライアントも多くいるためです。また、Wordpress開発者は多いのでその中で提案して勝ち残るのも大変です。更に、Wordpressの案件は継続的な開発がそれほど多くないので単発の案件を繰り返し獲得する必要があります。

実際ネットを見ていても、Wordpressからこの世界に入り、自分には向いてなかったと辞めてしまう方が多いです。ちょっと業界の中の人としては残念です。他の言語をやれば状況は違ったかもしれません。

理由5 - 数多い開発者の中から頭一つ抜け出せる

しかし、これから学ぶ人にとってチャンスなのはWordpressだけでなくReactを学びWordpress5にいち早く対応すれば他のWordpress開発者を出し抜くことが出来ます。

フロントエンドをリッチにすることのメリットをきちんと説明することができれば、他の一般的なWordpress開発者から差別化でき、単価も上げられるでしょう。それであれば、単純なWordpress開発者としてよりもストレス度合いは下げられます。

また、Wordpressの案件をしてみて、もっと技術的挑戦のあることをやりたいと思った場合でも、今はReactエンジニアは全然足りてないので他の言語に比べて就職などはしやすい点もメリットです。

さらにいうと、上述したヘッドレスCMSを使うとWordpressよりも自由度の高いコンテンツの作成が可能となります。ヘッドレスCMSを使う場合、フロント側はJavaScript(ReactやVue、それらを利用したNextやNuxtといったフレームワーク)を使うことになる可能性が高いでしょう。僕の見方では、今後大きな企業ほどそこに魅力を感じる場合が増えそうです。

JavaScriptを学んで周りから一歩先に進もう

いかがだったでしょうか? ちょっと長くなってしまいましたがこの記事を読んでJavaScriptを本格的に学ぶ人が増えると嬉しいです。

また、この記事と関連して現在企業での採用件数が急増しているGatsby.jsを利用したWebサイト制作を学ぶ無料の学習コースを公開しています。HTML/CSSの基礎を学んだ方から対象となり、JavaScriptの講座も含みますので興味のある方は是非ご覧ください。