Laravel é um poderoso framework PHP que fornece uma base sólida para o desenvolvimento de aplicações web. Filament é um painel de administração elegante e de código aberto e construtor de formulários para Laravel que simplifica a criação de interfaces de administração. Este guia irá orientá-lo na construção de um painel de administração robusto usando as versões mais recentes do Filament e Laravel.

Laravel SaaS Starter - Comece seu próximo Saas em um dia, não em semanas
Comece seu próximo projeto Laravel Saas em apenas um dia, não em semanas! Com recursos já construídos que todo saas precisa
www.laravelsaas.store

Pré-requisitos
Antes de começarmos, certifique-se de ter o seguinte instalado em sua máquina de desenvolvimento:

PHP >= 8,0
Compositor
Node.js e NPM
MySQL ou qualquer outro banco de dados suportado pelo Laravel

Etapa 1: Configurando um novo projeto Laravel

Primeiro, crie um novo projeto Laravel usando o Composer:

composer create-project --prefer-dist laravel/laravel filament-admin
cd filament-admin

Em seguida, configure suas variáveis ​​de ambiente. Renomeie o arquivo .env.example para .env e atualize a configuração do banco de dados com suas credenciais:

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=filament_db
DB_USERNAME=root
DB_PASSWORD=your_password

Execute o seguinte comando para gerar uma chave de aplicação e migrar as tabelas padrão do Laravel:

php artisan key:generate
php artisan migrate

Etapa 2: instalação do filamento

Para instalar o Filament, use o Composer:

composer require filament/filament

Em seguida, publique os ativos e a configuração do Filament:

php artisan filament:install

Etapa 3: configurando a autenticação

Filament requer autenticação para gerenciar o acesso ao painel de administração. Laravel fornece scaffolding de autenticação integrado. Vamos usar o Laravel Breeze para simplificar:

composer require laravel/breeze --dev
php artisan breeze:install

Siga as instruções para selecionar sua opção de frontend preferida (Blade, Vue, React). Para este exemplo, usaremos Blade:

php artisan migrate
npm install
npm run dev

Certifique-se de ter um usuário para fazer login. Você pode usar o Laravel Tinker para criar um:

php artisan tinker

>>> \App\Models\User::factory()->create(['email' => '[email protected]']);

Etapa 4: Configurando o filamento

Atualize o modelo User para implementar o contrato Filament HasFilamentRoles se você estiver usando funções ou permissões. Por enquanto, garantiremos que qualquer usuário autenticado possa acessar o 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, [
            '[email protected]',
        ]);
    });
}

Etapa 5: Criação de recursos

Os recursos Filament são modelos Eloquent com interfaces CRUD. Vamos criar um recurso para gerenciar um modelo Post.

Gere o modelo, a migração e a fábrica:

php artisan make:model Post -mf

Defina os campos no arquivo de migração:

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

Execute a migração:

php artisan migrate

Em seguida, gere um recurso Filament:

php artisan make:filament-resource Post

Este comando cria os arquivos necessários para o recurso. Abra app/Filament/Resources/PostResource.php e defina os campos de recursos:

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'),
        ];
    }
}

Etapa 6: Adicionar navegação

Adicione o recurso à barra lateral do Filament. Abra app/Providers/FilamentServiceProvider.php e registre o recurso:

use App\Filament\Resources\PostResource;

public function register()
{
    Filament::registerResources([
        PostResource::class,
    ]);
}

Etapa 7: Personalização do filamento

Filament é altamente personalizável. Você pode alterar o tema, os componentes e muito mais. Por exemplo, para personalizar a cor primária, atualize o arquivo config/filament.php:

'brand' => [
    'primary' => '#1d4ed8',
],

Você também pode criar páginas personalizadas, widgets e componentes de formulário seguindo a documentação: Filament Documentation.

Laravel SaaS Starter - Comece seu próximo Saas em um dia, não em semanas
Comece seu próximo projeto Laravel Saas em apenas um dia, não em semanas! Com recursos já construídos que todo saas precisa
www.laravelsaas.store

Conclusão

Neste guia, explicamos como configurar um novo projeto Laravel, instalar o Filament, configurar a autenticação, criar recursos e personalizar o painel de administração do Filament. Isso deve fornecer uma base sólida para a construção de painéis de administração robustos usando Filament e Laravel. Para recursos e personalizações mais avançadas, consulte a documentação oficial e explore os recursos do Filament.

Boa codificação!