Laravel は、Web アプリケーション開発のための強固な基盤を提供する強力な PHP フレームワークです。 Filament は、管理インターフェイスの作成を簡素化する、Laravel 用のオープンソースのエレガントな管理パネルおよびフォーム ビルダーです。このガイドでは、Filament と Laravel の最新バージョンを使用して堅牢な管理パネルを構築する手順を説明します。
Laravel SaaS スターター - 数週間ではなく 1 日で次の SaaS を開始します
次の Laravel Saas プロジェクトを数週間ではなく、わずか 1 日で開始しましょう。すべての Saas が必要とする機能がすでに構築されています
www.laravelsaas.store
前提条件
始める前に、開発マシンに以下がインストールされていることを確認してください:
PHP >= 8.0
作曲家
Node.js と NPM
MySQL または Laravel でサポートされているその他のデータベース
ステップ 1: 新しい Laravel プロジェクトをセットアップする
まず、Composer を使用して新しい Laravel プロジェクトを作成します。
composer create-project --prefer-dist laravel/laravel filament-admin cd filament-admin
次に、環境変数を設定します。 .env.example ファイルの名前を .env に変更し、資格情報を使用してデータベース構成を更新します。
DB_CONNECTION=mysql DB_HOST=127.0.0.1 DB_PORT=3306 DB_DATABASE=filament_db DB_USERNAME=root DB_PASSWORD=your_password
次のコマンドを実行してアプリケーション キーを生成し、デフォルトの Laravel テーブルを移行します。
php artisan key:generate php artisan migrate
ステップ 2: フィラメントの取り付け
Filament をインストールするには、Composer を使用します:
composer require filament/filament
次に、Filament アセットと構成を公開します。
php artisan filament:install
ステップ 3: 認証の設定
Filament では、管理パネルへのアクセスを管理するために認証が必要です。 Laravel は組み込みの認証スキャフォールディングを提供します。簡単にするために Laravel Breeze を使用してみましょう:
composer require laravel/breeze --dev php artisan breeze:install
プロンプトに従って、好みのフロントエンド オプション (Blade、Vue、React) を選択します。この例では、Blade:
を使用します。
php artisan migrate npm install npm run dev
ログインに使用するユーザーがいることを確認してください。 Laravel Tinker を使用して作成できます:
php artisan tinker >>> \App\Models\User::factory()->create(['email' => 'admin@example.com']);
ステップ 4: フィラメントの構成
ロールまたは権限を使用している場合は、User モデルを更新して Filament HasFilamentRoles コントラクトを実装します。現時点では、認証されたユーザーが確実に Filament にアクセスできるようにします。
In app/Providers/FilamentServiceProvider.php, define the authorization logic: use Filament\Facades\Filament; public function boot() { Filament::serving(function () { Filament::registerUserMenuItems([ 'account' => MenuItem::make() ->label('My Account') ->url(route('filament.resources.users.edit', ['record' => auth()->user()])) ->icon('heroicon-o-user'), ]); }); Filament::registerPages([ // Register your custom pages here ]); Filament::registerResources([ // Register your custom resources here ]); } protected function gate() { Gate::define('viewFilament', function ($user) { return in_array($user->email, [ 'admin@example.com', ]); }); }
ステップ 5: リソースの作成
フィラメント リソースは、CRUD インターフェイスを備えた Eloquent モデルです。 Post モデルを管理するためのリソースを作成しましょう。
モデル、移行、およびファクトリーを生成します:
php artisan make:model Post -mf
移行ファイル内のフィールドを定義します:
public function up() { Schema::create('posts', function (Blueprint $table) { $table->id(); $table->string('title'); $table->text('content'); $table->timestamps(); }); }
移行を実行します:
php artisan migrate
次に、Filament リソースを生成します。
php artisan make:filament-resource Post
このコマンドは、リソースに必要なファイルを作成します。 app/Filament/Resources/PostResource.php を開き、リソース フィールドを定義します。
use Filament\Resources\Pages\Page; use Filament\Resources\Pages\CreateRecord; use Filament\Resources\Pages\EditRecord; use Filament\Resources\Pages\ListRecords; use Filament\Resources\Forms; use Filament\Resources\Tables; use Filament\Resources\Forms\Components\TextInput; use Filament\Resources\Forms\Components\Textarea; use Filament\Resources\Tables\Columns\TextColumn; class PostResource extends Resource { protected static ?string $model = Post::class; protected static ?string $navigationIcon = 'heroicon-o-collection'; public static function form(Form $form): Form { return $form ->schema([ TextInput::make('title') ->required() ->maxLength(255), Textarea::make('content') ->required(), ]); } public static function table(Table $table): Table { return $table ->columns([ TextColumn::make('title'), TextColumn::make('content') ->limit(50), TextColumn::make('created_at') ->dateTime(), ]); } public static function getPages(): array { return [ 'index' => Pages\ListRecords::route('/'), 'create' => Pages\CreateRecord::route('/create'), 'edit' => Pages\EditRecord::route('/{record}/edit'), ]; } }
ステップ 6: ナビゲーションを追加する
リソースを Filament サイドバーに追加します。 app/Providers/FilamentServiceProvider.php を開き、リソースを登録します:
use App\Filament\Resources\PostResource; public function register() { Filament::registerResources([ PostResource::class, ]); }
ステップ 7: フィラメントのカスタマイズ
フィラメントは高度にカスタマイズ可能です。テーマやコンポーネントなどを変更できます。たとえば、原色をカスタマイズするには、config/filament.php ファイルを更新します。
'brand' => [ 'primary' => '#1d4ed8', ],
ドキュメントに従ってカスタム ページ、ウィジェット、フォーム コンポーネントを作成することもできます: Filament Documentation。
Laravel SaaS スターター - 数週間ではなく 1 日で次の SaaS を開始します
次の Laravel Saas プロジェクトを数週間ではなく、わずか 1 日で開始しましょう。すべての Saas が必要とする機能がすでに構築されています
www.laravelsaas.store
結論
このガイドでは、新しい Laravel プロジェクトのセットアップ、Filament のインストール、認証のセットアップ、リソースの作成、Filament 管理パネルのカスタマイズについて説明しました。これにより、Filament と Laravel を使用して堅牢な管理パネルを構築するための強固な基盤が得られます。より高度な機能とカスタマイズについては、公式ドキュメントを参照して、Filament の機能を調べてください。
コーディングを楽しんでください!
以上がFilament と Laravel を使用した堅牢な管理パネルの構築: ステップバイステップガイドの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。