Category Resource

Salah satu kekuatan utama Filament adalah kemampuannya untuk membangunkan fitur CRUD (Create, Read, Update, Delete) dengan sangat cepat. Jadi, kita tidak perlu menulis semuanya dari nol.

Cukup dengan satu perintah artisan berikut:

php artisan make:filament-resource Category --generate

Silakan jalankan perintah diatas, maka akan muncul beberapa pertanyaan:

Laravel Filament akan menanyakan beberapa hal:

• What is the title attribute for this model? → Cukup tekan Enter, maka Filament akan otomatis menggunakan name sebagai atribut judul.
• Would you like to generate a read-only view page for the resource? → Di sini kita pilih no, karena untuk Category kita tidak membutuhkan halaman detail (show page).

Maka jika kita lihat didalam folder app/Filament/Resources/ akan muncul folder categories.

1. CategoryResource.php

• File utama resource.
• Di sini didefinisikan model yang dipakai (Category::class).
• Menghubungkan form schema dan table schema.
• Jadi ibaratnya ini adalah “pintu masuk” resource Category.

2. Pages/

Di folder Pages ada 3 file:

• CreateCategory.php → Halaman untuk membuat kategori baru.
• EditCategory.php → Halaman untuk mengedit kategori yang sudah ada.
• ListCategories.php → Halaman untuk menampilkan daftar semua kategori.

Ketiga file ini otomatis sudah terhubung dengan resource utama, jadi CRUD bisa langsung jalan.

3. Schemas/

Di sini kita menemukan file:

• CategoryForm.php

File ini khusus untuk mengatur form schema. Jadi field apa saja yang muncul di form create/edit kategori, misalnya name, slug, description, image, is_active, itu semua didefinisikan di sini. Dengan pemisahan ini, kode jadi lebih rapi dan modular.

4. Tables/

Di sini ada file:

• CategoriesTable.php

File ini dipakai untuk mengatur tampilan tabel di halaman daftar kategori. Misalnya kolom apa yang ditampilkan (nama, slug, status), sorting, searching, filter, hingga action seperti edit atau delete.

Konfigurasi CategoryForm

Agar image yang kita upload terbaca dan tersimpan baik didalam folder storage, maka kita perlu menambahkan beberapa konfigurasi pada FIleUpload menjadi seperti diabwah ini:

FileUpload::make('image')
                    ->image()
                    ->directory('categories') 
                    ->disk('public')         
                    ->visibility('public'),   

Maksudnya adalah:

1. FileUpload::make('image')

Ini artinya kita membuat sebuah input upload file untuk field image di tabel categories. Jadi saat user menambahkan kategori, dia bisa memilih file gambar dari komputer.

2. ->image()

Menandakan bahwa file yang boleh diupload adalah image. Dengan opsi ini, Filament akan otomatis membatasi upload agar sesuai format gambar (jpg, png, dsb).

3. ->directory('categories')

Gambar yang diupload tidak disimpan sembarangan, melainkan diarahkan ke folder categories di dalam storage/app/public/. Contoh hasil upload:

storage/app/public/categories/nama-file.jpg

Jadi semua gambar kategori tersusun rapi di satu folder khusus.

4. ->disk('public')

Laravel mendukung banyak disk (penyimpanan) seperti local, public, bahkan bisa ke cloud (S3, dsb). Dengan public, artinya file disimpan di storage/app/public dan bisa diakses secara publik setelah dijalankan perintah:

php artisan storage:link

Perintah ini membuat symbolic link dari storage/app/public ke folder public/storage yang sudah kita bahas didalam episode 3.

5. ->visibility('public')

Ini mengatur agar file bisa diakses oleh publik. Artinya, setelah upload, gambar bisa ditampilkan langsung di browser melalui URL, misalnya:

http://localhost:8000/storage/categories/nama-file.jpg

Kalau tanpa ini, file mungkin tetap tersimpan, tapi tidak bisa diakses secara langsung dari web.

Konfigurasi CategoriesTable

Secara default, halaman index table (daftar data kategori) di Filament hanya akan menampilkan kolom teks, misalnya name, slug, atau description. Namun karena pada kategori kita juga punya field image, tentu akan lebih menarik kalau gambar tersebut bisa langsung tampil di tabel daftar.

Untuk itu, kita perlu menambahkan konfigurasi pada file CategoriesTable.php di dalam folder Tables.

Kodenya seperti berikut:

ImageColumn::make('image')
    ->disk('public'),

1. ImageColumn::make('image') Membuat sebuah kolom khusus yang menampilkan data sebagai gambar, bukan teks. Kolom ini akan mengambil nilai dari field image di tabel categories.

   Jadi kalau sebelumnya hanya tampil nama-file.jpg, sekarang langsung muncul preview gambarnya di tabel.

2. ->disk('public') Memberi tahu Filament bahwa file gambar disimpan di disk public, yaitu folder storage/app/public.

   Karena sebelumnya di CategoryForm kita juga sudah set upload ke disk('public'), maka konfigurasi ini harus konsisten, supaya gambar yang diupload bisa ditemukan dan ditampilkan di tabel.

Konfigurasi .env

Silakan buka file .env, kemudian pastikan pada bagian APP_URL nilainya diatur seperti berikut:

APP_URL=http://127.0.0.1:8000

• APP_URL adalah konfigurasi utama yang digunakan Laravel untuk menentukan alamat dasar (base URL) aplikasi.
• Jika APP_URL tidak sesuai, maka link menuju file yang ada di folder storage (misalnya gambar yang kita upload) bisa saja tidak tampil, karena URL yang dihasilkan tidak benar.

Dengan mengatur APP_URL ke http://127.0.0.1:8000, maka:

1. Laravel akan menghasilkan URL yang sesuai dengan alamat aplikasi kita.
2. File yang tersimpan di storage/app/public dan sudah di-link ke public/storage bisa diakses melalui browser.

Uji Coba

Silakan teman-teman login kedalam aplikasi melalui http://127.0.0.1:8000/admin/login dan gunakan email password yang sudah ditambahkan pada awal materi, maka akan menemukan sebuah menu baru didalam sidebar seperti berikut ini:

Index Categories

Create Category

Edit Category

Multiple Delete

Pada materi berikutnya, kita akan membuat resource Post.