Slim4 + microCMS でサクッとブログ作ろうぜ！
Slim4 + microCMS でサクッとブログ作ろうぜ！
はじめに
PHPerのみなさん、PHPでSlim4使ってますか？
PHPerの方が、個人でブログサイトを開発する場合、色々なCMS（WordPress・Drupalなど）やフレームワーク（Laravel・Symfony・CakePHPなど）が採用候補として挙がると思います。
ただ、個人レベルでのブログくらいはサクッと簡単に作りたいから、某CMSやフルスタックフレームワークを使うのは、ちょっと重たいという方もいると思います（お気持ち分かります）
では、次の候補として、SSGやSPAのサイトが作れるJavaScriptフレームワーク（NextJS・Astro・Gatsbyなど）が挙がります。
現在2023年だったらJavaScriptのフレームワークを採用するのが自然な流れだと思いますが・・・だが断る！
PHPerとしては、是非PHPベースで開発して頂きたいです！
そこで、私がオススメしたいのは Slim4 + microCMS による開発です。
Slim4を推す理由
なぜ私が、こんなにSlim4を推しているかというと、一言で言うならパッケージを組み合わせる楽しさを味わえるフレーワークだからです。
Slimのリポジトリのとあるissueに、開発者の方が以下のような事を書いていました。
「Slim Frameworkはマイクロフレームワークであり、主にWebアプリケーションを迅速に構築するための最小限の必需品を提供するように設計されています。
その哲学は、軽量性を維持し、追加機能をサードパーティライブラリで処理できるようにすることを中心に展開しています」
つまり、マイクロフレームワークだからこそ、開発者の裁量で自由に色々なパッケージを組み合わせる楽しさがあるんです（勝手に解釈）
例えば、以下のような組み合わせで開発しても良いかと思います。
| 対象 | パッケージ |
|---|---|
| データベース操作 | illuminate/database（Laravel） |
| テンプレートエンジン | twig/twig |
| バリデーション | cakephp/validation（CakePHP） |
| DIコンテナ | symfony/dependency-injection（Symfony） |
以上のパッケージをSlimに導入するのに、少し労力が必要になりますが、可能です。
これは、Slim4がPSRやフレームワークで定義されているインタフェースに依存しているので、インタフェースを実装したものをDIコンテナ経由で注入してやれば、機能の入れ替えが出来るためです。
あなたも、Slim4と言う白いキャンバスに、色を塗っていく楽しさを是非！
成果物
とりあえず、以下は成果物のリポジトリとなります。
そして、成果物のサンプルブログサイトは、とりあえずrender.comにデプロイしました。
プロジェクトの作成
まず、Slim4のプロジェクトを作成していきます。
Slim4のプロジェクトを作るには、slim-skeletonを利用してcomposerでプロジェクトを作成するのが一般的です。
slim-skeletonは、以下の2つを利用できます。
odanさんのスケルトンプロジェクトは、色々な実装が揃った状態で開発を始めることができるのでオススメです。
composerをインストールして、以下のようにコマンドを実行すると、プロジェクトを作成できます。
composer create-project odan/slim4-skeleton [project-name]
ただ、今回はスケルトンは利用しません。
スケルトンは非常に便利なのですが、設定ファイルなどが多かったりするので、お手軽に利用するにはちょっと厳しかったりします。
Chubbyを利用する
スケルトンの利用も割と大変だったりするので、今回は、私が最近作成したChubbyと言うSlim4 + PHP-DI + nyholm/psr7 などをラップしたパッケージを利用します。
Chubbyは、基本的なアプリケーションの構築処理の実装や、DIコンテナの依存関係の設定をゴチャゴチャやらなくても、Slim4を実行できるお手軽パッケージとなっております。
パッケージの導入方法
以下の導入方法を試すには、composerとPHP8.2以上がインストールされている必要があります。
- 以下のよう
なcomposer.jsonを作成してcomposer installを実行する（composer.jsonはcomposer initでの作成でもOK）
{
"require": {
"php": "^8.2"
}
}
- composerでChubbyを追加します。
composer require takemo101/chubby
-
index.phpを作成して、以下のコードを追加します。
<?php
// index.php
use Psr\Http\Message\ResponseInterface;
use Takemo101\Chubby\Http;
require __DIR__ . '/vendor/autoload.php';
$http = Http::createSimple();
$http->get('/', function (ResponseInterface $response) {
$response->getBody()
->write('<h1>Hello World</h1>');
return $response;
});
$http->run();
- PHPのビルトインサーバーを起動します（php8.2以上必須）
php -S localhost:8080 index.php
- 最後に
http://localhost:8080にアクセスして「Hello World」が表示されていれば成功！
実際に./index.phpをプロジェクトのルートに置くと、サーバーでドキュメントルートを設定するときに困るので
./public/index.phpにファイルを移動して開発を進めていきます。
microCMSのセットアップ
- 今回は、microCMSを利用してブログサイトを作るので、まず、microCMSのアカウントを作成してください。
- アカウントを作成したら、以下マニュアルを参考にサービスを作成してください（サービスに設定したサービスIDは、あとで使うのでメモして下さい）
- サービスを作成したら、次にApiを作成するのですが「ブログ」を選択して作成してください（自動的にブログのスキーマが作成されます）
- Apiを作成したら、あとはブログ記事を作成してもらえればOK。
- 最後に、PHPでApiを利用するために、Api管理ページからApiキーをコピペでメモしてください。
以上で、実装の準備が整いました。
実装開始
プロジェクトを作成して、microCMSのサービスも作成したので、次はいよいよ実装開始です！
実装内容としては、PHPからmicroCMSのApiにアクセスしてブログデータを取得して、取得したデータをテンプレートで表示だけになります。
PHPでの実装は、シンプルかつサクッと実装するために、全てindex.phpファイルに記述します。
追加のパッケージインストール
microCMSのApiへのアクセスや、テンプレートのレンダリングで必要になる、以下パッケージを追加でインストールします。
| 対象 | パッケージ |
|---|---|
| Apiアクセス | microcmsio/microcms-php-sdk（公式提供のSDK） |
| テンプレートエンジン | latte/latte（Latteという高機能なテンプレートエンジン） |
以下コマンドを実行してインストールします。
composer require microcmsio/microcms-php-sdk latte/latte
.envの作成
Chubbyには.envから環境変数を取得する機能があるので、プロジェクトのルートに.envファイルを作成して、microCMSのセットアップの時にメモしたサービスIDとApiキーを設定します。
### microCMSのApiアクセス設定 ###
MICROCMS_SERVICE_DOMAIN=サービスID
MICROCMS_API_KEY=Apiキー
とりあえず必要なクラスをインポート
とりあえず、./public/index.phpに今回の実装で必要なクラスをインポートします。
index.phpがpublicディレクトリに移動したことで、composerのautoload.phpの読み込みパスが変わったので注意です。
テンプレートレンダリングのサポートクラス作成
Latteでテンプレートレンダリングするのに、Latteクラスをそのまま使うのは中々面倒なので、サポートクラスを追加します。
Latteのドキュメントページでも、似たような使い方がオススメされています。
プロバイダーで依存関係を設定
Chubbyでは、PHP-DIをサポートしており、アプリケーションの起動前に、依存関係を設定する仕組みが用意されています。
それが、プロバイダーです（LaravelのServiceProviderみたいなもんです）
以下のコードでは、ClosureProviderに渡したクロージャの戻り値で、Latteテンプレートエンジンと、microCMS SDKの依存関係を連想配列で設定しています（PHP-DIでは連想配列で依存関係のマッピングをするのがオーソドックスなやり方となっています）
この設定をすると、PHP-DIのAutoWiringと言う仕組みで、自動的にクラスのコンストラクタなどに依存注入されるようになります（すごく便利です）
上記のコードを見た通り、Chubbyには色々なヘルパが用意されており、前述で.envに設定した環境変数も、envヘルパ関数で取得して、microCMSのSDKに設定しています。
プロバイダーについては、Chubby独自の仕組みなので、ちょっと分かりにくいですが、Chubby経由でPHP-DIの設定をしているものだと思っていただけたらと思います。
ルーティング設定
前準備は全て整ったので、ブログページを表示するための、ルーティング設定をしていきます。
Slim4でのルーティングの仕方については、以下を参照してください。
トップページ
まず、getメソッドに渡しているクロージャの引数でMicroCMSClientやLatteRendererのインスタンスが取得できているのは、前述のPHP-DIのAutoWiringのおかげです。
処理内容としては、MicroCMSClientのlistメソッドでブログ記事のリストを取得しています。
データは、stdClassのオブジェクトとして取得できるので、$list->contentsのような感じで参照することができます。
ただし、参照できるプロパティについては、microCMSのApiを確認してもらった方がいいです。
microCMSの管理画面から「Apiプレビュー」という機能があるので、それでApiから取得できる以下画像のようなJsonデータを確認できます。
続けて、取得したブログの記事リストデータを、先ほど作成したLatteRendererのtemplateメソッドで、テンプレートパスと共に設定すると、レンダリングされたレスポンスデータとして返すことができます。
カテゴリページ
引き続き、カテゴリごとのブログ記事一覧ページも作成します。
注目したいのは、getメソッドに渡している引数で、ルーティングパラメータであるidを取得できている部分で、これも、PHP-DIでパラメータを注入している処理があるおかげで$idと言う引数を設定することで、取得できています。
このような、好みに応じてパラメータの注入方法をカスタマイズできるのも、Slim４の面白いところだと思います。
処理内容としては、MicroCMSClientのgetメソッドでルーティングパラメータのidからカテゴリデータを取得して、取得できなければ404の例外としてスローして、取得できていればカテゴリのブログ記事一覧を取得します。
あと、カテゴリのブログ記事を取得する場合に、microCMSのApiにはfiltersと言うパラメータを渡すことで記事を絞ることができるので、その設定をして取得します。
詳細/下書きページ
ブログ記事詳細ページも作成するのですが、ついでに下書きページも作成します。
下書きページは、microCMSで下書き中の記事をプレビューできる仕組みがあるので、そのためのページとなります。
データを取得するときにdraftKeyを付与すると、下書き中のブログ記事のデータを取得できます。
テンプレートには、ブログ記事データの他に、下書き中の記事かどうか？のフラグ$isDraftも渡すことで、詳細ページを表示分けをしています。
画面プレビューのURLを作成する方法については、以下を参照してください。
ミドルウェアでカテゴリ一覧を取得
全てのページ共通で、メニューにカテゴリ一覧を表示する必要があるので、ミドルウェアの中で取得するようにします。
Slim4のミドルウェアの仕組みについては、以下を参照してください。
完成
これで、全ての設定が完了したので、$http->run();によってSlimを起動すれば、ブログページの出来上がりです！
最後に、以下コマンドでPHPのビルトインサーバーを起動して、http://localhost:8080にアクセスしてブログページの表示を確認してみてください。
php -S localhost:8080 -t public
完成品のサイトパフォーマンスについては、Apiのキャッシュなどを組み合わせることで上げることも可能かと思います。
最後に
今回、Chubbyを使うことで実装の楽をしましたが、Slim4単体で実装しても、PHPの実装に関してはindex.phpだけでサクッとまとめることができたと思います。
最近だとLaravelなどのフルスタックフレームワークを使うことが多くなっているのですが、最初から全てが用意されているので、それはそれでとても楽だとは思います。
ただ、Slim4のようなマイクロフレームワークを利用することで、最小限だからこそアプリケーションに関する理解が深まったり、組み合わせを考える楽しさみたいなものが味わえたりします（結構骨が折れますが）
PHPerの方で、フルスタックフレームワークに疲れた方は、一度Slimを試してみては？
ちなみに
Chubby自体は最近趣味で作ったものであり、開発段階のものなのですが、スケルトンを作成できるパッケージもあるので、興味があればぜひご利用ください。
Discussion