エンジニアリングGの冨岡(@jooohn1234)です。
M3 USAに出張して１週間少し経とうとしています。初めての週末は、Central Parkを散歩したり、The Metを訪れたり、ShakeShackのハンバーガーを食べたりしてニューヨーカーを気取って過ごしました。（一人で）
プライベートの話はともかくとして、今回はUSでの私たちの取り組みと、ContentfulというHeadless CMSサービスについて紹介します。
M3 USAでの取り組み
M3 USAではいくつかのサービスが平行して運用されているのですが、そのなかの一つがMDLinxという医師向けの情報ポータルサイトです。
一見、ニュース記事や論文などのリードオンリーなコンテンツを提供するだけのシンプルなサイトに見えますが、裏側は10年以上の歴史が詰まり、継ぎ足し継ぎ足しでできた巨大な泥団子になっており、記事のレイアウトを少し変えるのにもエンジニアが工数を使って開発しているというのが現状です。
単にライターやエディターがもどかしいだけでなく、開発が全体のボトルネックとなっているため、システムの負債がビジネス上の大きな負債となってしまっています。USと聞くと、シリコンバレーやスタートアップ、技術の最先端をいく華やかな世界の印象が強いですが、こういう泥臭いことも全世界で起こっているんですね！
ともあれ、この状況をなんとかする、というのが私たちのミッションの一つです。
CMSの選定
やりたいことをざっくりと整理すると以下のようになります。
- エディターやライターがある程度自由にレイアウトした記事を書ける
- 特定の商品の紹介記事の横に、関連する広告を出せるくらいのフレキシビリティが求められる
- ライター、レビュワーなどの各ロール間で必要なワークフローをスムーズ実現できる
特に違和感ないですね。フレキシビリティとメンテナビリティを如何に両立できるか、というのは重要なファクターになりそうです。ここの仕組みがうまく設計できないと、前より少しだけマシな泥団子を産み落としてしまうことになるでしょう。
なお開発リソースが潤沢にあるわけではないので、既存のCMSサービスから合うものを選定する方針です。特殊な要求はないので、妥当な判断に思えます。
既存CMSにはいくつかの選択肢がありますが、以下のような分類で各サービスを評価しています。
- トラディショナルなCMS
- WordPress, Drupal などのOSS を:
- 自前で運用する
- ホスティングサービスを利用する(https://pantheon.io/など)
- いずれもAPIとしての利用を想定。
- WordPress, Drupal などのOSS を:
- Headless CMS
- フロントエンドが存在せず、APIのみを提供するCMSサービス。
- Contentful, GraphCMSなど
今後のワークフローに関わる重要な決定なので、慎重に検討中です。 この検討候補の一つであるContentfulがとても良いサービスだと感じたので、ここで紹介させていただきます。
Contentful
Beyond headless CMS: The flexibility developers crave, the reliability business demands
Headless CMSという概念を、私は今回のプロジェクトで初めて知ったのですが、Contentfulはなんとそれをbeyondしているそうです。
基本的な使い方
Contentfulでは、必要なContent Modelを利用者が定義し、その定義にしたがったContentを追加・管理することができます。 Content Modelがクラスで、Contentがそのインスタンスと考えると考えやすいかもしれませんね！
PublishしたContentは、API経由で取得することができます。
その他一般的なワークフローの制御に加えて、Webhook、カスタムUIなど柔軟なシステムを構築するための一通りの機能が提供されています。
Rich TextとContentfulの世界観
ContentfulはRich Textの機能をBeta版ではありますが提供しています。これがとてもよくできています。
一見普通のWYSIWYGエディターに見えますが、HTMLではなくstructuredなデータが保存されるようになっています。
これのデータをどう解釈して表示するかはフロントエンドの責務です。たとえばparagraphを<p>ではなくMaterial DesignのCardのスタイルに当てはめるということは自由自在です。要するに、データとビューの責務がきちんと分離されるのです。ReactなどのViewライブラリのコンポーネントなんかにマッピングすると開発しやすそう、など妄想が捗りますよね。width:300pxといった、触るな危険な汚いHTMLを扱う必要はないのです。
さらにこのContentfulの世界観を強化するのが、他のContentの埋め込みです。例えば広告を差し込むために"Advertisement"というContentModelを定義すれば、そのContentを埋め込むことで「この位置に広告を挟む」という意図をデータで表現することができます。広告にカテゴリのような概念があるなら、Advertisementモデルにcategoryフィールドを増やせば良いでしょう。
柔軟なContentModelの定義と、それを直感的に埋め込めるRich Text、そして提供される構造化されたデータ。ContentfulはHeadless CMSとしてとてもシンプルで綺麗な世界観を提供しているように見えます。エンジニアが用意したコンポーネントを、エディターやライターが適切に配置して記事を作っていく。フレキシビリティとメンテナビリティを以下に両立できるか"という観点で、このRich Textの機能が一つの良い答えになっているのではないかと思っています。
ちなみに、このRich Textの機能はつい先日(10/17)にリリースされました！すごいタイミングの良さですね。
まとめ
M3 USAでの取り組みと、ContentfulというCMSについて紹介させていただきました。
We're hiring!
日本のエムスリーだけでなく、M3 USAでの採用も積極的に行なっているので、ご興味があれば是非お声がけください！
