💁♂️ はじめに
株式会社EGSTOCKの日下繕章です
爆速開発を行うにあたり、Laravel用の管理画面パッケージを検討してた所、Filamentがイケてるということなので検証がてら環境構築し動かしてみた
公式サイト：https://filamentphp.com/
ドキュメント：https://filamentphp.com/docs/2.x/admin/installation
デモ：https://demo.filamentphp.com/login
GitHub：https://github.com/filamentphp/filament
🎯 filamentphpの特徴
- 純粋なLivewireコンポーネントで構成されたシンプルな基盤
- Alpine.jsに大きく依存した強力なフォームとテーブルビルダーを搭載
- UIは Tailwind CSS v2を使用して構築されている
- テーブルメタデータからの自動生成機能がある
- 執筆時点(2022/12)でも活発に更新が行われている
- MITライセンスである
🔧 準備
爆速で作りたいので既存テーブルのメタデータから画面を自動生成するところまで準備してみる
検証環境
php8.0
Laravel9
MySQL8.0
Nginx1.20
※前提としてLaravelが動作する状態であること
1) インストール
composer require filament/filament:"^2.0"
2) 管理画面ユーザ作成
php artisan make:filament-user
Name:
> [ユーザ名]
Email address:
> [メールアドレス]
Password:
> [パスワード]
Success! [メールアドレス] may now log in at http://localhost/admin/login.
Would you like to show some love by starring the repo? (yes/no) [yes]:
> [任意] // yesでhttps://github.com/filamentphp/filamentページがopen
※ちなみに作成した管理画面ユーザはUsersテーブルに格納される模様
これだけで下記URLで管理画面にアクセスできるようになっているので、作成した管理画面ユーザでログイン
ダッシュボード画面にログインできるようになってますが、何もまっさらの状態なので引き続き画面も追加していく
3) doctrine/dbalパッケージインストール
既存テーブルのメタデータから画面を生成するために必要らしいのでインストール
composer require doctrine/dbal --dev
4) 画面生成
既に存在するUsersテーブルから画面を生成してみる
php artisan make:filament-resource User --generate
Usersテーブルがメニューに追加され、一覧と編集画面からレコード操作が可能になっている
その他設定
設定ファイル公開
設定ファイルは公開しておくと後々良い
php artisan vendor:publish --tag=filament-config
php artisan vendor:publish --tag=forms-config
php artisan vendor:publish --tag=tables-config
日本語化
英語のままだったりするので設定を調整する
多言語設定をlang以下に展開
php artisan vendor:publish --tag=filament-translations
config/app.phpのlocaleを日本語設定に変更
'locale' => 'ja',
以上で画面が日本語化された状態で表示される
日付フォーマット変更
デフォルトだとFormとTableの日付が下記のような(M j, Y H:i:s)フォーマットで表示されてしまうので調整
Table Builderの日付フォーマットを変更
- 'date_format' => 'M j, Y',
- 'date_time_format' => 'M j, Y H:i:s',
+ 'date_format' => 'Y年m月d日',
+ 'date_time_format' => 'Y年m月d日 H:i:s',
'time_format' => 'H:i:s',
Form Builderの日付フォーマットを変更
'date_time_picker' => [
'first_day_of_week' => 1, // 0 to 7 are accepted values, with Monday as 1 and Sunday as 7 or 0.
'display_formats' => [
- 'date' => 'M j, Y',
- 'date_time' => 'M j, Y H:i',
- 'date_time_with_seconds' => 'M j, Y H:i:s',
+ 'date' => 'Y年m月d日',
+ 'date_time' => 'Y年m月d日 H:i',
+ 'date_time_with_seconds' => 'Y年m月d日 H:i:s',
'time' => 'H:i',
'time_with_seconds' => 'H:i:s',
],
],
管理画面ユーザにアクセス権限を追加
管理画面の新規カスタマイズページ
管理画面の部分カスタマイズ
感想
既存のLaravel動作環境に対して30分も掛からず管理画面の基盤を設置し日本語化設定を済ませた状態で動作させることができた
執筆時点では日本語情報が乏しいが、設定もシンプルで直感的に理解しやすいものが多い印象
Discussion