ANNAIマガジン
decoupled-drupal
この記事は「 What Is Decoupled Drupal and Why Is It Important? 」の翻訳です。
この記事の目次

 

Decoupled Drupalとは何か?なぜ重要なのか?

ウェブの世界は、あなたのアンテナにビビッとくるトレンドを発信しないはずはありません。この数年で勢いがあり、トレンドになっているのがdecoupling(デカップリング)です。簡単に言うと、decouplingのコンセプトはサイトのフロントエンドをバックエンドから切り離すことです。つまり、サイト訪問者が見てアクションするサイトの要素(メニュー、ページコンテンツ、ウィジェット)は、ウェブブラウザの中のソフトウエアによって作られ、表示されるという意味です。サーバー上で動くバックエンドソフトウエアはそれぞれ違うページ要素のためにフロントエンドからのリクエストを承認し、生データを返します。

このように懸念が完全に分離されると、ウェブサイトの各半分は、最も効果的なものに集中することができます;バックエンドはビジネスロジックとデータ復旧に、フロントエンドは表示とユーザー体験の強化に。

どのように実現するか

ここでJavaScriptフロントエンドフレームワークが活躍します。有名なものにはAngularがあります。Angularは当社のプロジェクトでは成功事例が多いですが、React、Emberなどその他たくさんのフレームワークがあります。これらは熟練した開発者が、バックエンドのリソースを要求するページリフレッシュをすることなく、複雑でとてもインタラクティブなフロントエンドを開発するのに役立ちます。

これを実現するために、カスタム開発やホイールの再設計などが必要ない、パワフルで柔軟なコンテンツマネジメントシステムがあることが非常に重要です。ここでDrupalが活躍するのです。Drupalが持つしっかりしていて柔軟なAPIのおかげで、いろんなプロジェクトで成功事例があります。最新バージョンのDrupal 8はこの「APIファースト思想」によってこのトレンドをさらに推し進めています。

002

ビルドインRESTfulウェブサービスやハイエンドなコンテンツモデリングツールはバックエンドシステムに必要なほとんどのことをします。バックエンドはフロントエンドや他のアプリケーションやサードパーティーのサービスと容易にコミュニケーションします。これによりDrupalは、あらゆるアプリケーションにコンテンツを届けるために効果的なハブとなります。

良い点と良くない点

新しい技術を世の中に紹介するとき、考慮すべき点がいくつかあります。decoupledフロントエンドは体感パフォーマンスやインタラクティブ性を向上させます。完全なコンテンツマネジメントシステムができないこと(レンダリングがバックエンドで行われることなど)をできたりします。バックエンドがどのように作られたかに関わらず、完全にフロントエンドを独立して開発することができます。テンプレートシステムとなるCSSがどのように作られ管理されているか、デザイン要素のためのあるべき手法、これらのことが全く別プロジェクトのように扱われるようになります。デザイナーやフロントエンドデベロッパーは、現在使っているCMS特有のスキルを持たなくて良くなります。

人生というのは常に完璧ではありません。主な課題は、これらトレンドが、現在のサイト構造や管理方法にどのような影響を及ぼすのかを考えるときに明らかになります。DrupalのようなCMSを使うと、ツール内の重要な機能を失い始めます。例えば、ページに表示されたフィールドの順番を変えるために、Drupalのサイトビルディングツールを使うことができますか?こういったことはフロントエンドでかなり重点的にコーディングされます。いくつかの多言語機能も失い始めます。メタタグやSEO機能にも影響があります。結果的にウェブサイトを作るのに必要なスキルセットが増える可能性があります。これらは解決できない問題ではありませんが、decoupledサイトを開発するために、どこに自分のスキルを使いたいのかを考える必要があります。

2つのアプローチ

フロントエンド、バックエンドを分けるというコンセプトについて理解したら、調査をしながら2つのアプローチが見つかるはずです。Headless Drupal(ヘッドレス)つまり完全にdecoupledなフロントエンドのバージョン。もう一つはProgressive decoupling(プログレッシブでカップリング)です。「はっ!?なにそれ?」って今言ったかもしれませんねw Progressive decouplingとは、完全にdecoupledにするというよりは、フロントエンドとバックエンドがやっていることをぼかすという意味です。

Progressive decouplingは、decouplingをせずに従来通り行なっているウェブサイトへのアプローチをし、バックエンドがウェブページを生成するために必要なほとんどのことを行います。その後、よりインタラクティブなものとみなされる、または生成に時間がかかる個々の要素は、フロントエンドによって処理されます。この手法は現在使用しているCMSとも比較的相性が良く、既存のウェブサイトに実装しやすいです。

新しいトレンドには問題も起きやすい

ウェブサイトをdecouplingすることは従来型のウェブサイトモジュールが持つ問題を解決する良い方法です。これらの問題に直面しているプロジェクトではこのdecouplingを推奨します。しかし他のすべてのテクノロジーと同様に、decoupleを強制的に導入する前に、あなたのサイト(やプロジェクト)でそれが求められているかどうかを確認しましょう。decouplingによってユーザー体験は革新的に変わりますが、無理やり適用することによる問題もあり、開発期間も長くなり、結局コスト高になります。

フロントエンドでの問題が少ないシンプルなサイト(主に静的ページ)やユーザー(または地域ごとの)特有コンテンツのあるサイトは、decoupledフロントエンドのようなテクノロジーは必要ないと思います。私のアドバイスとしては:常に要求をあなたのソリューションと照らし合わせましょう。テクノロジーは問題解決が得意ですが、間違ってプロジェクトに間違って適用しないでください。

この記事を書いた人 : Kentaro Inoue

ANNAI株式会社
経営企画室 室長
サービスの設計・企画、マーケティング、採用戦略の立案などを担当。普段は新潟で猫と一緒に、時々海外からリモートで働いています。好きなモジュールはRulesとFlagです。

関連コンテンツ