Building Admin Panels Fast with Filament and Livewire
Filament is a powerful open-source UI framework for Laravel that helps software engineers build and ship admin panels and applications quickly. It's built on top of Livewire, a full-stack framework for Laravel that makes building dynamic interfaces simple, and it provides a comprehensive set of pre-built components and tools.
Filament dramatically speeds up development by providing a complete, ready-to-use solution for common backend tasks. Instead of spending time on boilerplate code for forms, tables, and dashboards, you can focus on the unique business logic of your application. Here's a breakdown of its key benefits
Rapid Admin Panel Creation
You can generate a full-featured admin panel for any Eloquent model with just a few commands. This includes pages for listing, viewing, creating, editing, and deleting records.
Intuitive UI
The framework offers a clean, modern, and highly customizable user interface out of the box. This not only improves the developer experience but also provides a great experience for end-users.
Livewire Integration
Because it's built on Livewire, you get the benefit of dynamic, reactive UIs without writing a single line of JavaScript. This simplifies development and reduces the complexity of managing frontend and backend codebases.
Extensibility
Filament is designed to be highly extensible. You can create your own custom components, themes, and plugins to fit your specific needs, and it integrates seamlessly with other Laravel packages.
Built-in Features
It comes packed with features like authentication, authorization (with roles and permissions), notifications, and a form builder, all of which are essential for most applications.
Getting started with Filament is straightforward. The following steps will guide you through the process.
You can install Filament via Composer. Run this command in your Laravel project's root directory
composer require filament/filament
Next, you'll need to publish the necessary assets and create a user that can access the admin panel.
php artisan filament:install
This command will prompt you to create a new user. Follow the instructions to set up your first admin user.
Once the installation is complete, you can access your new admin panel by visiting /admin in your browser. Log in with the user credentials you just created.
Let's walk through a simple example of how to create a "Post" resource. This will automatically generate a full-featured interface for managing blog posts.
Use the make:filament-resource Artisan command to generate the necessary files.
php artisan make:filament-resource Post
This command creates a PostResource class, which will be the core of your resource.
Inside the app/Filament/Resources/PostResource.php file, you'll find methods like form and table. These are where you define the form fields and table columns for your resource.
Here’s an example of how you might define a form for a Post model
// app/Filament/Resources/PostResource.php
public static function form(Form $form): Form
{
return $form
->schema([
Forms\Components\TextInput::make('title')
->required()
->maxLength(255),
Forms\Components\RichEditor::make('body')
->required(),
Forms\Components\Select::make('category_id')
->relationship('category', 'name')
->searchable()
->preload(),
Forms\Components\Toggle::make('is_published'),
]);
}
This code snippet defines a form with a text input for the title, a rich editor for the body, a select dropdown for the category, and a toggle for the is_published status.
Similarly, you can define the columns for the table view
// app/Filament/Resources/PostResource.php
public static function table(Table $table): Table
{
return $table
->columns([
Tables\Columns\TextColumn::make('title')->searchable(),
Tables\Columns\TextColumn::make('category.name'),
Tables\Columns\IconColumn::make('is_published')
->boolean(),
Tables\Columns\TextColumn::make('created_at')
->dateTime(),
])
->filters([
// ...
]);
}
This creates a table with columns for the title, the category's name (via a relationship), a boolean icon for the is_published status, and the creation date.