はじめに
Astroを使おうとしています。CMSはいくつも紹介されていますが、どれがよいかわからない。
ChatGPT に聞いてみました。
4つ教えてもらいました。
| ヘッドレスCMS | Qiita記事数1 | 使用形態 |
|---|---|---|
| Contentful | 121 | ホスティングのみ |
| Strapi | 63 | 自己ホスティング可能 |
| Ghost | 36 | 自己ホスティング可能 |
| ButterCMS | 2 | ホスティングのみ |
自己ホスティング可能なGhostとStrapiについて調べてみます。
Ghostを試してみる
インストール方法
インストール作業は、CLIを使って行います。便利ですね。
まずCLIをインストールします。
npm install -g ghost-cli@latest
適当に空のディレクトリを作り、CLIを実行します。
いろいろオプション（データベース接続とか）がありますが、後から変更できます。
mkdir ex-project
cd ex-project
npx ghost install --local
--local は、もろもろよろしくやってくれるためのオプションです。
インストールついでに、サーバも起動してくれます。楽ちん過ぎる 
ディレクトリ内には、こんなファイル群ができました。
./
├── .ghost-cli
├── .ghostpid
├── config.development.json
├── content/
│ ├── apps/
│ ├── data/
│ ├── files/
│ ├── images/
│ ├── logs/
│ ├── media/
│ ├── public/
│ │ ├── admin-auth/
│ │ │ ├── admin-auth.min.js
│ │ │ └── index.html
│ │ ├── cards.min.css
│ │ ├── cards.min.js
│ │ ├── comment-counts.min.js
│ │ └── member-attribution.min.js
│ ├── settings/
│ │ └── routes.yaml
│ └── themes/
│ └── casper -> ../../current/content/themes/casper/
├── current -> versions/5.39.0/
└── versions/
└── 5.39.0/
Ghost本体はversionsの下に置かれ、シンボリックリンクで使用するバージョンを決定するのかな？
ユーザ作成のコンテンツはcontentの下に置かれるようです。治安よいディレクトリ構成ですね。
初期セットアップ
http://localhost:2368/ghost/ を開きます。
WordPress みがあります。
管理画面
ログイン後の管理画面はこんなんでした。日本語ではないですね。ChatGPT さん間違ったかな。
管理画面の日本語化は簡単ではなさそう
日本語化したいところですが、ソースを見た感じでは、ハードコードされているようです。
Handlebars のテンプレートも、普通に英語で書かれています。
日本語化は、公式から手段を提供してもらわないと、長く険しい道のりになりそうです。
GhostはWordPressの代替？
勘違いしていましたが、Ghostはヘッドレスではなくヘッド有りなんですね。
WordPressにお疲れ気味のかたには、Ghostはよい選択かもしれません。
ただ、管理画面は日本語化したいですねー。
Strapiを試してみる
始め方
ドキュメント に従いまして、さっくりとプロジェクトを作成します。
npx create-strapi-app ex-project --typescript --quickstart --no-run
指定したディレクトリ名の下に、以下のようなファイル群ができました。
./
├── .editorconfig
├── .env
├── .env.example
├── README.md
├── config/
│ ├── admin.ts
│ ├── api.ts
│ ├── database.ts
│ ├── middlewares.ts
│ └── server.ts
├── database/
│ └── migrations/
├── favicon.png
├── package-lock.json
├── package.json
├── public/
│ ├── robots.txt
│ └── uploads/
│ └── .gitkeep
├── src/
│ ├── admin/
│ │ ├── app.example.tsx
│ │ ├── tsconfig.json
│ │ └── webpack.config.example.js
│ ├── api/
│ │ └── .gitkeep
│ ├── extensions/
│ │ └── .gitkeep
│ └── index.ts
└── tsconfig.json
サーバを起動します。
npm run develop
初期セットアップ
ブラウザが自動的に起動して、このような画面が表示されました。
右上に言語の選択があります。英語とフランス語が使えるようです。
日本語化できそうな気配がします。
管理画面を日本語化する
検索したらちゃんとありました。
掲載されている手順に従って日本語化します。
自分はTypeScriptにしたので、変更するファイルがちょっと違いました。
export default () => ({
i18n: true,
"strapi-plugin-ja-pack": {
enabled: true,
},
});
export default {
config: {
locales: ["ja"],
},
bootstrap(app) {},
};
あとは、再起動して管理画面から設定することで日本語化できました。
@yasudacloud さん感謝 
まとめ
GhostとStrapiを試しました。
Ghostは管理画面が日本語じゃないので、人に使ってもらうのは難しそうです。
Strapiは英語混じりですが日本語化できましたし、シンプルでわかりやすくてよい感じです。
Astroとの連携ガイドには掲載ありませんが、きっとなんとかなるでしょう。
-
2023年3月現在 ↩