HeadlessCMS Strapiの使いどころ

# はじめに（この記事の対象読者）
今、会社で[strapi](https://strapi.io/)を使った開発が複数走っています。
僕はプロダクトオーナー的な立場で関わっているのですが、その立場から見ても[strapi](https://strapi.io/)って非常に魅力的なので、Qiita Advent Calendarに便乗して紹介記事を書かせていただきました。

なお、この記事の読者は以下のような人を想定しています。

- WordPressじゃ高機能なWebシステムの基盤として使うには少し厳しいと感じ始めている人
- HeadlessCMS（ヘッドレスCMS）は聞いたことがあるけど使い所がわからないよって人
- HeadlessCMSいくつかあるけど、どうやって選ぼうかなと考えてる人

逆に以下のような人は別記事へ飛ぶのがオススメです。

- [strapi](https://strapi.io/)のカスタマイズ方法など技術的な内容を調べたい人
- 既にHeadlessCMSを導入していて割と詳しい人

## HeadlessCMS / strapiとは
HeadlessCMSや[strapi](https://strapi.io/)について紹介している記事は既に山ほどあるので、本稿では独断と偏見に満ちた内容を記したいと思います。

なので、わかりやすくHeadlessCMSを説明している[この辺り](https://microcms.io/blog/what-is-headlesscms/)の記事を合わせて読むことを**強く**お勧めします。

### HeadlessCMS?
さて、HeadlessCMS（ヘッドレスシーエムエス）とはなんでしょうか。

これは一言で言ってしまえば**管理画面とAPIだけを機能として提供するCMS**です。

バックエンドとフロントエンドが完全に分離しているのでWordPressのようなバックもフロントも全て一緒に管理するCMSよりも、扱う範囲が狭いので**CMS自体のセキュリティが結果として高まる**(WordPressなどのフルパッケージのCMSの場合、フロントエンドのセキュリティホールによりバックエンドの情報が引っこ抜かれる、など１つのセキュリティーホールの影響範囲が広くなる傾向がある）というメリットもあります。

でも、やっぱり一番は**ユーザーにとっては「バグなく動いて当たり前」の管理画面を提供してくれた上でフロントエンドは自由に作れる**というその基本的なところが今のモダンな開発スタイルにマッチしているということに尽きると思います。

###strapi?
[strapi](https://strapi.io/)（ストラーピ）はそのHeadlessCMSの一つです。

HeadlessCMSは大きく分けて２つの種類があります。
クラウドサービスとして提供されているものとセルフホスティング型のものです。

前者はアカウントを作って料金を支払って使うサービス（多くのものは無料枠が存在します）で、後者のセルフホスティング型はその名の通り自分で動作環境を構築し、そこにホスティングするものを指します。

[strapi](https://strapi.io/)はセルフホスティング型のHeadlessCMSでオープンソースで提供されています。

この辺りは一概にどちらが良いかは判断しにくいのですが、クラウドサービスとして提供されているものは、多くの場合、スタートアップ企業が提供しています。

この会社が倒産してしまったり、サービスを停止するとなった場合のダメージをどの程度まで受け入れられるか、というのが一つの判断基準にはなるのではないでしょうか。

ただ、やっぱりサービスとして提供してくれているものは使うの楽なんですよねえ笑

## Ghost, directusとstrapiの比較
[strapi](https://strapi.io/)は今までも述べた通り、セルフホスティング型のHeadlessCMSです。

その形で提供しているものは[Ghost](https://ghost.org/)や[directus](https://directus.io)などがあります。

HeadlessCMSを使いたくて、自分でホスティングしたい、となったら大体上の２つに[strapi](https://strapi.io/)を入れた3つが比較対象になるんじゃないかと思います。

ちなみに、クラウドサービス型だったら日本製の[microCMS](https://microcms.io/)がなんだかんだドキュメント類も日本語で最初から提供されているんで日本人にはオススメです。
クラウドサービス型を選ぶってことは管理や開発を楽に行いたいという動機がかなり強いと思うので、だったらドキュメントやサポートが母国語ってのは大きな採用理由になります。


さて、話を戻すと上記の３つのセルフホスティング型のCMSに「このCMSだけでしか、これは出来ない」というのは無いように見えます。
※当然、 なんちゃらの実装は[strapi](https://strapi.io/)の方が**やりやすい**などはあります。

それなら、ということで判断基準として管理画面のUIを比較してみるのも良いと思います。
以下では簡単に[Ghost](https://ghost.org/), [directus](https://directus.io), [strapi](https://strapi.io/)の管理画面からみた使い所の比較を行っていました。

### Ghost
まずは、[Ghost](https://ghost.org/)の管理画面ですが、こんな感じです（出典：[Ghost公式](https://ghost.org/)）
![ghost-admin-home-header-0c20f780aac8e98af7a56076ae8228b8.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/19695/1420e0f0-e337-18ba-ea20-79f12a6ebed8.png)

元々がブログ特化型のCMSであることもあって、ブログの執筆・管理が非常にやりやすいUIになっています。

また、[Stripe](https://stripe.com)(strapiでは無いですよ！)を使用したサブスクリプション課金の実装・メンバー管理などもやりやすく、**メディア運営するなら[Ghost](https://ghost.org/)**という感じです。

### directus
[directus](https://directus.io)はこちら。ウサギが可愛いです。（出典：[directus公式](https://directus.io/)）

![名称未設定-2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/19695/944b2a2b-16c6-7470-5dd0-f2c8b49aed6a.png)
[directus](https://directus.io)の管理画面はデータ構造がわかりやすく、ファイル管理も洗練されている印象があります。

大量のデータを扱うECサイトやデータ管理の基盤として使う、などの用途に向いていると感じました。
ちなみに、[directus](https://directus.io)はもうほとんど更新はしていないんですが [Youtubeチャンネル](https://www.youtube.com/c/directusVideos/featured)もあります。見てみると利用イメージがさらにわくかもです。

### strapi
さて、最後にこの記事の主役の[strapi](https://strapi.io/)管理画面です。
![FireShot Capture 008 - strapi - Content Manager - hoikutasu-staging.du.r.appspot.com.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/19695/9653af37-0cc9-7448-df48-6d05bb1153a5.png)
これは弊社で[開発中のサービス](https://hoikutasu.com/)の管理画面のキャプチャです。

印象としては[Ghost](https://ghost.org/)と[directus](https://directus.io)の中間、と言った感じでしょうか。非常にシンプルなUIです。

特徴としてはコレクションタイプとプラグインの概念。
[strapi](https://strapi.io/)では管理画面からデータモデルを定義してコレクションタイプとして追加出来ます。

上記の画面はいわゆるノウハウ共有サイトの管理画面なのですが、投稿内容の種類に応じたデータモデルの設計が画面上からできる形です。

もう一つのプラグイン。
これはもうそのままなのですが、追加機能をプラグインとして実装＆追加が可能です。
プラグインの存在により、バックエンド側にもある程度の自由度があるのは非常に助かります。

では、[strapi](https://strapi.io/)はどんなケースで有効なのかというと、**ユーザー投稿型のサイトで集計機能などの自分たちで作らないといけない追加機能を複数有するもの**、なのかなと感じています。
（まあ、なので今開発しているサービスのCMSとして[strapi](https://strapi.io/)を採用したんですが）

あと、UI関係ないんですが、[strapi](https://strapi.io/)って導入簡単なんですよ。
それも採用理由の一つでした。

#終わりに
どんな技術も使いどころを間違えれば微妙だし、正しく使えば非常に有用です。

[strapi](https://strapi.io/)も同じであらゆるサービス開発で使うべし！ということではないのですが、勘所を抑えれば基本的にはAPIを使ってフロント側でどーこーするものなので学習コストもそんなに高くないし、利用検討している人は一回触ってみるのも良いと思います。

[strapi](https://strapi.io/)、日本での盛り上がりはまだまだなので一緒に盛り上げていきましょう！