Filament : le framework UI pour Laravel

Filament est un puissant framework UI open source pour Laravel, construit avec Livewire afin de vous aider à développer rapidement des panneaux d’administration et des applications.

Larafrique
29/08/2025
Filament : le framework UI pour Laravel

Introduction

Laravel est connu pour sa simplicité et sa productivité. Mais lorsqu’il s’agit de mettre en place rapidement des panneaux d’administration, des formulaires complexes ou des dashboards élégants, le temps de développement peut vite s’allonger. C’est là qu’intervient Filament, un framework UI open source construit avec Livewire et Alpine.js, pensé pour accélérer la création d’applications et d’interfaces d’administration modernes dans Laravel.

Pourquoi utiliser Filament ?

  • Productivité : générez des panneaux d’administration complets en quelques commandes.
  • Extensible : personnalisez chaque partie (formulaires, tables, navigation, etc.).
  • Moderne : basé sur Livewire et Tailwind CSS.
  • Communauté active : plugins, documentation riche et mises à jour fréquentes.

Installation rapide

Avant tout, assurez-vous d’avoir une application Laravel fonctionnelle. Installez Filament avec Composer :

Prérequis

Filament nécessite les éléments suivants pour fonctionner :

  • PHP 8.2+
  • Laravel v11.28+
  • Tailwind CSS v4.0+

L’installation se présente sous deux formes, selon que vous souhaitez :

  • construire une application à l’aide de notre générateur de panneaux (panel builder),
  • ou utiliser les composants directement dans les vues Blade de votre application.

Installer le Panel Builder

1composer require filament/filament:"^4.0"
2 
3php artisan filament:install --panels

⚠️ Pour Windows PowerShell, vous devrez exécuter la commande ci-dessous, car il ignore les caractères ^ dans les contraintes de version :

1composer require filament/filament:"~4.0"
2 
3php artisan filament:install --panels

Cela va créer et enregistrer un nouveau service provider Laravel nommé app/Providers/Filament/AdminPanelProvider.php.

Vous pouvez créer un nouveau compte utilisateur en utilisant la commande suivante

1php artisan make:filament-user

Installer les composants individuellement

Installez les composants Filament que vous souhaitez utiliser avec Composer :

1composer require
2    filament/tables:"^4.0"
3    filament/schemas:"^4.0"
4    filament/forms:"^4.0"
5    filament/infolists:"^4.0"
6    filament/actions:"^4.0"
7    filament/notifications:"^4.0"
8    filament/widgets:"^4.0"

Exécutez la commande suivante pour installer les assets frontend de Filament :

1php artisan filament:install --scaffold
2npm install
3npm run dev

Les composants principaux

Table

Les tables sont un modèle d’interface utilisateur courant pour afficher des listes d’enregistrements dans les applications web. Filament fournit une API PHP pour définir des tables avec de nombreuses fonctionnalités, tout en restant extrêmement personnalisable.

 1use Filament\Tables\Columns\IconColumn;
 2use Filament\Tables\Columns\TextColumn;
 3use Filament\Tables\Table;
 4 
 5public function table(Table $table): Table
 6{
 7    return $table
 8        ->columns([
 9            TextColumn::make('title'),
10            TextColumn::make('slug'),
11            IconColumn::make('is_featured')
12                ->boolean(),
13        ]);
14}
livewire-search-result

Formulaire

Le package Forms de Filament vous permet de créer facilement des formulaires dynamiques dans votre application. Il est utilisé dans d’autres packages Filament pour afficher des formulaires dans les ressources du panneau, les modales d’action, les filtres de tables, et plus encore.

livewire-search-result

Les champs disponibles sont les suivants :

  • Text input
  • Select
  • Checkbox
  • Toggle
  • Checkbox list
  • Radio
  • Date-time picker
  • File upload
  • Rich editor
  • Markdown editor
  • Repeater
  • Builder
  • Tags input
  • Textarea
  • Key-value
  • Color picker
  • Toggle buttons
  • Slider
  • Code editor
  • Hidden

Infolists

Le package Infolists de Filament vous permet d’afficher une liste de données en lecture seule pour une entité spécifique. Il est intégré à d’autres packages Filament, par exemple dans les ressources de panneau, les relation managers ou les modales d’action.

livewire-search-result

Les entrées disponibles :

  • Text entry
  • Icon entry
  • Image entry
  • Color entry
  • Code entry
  • Key-value entry
  • Repeatable entry

Widgets

Filament vous permet de créer des tableaux de bord dynamiques, composés de « widgets ». Chaque widget est un élément du tableau de bord qui affiche des données de manière spécifique. Par exemple, vous pouvez afficher des statistiques, des graphiques ou une table.

 1namespace App\Filament\Widgets;
 2 
 3use Filament\Widgets\ChartWidget;
 4 
 5class BlogPostsChart extends ChartWidget
 6{
 7    protected ?string $heading = 'Blog Posts';
 8 
 9    protected function getData(): array
10    {
11        return [
12            'datasets' => [
13                [
14                    'label' => 'Blog posts created',
15                    'data' => [0, 10, 5, 2, 21, 32, 45, 74, 65, 45, 77, 89],
16                ],
17            ],
18            'labels' => ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
19        ];
20    }
21 
22    protected function getType(): string
23    {
24        return 'line';
25    }
26}
livewire-search-result

En savoir plus

Pour aller plus loin avec Filament, voici quelques ressources utiles :

Sommaire