Membina Panel Pentadbir Teguh dengan Filamen dan Laravel: Panduan Langkah demi Langkah

PHPz
Lepaskan: 2024-09-03 18:32:41
asal
1276 orang telah melayarinya

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

Laravel ialah rangka kerja PHP yang berkuasa yang menyediakan asas kukuh untuk membangunkan aplikasi web. Filamen ialah panel pentadbir sumber terbuka yang elegan dan pembina borang untuk Laravel yang memudahkan penciptaan antara muka pentadbir. Panduan ini akan membimbing anda membina panel pentadbir yang mantap menggunakan versi terkini Filamen dan Laravel.

Pemula SaaS Laravel - Mulakan Saas anda yang seterusnya dalam sehari bukan minggu
Mulakan projek Laravel Saas anda yang seterusnya hanya dalam sehari, bukan minggu! Dengan ciri binaan yang diperlukan setiap saas
www.laravelsaas.store

Prasyarat
Sebelum kami mula, pastikan anda telah memasang yang berikut pada mesin pembangunan anda:

PHP >= 8.0
Komposer
Node.js dan NPM
MySQL atau mana-mana pangkalan data lain yang disokong oleh Laravel

Langkah 1: Menyediakan Projek Laravel Baharu

Pertama, buat projek Laravel baharu menggunakan Komposer:

composer create-project --prefer-dist laravel/laravel filament-admin
cd filament-admin
Salin selepas log masuk

Seterusnya, sediakan pembolehubah persekitaran anda. Namakan semula fail .env.example kepada .env dan kemas kini konfigurasi pangkalan data dengan kelayakan anda:

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=filament_db
DB_USERNAME=root
DB_PASSWORD=your_password
Salin selepas log masuk

Jalankan arahan berikut untuk menjana kunci aplikasi dan pindahkan jadual Laravel lalai:

php artisan key:generate
php artisan migrate

Salin selepas log masuk

Langkah 2: Memasang Filamen

Untuk memasang Filamen, gunakan Komposer:

composer require filament/filament
Salin selepas log masuk

Seterusnya, terbitkan aset dan konfigurasi Filamen:

php artisan filament:install
Salin selepas log masuk

Langkah 3: Menyediakan Pengesahan

Filamen memerlukan pengesahan untuk mengurus akses kepada panel pentadbir. Laravel menyediakan perancah pengesahan terbina dalam. Mari gunakan Laravel Breeze untuk kesederhanaan:

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

Salin selepas log masuk

Ikuti gesaan untuk memilih pilihan bahagian hadapan pilihan anda (Blade, Vue, React). Untuk contoh ini, kami akan menggunakan Blade:

php artisan migrate
npm install
npm run dev

Salin selepas log masuk

Pastikan anda mempunyai pengguna untuk log masuk. Anda boleh menggunakan Laravel Tinker untuk mencipta satu:

php artisan tinker

>>> \App\Models\User::factory()->create(['email' => 'admin@example.com']);
Salin selepas log masuk

Langkah 4: Mengkonfigurasi Filamen

Kemas kini model Pengguna untuk melaksanakan kontrak Filament HasFilamentRoles jika anda menggunakan peranan atau kebenaran. Buat masa ini, kami akan memastikan mana-mana pengguna yang disahkan boleh mengakses Filamen.

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, [
            'admin@example.com',
        ]);
    });
}
Salin selepas log masuk

Langkah 5: Mencipta Sumber

Sumber filamen ialah model Eloquent dengan antara muka CRUD. Mari cipta sumber untuk mengurus model Post.

Jana model, migrasi dan kilang:

php artisan make:model Post -mf
Salin selepas log masuk

Tentukan medan dalam fail migrasi:

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

Jalankan migrasi:

php artisan migrate
Salin selepas log masuk

Seterusnya, jana sumber Filamen:

php artisan make:filament-resource Post
Salin selepas log masuk

Arahan ini mencipta fail yang diperlukan untuk sumber tersebut. Buka app/Filament/Resources/PostResource.php dan tentukan medan sumber:

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'),
        ];
    }
}
Salin selepas log masuk

Langkah 6: Menambah Navigasi

Tambahkan sumber pada bar sisi Filamen. Buka app/Providers/FilamentServiceProvider.php dan daftarkan sumber:

use App\Filament\Resources\PostResource;

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

Langkah 7: Menyesuaikan Filamen

Filamen sangat boleh disesuaikan. Anda boleh menukar tema, komponen dan banyak lagi. Contohnya, untuk menyesuaikan warna utama, kemas kini fail config/filament.php:

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

Salin selepas log masuk

Anda juga boleh membuat halaman tersuai, widget dan komponen borang dengan mengikuti dokumentasi: Dokumentasi Filamen.

Pemula SaaS Laravel - Mulakan Saas anda yang seterusnya dalam sehari bukan minggu
Mulakan projek Laravel Saas anda yang seterusnya hanya dalam sehari, bukan minggu! Dengan ciri binaan yang diperlukan setiap saas
www.laravelsaas.store

Kesimpulan

Dalam panduan ini, kami telah melalui penyediaan projek Laravel baharu, memasang Filamen, menyediakan pengesahan, mencipta sumber dan menyesuaikan panel pentadbir Filamen. Ini sepatutnya memberi anda asas yang kukuh untuk membina panel pentadbir yang teguh menggunakan Filamen dan Laravel. Untuk ciri dan penyesuaian yang lebih lanjut, rujuk dokumentasi rasmi dan terokai keupayaan Filamen.

Selamat mengekod!

Atas ialah kandungan terperinci Membina Panel Pentadbir Teguh dengan Filamen dan Laravel: Panduan Langkah demi Langkah. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:dev.to
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan
Tentang kita Penafian Sitemap
Laman web PHP Cina:Latihan PHP dalam talian kebajikan awam,Bantu pelajar PHP berkembang dengan cepat!