Panduan Modul & Fitur di Laravel dan Filament

Introduction

Hello Rekan-Rekan semua, kembali lagi Kita melanjutkan pembahasan untuk pembuatan sistem informasi website menggunakan framework Laravel dan Filament PHP. Pada kesempatan kali ini Kita akan mengeksplorasi dalam membuat fitur atau modul dalam website. Sebelum Kita melangkah lebih lanjut sebaiknya Kita telah membuat rancangan sistem informasi yang dibutuhkan agar proses development atau implementation dapat berjalan dengan optimal. Selanjutnya perlu mengetahui langkah demi langkah dalam membuat fitur atau modul sistem informasi sesuai dengan teknologi yang digunakan.

Pada kesempatan kali ini Kita akan menggunakan studi kasus berupa sistem informasi rekrutmen berupa Applicant Tracking System (ATS) sederhana berbasis website. Berikut tabel Business Need pada tabel 1 dan ERD pada gambar 1 dari studi kasus yang digunakan :

Tabel 1. Business Need dari sistem informasi

Gambar 1. Diagram ERD

Langkah-langkah sederhana membuat fitur atau modul sistem informasi di Laravel dan Filament PHP.

Secara sederhana terdapat beberapa langkah yang dapat dilakukan dalam membuat fitur atau modul sistem informasi berbasis website di Laravel dan Filament PHP. Pada gambar 2 terdapat 8 langkah sederhana yang dapat diikuti dalam membuat fitur atau modul sistem informasi.

Gambar 2. Langkah - langkah membuat fitur atau modul sistem informasi di Laravel dan Filament PHP

Keterangan :

Membuat model dan migration

Langkah pertama yang harus dilakukan yaitu dengan membuat model data dan table database sesuai dengan perancangan yang telah dibuat dengan perintah menggunakan Command Line Interface (CLI) berupa php artisan make:model ModelName -m

Nb: ModelName harus berupa singular. contoh : Vacancy.

Mengisi model

Langkah kedua yaitu Kita menyusun parameter aturan yang ada di model yang secara umum berupa : model dibuat untuk merepresentasikan tabel apa, mendefinisikan field (entitas tabel) yang dilindungi atau diizinkan untuk diisi oleh pengguna, dan mendefinisikan relationship (hubungan) antar tabel.

Nb : Apabila dalam fitur apabila data saat dihapus oleh pengguna tidak langsung hilang dapat menambahkan Softdeletes().

Pada studi kasus bahwa user dapat membuat banyak lowongan pekerjaan (vacancy) maka :
a. Pada Model User perlu ditambahkan relation berupa one-to-many dengan Model Vacancy menggunakan hasMany dan diberi nama user.

 <?php

 namespace App\Models;

 // use Illuminate\Contracts\Auth\MustVerifyEmail;
 use Illuminate\Database\Eloquent\Factories\HasFactory;
 use Illuminate\Database\Eloquent\Relations\HasMany;
 use Illuminate\Foundation\Auth\User as Authenticatable;
 use Illuminate\Notifications\Notifiable;

 class User extends Authenticatable
 {
     /** @use HasFactory<\Database\Factories\UserFactory> */
     use HasFactory, Notifiable;

     /**
      * The attributes that are mass assignable.
      *
      * @var list<string>
      */
     protected $fillable = [
         'name',
         'email',
         'password',
     ];

     /**
      * The attributes that should be hidden for serialization.
      *
      * @var list<string>
      */
     protected $hidden = [
         'password',
         'remember_token',
     ];

     /**
      * Get the attributes that should be cast.
      *
      * @return array<string, string>
      */
     protected function casts(): array
     {
         return [
             'email_verified_at' => 'datetime',
             'password' => 'hashed',
         ];
     }
     //Menambahkan relation dengan model Vacancy
     public function vacancies(): HasMany
     {
         return $this->hasMany(Vacancy::class, 'user_id');
     }
 }

b. Pada Model Vacancy perlu ditambahkan relation berupa belongs to dengan Model Vacancy menggunakan belongsTo.

 <?php

 namespace App\Models;

 use Illuminate\Database\Eloquent\Factories\HasFactory;
 use Illuminate\Database\Eloquent\Model;
 use Illuminate\Database\Eloquent\Relations\BelongsTo;
 use Illuminate\Database\Eloquent\SoftDeletes;

 class Vacancy extends Model
 {
     use HasFactory, SoftDeletes;

     protected $table = 'vacancies';

     protected $guided = ['id'];

     public function user(): BelongsTo
     {
         return $this->belongsTo(User::class, 'user_id', 'id');
     }
 }

Mengisi migration

Langkah ketiga yaitu Kita dapat menyusun schema atau atribut database yang akan dibuat pada bagian folder database/migration yang nantinya akan digunakan untuk menyimpan data.

Nb : Apabila dalam fitur apabila data saat dihapus oleh pengguna tidak langsung hilang dapat menambahkan softdeletes()

<?php

namespace App\Models;

use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Database\Eloquent\Model;
use Illuminate\Database\Eloquent\Relations\BelongsTo;
use Illuminate\Database\Eloquent\SoftDeletes;

class Vacancy extends Model
{
    use HasFactory, SoftDeletes;

    protected $table = 'vacancies';

    protected $guided = ['id'];

    public function user(): BelongsTo
    {
        return $this->belongsTo(User::class, 'user_id', 'id');
    }
}

Melakukan migrate ke database

Langkah keempat yaitu melakukan migrate dari susunan schema (entittas) database yang telah dibuat ke dalam MySQL menggunakan perintah CLI berupa php artisan migrate
Membuat modul FilamentResource

Pada tahap ke lima, Kita perlu membuat fitur atau modul sebagai contoh yaitu untuk mengelola data lowongan pekerjaan (CRUD), maka dapat menjalankan perintah CLI berupa php artisan make:filament-resource Vacancy --panel=AdminPanel
Mendefinisikan struktur form (Create & Update)

Langkah keenam yaitu menyusun form sesuai dengan schema (atribut) database yang telah disusun sebelumnya yaitu table vacancies dengan mengakses VacancyResource.php.

public static function form(Form $form): Form
    {
        return $form
            ->schema([
                // Select::make('user_id')
                //     ->relationship('user', 'name')
                //     ->default(fn() => Auth::id()),
                Hidden::make('user_id')
                    ->default(Auth::id()) // Mengisi otomatis dengan ID user yang sedang login
                    ->required(),
                Grid::make(3)->schema([
                    TextInput::make('job_name')->required()->maxLength(255),
                    Select::make('job_category')
                        ->options([
                            'Internship' => 'Internship',
                            'part-Time' => 'Part-Time',
                            'Full-Time' => 'Full-Time',
                        ])->required(),
                    Toggle::make('status')
                        ->label('Vacancy Status'),
                ]),
                RichEditor::make('job_desc')
                    ->required()
                    ->columnSpanFull(),
                Select::make('education_requirment')
                    ->options([
                        'SMP' => 'SMP',
                        'SMA' => 'SMA',
                        'D3' => 'D3',
                        'SARJANA' => 'S1',
                    ])
                    ->required(),
                Select::make('job_type')
                    ->options([
                        'STAFF' => 'STAFF',
                        'SUPERVISOR' => 'SUPERVISOR',
                        'CHIEF' => 'CHIEF',
                    ])
                    ->required(),
                TextInput::make('exp_min_req')
                    ->integer()
                    ->suffix('Th')
                    ->required(),
                TextInput::make('exp_max_req')
                    ->integer()
                    ->suffix('Th')
                    ->required(),
                TextInput::make('salary_min')
                    ->integer()
                    ->prefix('Rp')
                    ->required(),
                TextInput::make('salary_max')
                    ->integer()
                    ->prefix('Rp')
                    ->required(),
                TextInput::make('qty')
                    ->integer()
                    ->required(),
                DatePicker::make('deadline')
                    ->required(),

            ]);
    }

Apabila ingin menjalankan proyek dapat menggunakan perintah CLI berupa php artisan serve kemudian masuk ke menu navigasi vacancies kemudian → Klik create data → Maka akan muncul tampilan seperti berikut ini :

Setelah muncul dapat dilakukan simulasi dengan mengisi form lalu klik create.

Mendefinisikan struktur list berupa tabel

Langkah ketuju yaitu menyusun tampilan item data yang telah tersimpan di database pada bagian index dengan berbasis tabel atau card.

public static function table(Table $table): Table
    {
        return $table
            ->columns([
                TextColumn::make('job_name'),
                TextColumn::make('job_category'),
                ToggleColumn::make('status')->label('Vacancy status'),
                TextColumn::make('deadline'),
            ])
            ->filters([
                SelectFilter::make('job_name'),
                SelectFilter::make('job_category')
            ])
            ->actions([
                Tables\Actions\ViewAction::make(),
                Tables\Actions\EditAction::make(),
                Tables\Actions\DeleteAction::make(),

            ])
            ->bulkActions([
                Tables\Actions\BulkActionGroup::make([
                    Tables\Actions\DeleteBulkAction::make(),
                ]),
            ]);
    }

Menambahkan fitur lihat data (View) dan hapus data (Delete)

Langkah kedelapan yaitu dengan menambahkan action button berupa view dan delete sehingga data dapat dilihat secara keseluruhan dan juga dapat di hapus jika sudah tidak diperlukan lagi.

 public static function table(Table $table): Table
     {
         return $table
             ->columns([
                 //
             ])
             ->filters([
                 //
             ])
             ->actions([
                 Tables\Actions\ViewAction::make(),
                 Tables\Actions\EditAction::make(),
                 Tables\Actions\DeleteAction::make(),

             ])
             ->bulkActions([
                 Tables\Actions\BulkActionGroup::make([
                     Tables\Actions\DeleteBulkAction::make(),
                 ]),
             ]);
     }

Demikian langkah-langkah sederhanan dalam membuat fitur atau modul dari sistem CRUD yaitu menyimpan data, memperbarui data, melihat data, dan menghapus data. Semoga dapat memberikan gambaran dalam menggunakan Laravel dan filament PHP.

Mohon maaf apabila ada banyak kekurangan. Terima Kasih atas perhatian yang telah diberikan.

Salam Hormat,
Muhammad Arief Ardyansyah

[#5] Membuat Modul dan Fitur di Laravel dan Filament PHP

#LearningTogether #ForBetterFuture

Introduction

Langkah-langkah sederhana membuat fitur atau modul sistem informasi di Laravel dan Filament PHP.

Membuat model dan migration

Mengisi model

Mengisi migration

Melakukan migrate ke database

Membuat modul FilamentResource

Mendefinisikan struktur form (Create & Update)

Mendefinisikan struktur list berupa tabel

Menambahkan fitur lihat data (View) dan hapus data (Delete)