«Если рабочий хочет хорошо выполнять свою работу, он должен сначала заточить свои инструменты» — Конфуций, «Аналитики Конфуция. Лу Лингун»
титульная страница > программирование > Создание надежных панелей администратора с помощью Filament и Laravel: пошаговое руководство

Создание надежных панелей администратора с помощью Filament и Laravel: пошаговое руководство

Опубликовано 8 ноября 2024 г.
Просматривать:827

Building Robust Admin Panels with Filament and Laravel: A Step-by-Step Guide

Laravel — это мощный PHP-фреймворк, обеспечивающий прочную основу для разработки веб-приложений. Filament — это элегантная панель администратора с открытым исходным кодом и конструктор форм для Laravel, который упрощает создание интерфейсов администратора. Это руководство поможет вам создать надежную панель администратора с использованием последних версий Filament и Laravel.

Laravel SaaS Starter — запустите следующий Saas за день, а не за неделю
Начните свой следующий проект Laravel Saas всего за день, а не за неделю! Имея уже встроенные функции, необходимые каждому Saas
www.laravelsaas.store

Предварительные требования
Прежде чем мы начнем, убедитесь, что на вашей машине разработки установлено следующее:

PHP >= 8.0
Композитор
Node.js и NPM
MySQL или любая другая база данных, поддерживаемая Laravel

Шаг 1. Настройка нового проекта Laravel

Сначала создайте новый проект Laravel с помощью Composer:

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' => '[email protected]']);

Шаг 4. Настройка нити

Обновите модель пользователя, чтобы реализовать контракт 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, [
            '[email protected]',
        ]);
    });
}

Шаг 5. Создание ресурсов

Ресурсы Filament — это модели Eloquent с CRUD-интерфейсами. Давайте создадим ресурс для управления моделью 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 Starter — запустите следующий Saas за день, а не за неделю
Начните свой следующий проект Laravel Saas всего за день, а не за неделю! Имея уже встроенные функции, необходимые каждому Saas
www.laravelsaas.store

Заключение

В этом руководстве мы рассмотрели настройку нового проекта Laravel, установку Filament, настройку аутентификации, создание ресурсов и настройку панели администратора Filament. Это должно дать вам прочную основу для создания надежных панелей администратора с использованием Filament и Laravel. Для получения более расширенных функций и настроек обратитесь к официальной документации и изучите возможности Filament.

Удачного программирования!

Заявление о выпуске Эта статья воспроизведена по адресу: https://dev.to/martintonev/building-robust-admin-panels-with-filament-and-laravel-a-step-by-step-guide-2pn3?1 Если есть какие-либо нарушения , пожалуйста, свяжитесь с Study_golang @163.comdelete
Последний учебник Более>

Изучайте китайский

Отказ от ответственности: Все предоставленные ресурсы частично взяты из Интернета. В случае нарушения ваших авторских прав или других прав и интересов, пожалуйста, объясните подробные причины и предоставьте доказательства авторских прав или прав и интересов, а затем отправьте их по электронной почте: [email protected]. Мы сделаем это за вас как можно скорее.

Copyright© 2022 湘ICP备2022001581号-3