”工欲善其事,必先利其器。“—孔子《论语.录灵公》
首页 > 编程 > 使用 Filament 和 Laravel 构建强大的管理面板:分步指南

使用 Filament 和 Laravel 构建强大的管理面板:分步指南

发布于2024-11-08
浏览:149

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

Laravel 是一个强大的 PHP 框架,为开发 Web 应用程序提供了坚实的基础。 Filament 是一个开源、优雅的 Laravel 管理面板和表单构建器,可简化管理界面的创建。本指南将引导您使用最新版本的 Filament 和 Laravel 构建强大的管理面板。

Laravel SaaS Starter - 在一天而不是几周内启动您的下一个 Saas
只需一天而不是几周即可启动您的下一个 Laravel Saas 项目!凭借已构建的功能,每个 SaaS 都需要
www.laravelsaas.store

先决条件
在开始之前,请确保您的开发计算机上安装了以下软件:

PHP >= 8.0
作曲家
Node.js 和 NPM
MySQL 或 Laravel 支持的任何其他数据库

第 1 步:设置新的 Laravel 项目

首先,使用Composer创建一个新的Laravel项目:

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 资源是具有 CRUD 接口的 Eloquent 模型。让我们创建一个用于管理 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 文档。

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如有侵犯,请联系[email protected]删除
最新教程 更多>
  • 如何同步迭代并从PHP中的两个等级阵列打印值?
    如何同步迭代并从PHP中的两个等级阵列打印值?
    同步的迭代和打印值来自相同大小的两个数组使用两个数组相等大小的selectbox时,一个包含country代码的数组,另一个包含乡村代码,另一个包含其相应名称的数组,可能会因不当提供了exply for for for the uncore for the forsion for for ytry...
    编程 发布于2025-05-16
  • 在JavaScript中如何获取实际渲染的字体,当CSS字体属性未定义时?
    在JavaScript中如何获取实际渲染的字体,当CSS字体属性未定义时?
    Accessing Actual Rendered Font when Undefined in CSSWhen accessing the font properties of an element, the JavaScript object.style.fontFamily and objec...
    编程 发布于2025-05-16
  • 如何在Java中正确显示“ DD/MM/YYYY HH:MM:SS.SS”格式的当前日期和时间?
    如何在Java中正确显示“ DD/MM/YYYY HH:MM:SS.SS”格式的当前日期和时间?
    如何在“ dd/mm/yyyy hh:mm:mm:ss.ss”格式“ gormat 解决方案:的,请访问量很大,并应为procectiquiestate的,并在整个代码上正确格式不多: java.text.simpledateformat; 导入java.util.calendar; 导入java...
    编程 发布于2025-05-16
  • 如何在鼠标单击时编程选择DIV中的所有文本?
    如何在鼠标单击时编程选择DIV中的所有文本?
    在鼠标上选择div文本单击带有文本内容,用户如何使用单个鼠标单击单击div中的整个文本?这允许用户轻松拖放所选的文本或直接复制它。 在单个鼠标上单击的div元素中选择文本,您可以使用以下Javascript函数: function selecttext(canduterid){ if(do...
    编程 发布于2025-05-16
  • 表单刷新后如何防止重复提交?
    表单刷新后如何防止重复提交?
    在Web开发中预防重复提交 在表格提交后刷新页面时,遇到重复提交的问题是常见的。要解决这个问题,请考虑以下方法: 想象一下具有这样的代码段,看起来像这样的代码段:)){ //数据库操作... 回声“操作完成”; 死(); } ?> ...
    编程 发布于2025-05-16
  • 如何检查对象是否具有Python中的特定属性?
    如何检查对象是否具有Python中的特定属性?
    方法来确定对象属性存在寻求一种方法来验证对象中特定属性的存在。考虑以下示例,其中尝试访问不确定属性会引起错误: >>> a = someClass() >>> A.property Trackback(最近的最新电话): 文件“ ”,第1行, attributeError:SomeClass实...
    编程 发布于2025-05-16
  • 为什么在我的Linux服务器上安装Archive_Zip后,我找不到“ class \” class \'ziparchive \'错误?
    为什么在我的Linux服务器上安装Archive_Zip后,我找不到“ class \” class \'ziparchive \'错误?
    Class 'ZipArchive' Not Found Error While Installing Archive_Zip on Linux ServerSymptom:When attempting to run a script that utilizes the ZipAr...
    编程 发布于2025-05-16
  • PHP SimpleXML解析带命名空间冒号的XML方法
    PHP SimpleXML解析带命名空间冒号的XML方法
    在php 很少,请使用该限制很大,很少有很高。例如:这种技术可确保可以通过遍历XML树和使用儿童()方法()方法的XML树和切换名称空间来访问名称空间内的元素。
    编程 发布于2025-05-16
  • 如何实时捕获和流媒体以进行聊天机器人命令执行?
    如何实时捕获和流媒体以进行聊天机器人命令执行?
    在开发能够执行命令的chatbots的领域中,实时从命令执行实时捕获Stdout,一个常见的需求是能够检索和显示标准输出(stdout)在cath cath cant cant cant cant cant cant cant cant interfaces in Chate cant inter...
    编程 发布于2025-05-16
  • 如何使用Java.net.urlConnection和Multipart/form-data编码使用其他参数上传文件?
    如何使用Java.net.urlConnection和Multipart/form-data编码使用其他参数上传文件?
    使用http request 上传文件上传到http server,同时也提交其他参数,java.net.net.urlconnection and Multipart/form-data Encoding是普遍的。 Here's a breakdown of the process:Mu...
    编程 发布于2025-05-16
  • eval()vs. ast.literal_eval():对于用户输入,哪个Python函数更安全?
    eval()vs. ast.literal_eval():对于用户输入,哪个Python函数更安全?
    称量()和ast.literal_eval()中的Python Security 在使用用户输入时,必须优先确保安全性。强大的Python功能Eval()通常是作为潜在解决方案而出现的,但担心其潜在风险。 This article delves into the differences betwee...
    编程 发布于2025-05-16
  • CSS强类型语言解析
    CSS强类型语言解析
    您可以通过其强度或弱输入的方式对编程语言进行分类的方式之一。在这里,“键入”意味着是否在编译时已知变量。一个例子是一个场景,将整数(1)添加到包含整数(“ 1”)的字符串: result = 1 "1";包含整数的字符串可能是由带有许多运动部件的复杂逻辑套件无意间生成的。它也可以是故意从单个真理...
    编程 发布于2025-05-16
  • 如何限制动态大小的父元素中元素的滚动范围?
    如何限制动态大小的父元素中元素的滚动范围?
    在交互式接口中实现垂直滚动元素的CSS高度限制,控制元素的滚动行为对于确保用户体验和可访问性是必不可少的。一种这样的方案涉及限制动态大小的父元素中元素的滚动范围。问题:考虑一个布局,其中我们具有与用户垂直滚动一起移动的可滚动地图div,同时与固定的固定sidebar保持一致。但是,地图的滚动无限期...
    编程 发布于2025-05-16
  • 哪种在JavaScript中声明多个变量的方法更可维护?
    哪种在JavaScript中声明多个变量的方法更可维护?
    在JavaScript中声明多个变量:探索两个方法在JavaScript中,开发人员经常遇到需要声明多个变量的需要。对此的两种常见方法是:在单独的行上声明每个变量: 当涉及性能时,这两种方法本质上都是等效的。但是,可维护性可能会有所不同。 第一个方法被认为更易于维护。每个声明都是其自己的语句,使其...
    编程 发布于2025-05-16
  • Python中嵌套函数与闭包的区别是什么
    Python中嵌套函数与闭包的区别是什么
    嵌套函数与python 在python中的嵌套函数不被考虑闭合,因为它们不符合以下要求:不访问局部范围scliables to incling scliables在封装范围外执行范围的局部范围。 make_printer(msg): DEF打印机(): 打印(味精) ...
    编程 发布于2025-05-16

免责声明: 提供的所有资源部分来自互联网,如果有侵犯您的版权或其他权益,请说明详细缘由并提供版权或权益证明然后发到邮箱:[email protected] 我们会第一时间内为您处理。

Copyright© 2022 湘ICP备2022001581号-3