Laravel Filament Admin Panel Package Tutorial

This video tutorial will show you how to install and use the Laravel filament admin panel. We are going to create a Post model and migrations, and also create filament resources for the post. Laravel Filament admin panel is a TALL (Tailwind, Alpinejs, Laravel, Livewire) package.

Steps for Laravel Filament Admin Panel

Learn more about Laravel Livewire.

1 Create Laravel Project

First, we need to create a Laravel project. Here I’m using the Laravel installer and Laravel valet.

laravel new filament-test

and is creating a project on the filament-test directory.

Master Laravel with full free courses at laraveller.

2 Create Models and Migrations

In this step, we need to create models and migrations to work with filament resources. So we are going to create a Post model and migration.

php artisan make:model Post -m

Now we have the post model and posts migration let’s add the title and description to the posts table.

 Schema::create('posts', function (Blueprint $table) {
            $table->id();
            $table->string('title');
            $table->text('body');
            $table->timestamps();
        });

3 Install Filament

Here we are going to install filament and create the user.

composer require filament/filament:"^2.0"

php artisan make:filament-user

4 Create Filament Resources

We need to create a Filament resource for posts. and after we need to modify the resource form and table method.

php artisan make:filament-resource Post

PostResource.php

<?php

namespace App\Filament\Resources;

use App\Filament\Resources\PostResource\Pages;
use App\Filament\Resources\PostResource\RelationManagers;
use App\Models\Post;
use Filament\Forms;
use Filament\Forms\Components\Card;
use Filament\Resources\Form;
use Filament\Resources\Resource;
use Filament\Resources\Table;
use Filament\Tables;

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(
                Card::make()->columns(1)->schema([
                    Forms\Components\TextInput::make('title')->required(),
                    Forms\Components\RichEditor::make('body')->required(),
                ])
            );
    }

    public static function table(Table $table): Table
    {
        return $table
            ->columns([
                Tables\Columns\TextColumn::make('title'),
                Tables\Columns\TextColumn::make('body')->html(),
            ])
            ->filters([
                //
            ]);
    }

    public static function getRelations(): array
    {
        return [
            //
        ];
    }

    public static function getPages(): array
    {
        return [
            'index' => Pages\ListPosts::route('/'),
            'create' => Pages\CreatePost::route('/create'),
            'edit' => Pages\EditPost::route('/{record}/edit'),
        ];
    }
}

That’s it now we have our first Laravel Filament Resource, so we can create edit, and delete posts.

Admin Panel

Post Resource

Post Form

Watch the video tutorial.