Tutorial Laravel Jetstream #5 : Profile Management


Fika Ridaul Maulayya
Full-Stack Developer, Content Creator and CO-Founder SantriKoding.com
Tutorial  Laravel Jetstream #5 : Profile Management

Halo teman-teman semuanya, jika sebelumnya kita sudah membahas tentang Authentication di dalam Laravel Jetstream maka kali ini kita akan mengulas tentang Profile Management di dalam Laravel Jetstream. Fitur Profile Management Laravel Jetstream dapat kita akses melalui menu dropdown di kanan atas setelah kita berhasil melakukan Login.

Laravel Jetstream membuat scaffolds views dan action yang mana memungkinkan user untuk melakukan update data, seperti: nama, email, alamat dan foto profile.


Views / Pages

Ketika kita menggunakan stack Livewire di Laravel Jetstream, untuk tampilan profile akan diambil dari file template Blade berikut ini : resources/views/profile/update-profile-information-form.blade.php. Dan jika kita menggunakan Inertia maka template yang digunakan akan diambil dari resources/js/Pages/Profile/UpdateProfileInformationForm.vue.

Di dalam semua template profile kita bisa menampilkan data user yang sudah login dengan objek dan disini memungkinkan kita untuk menambahkan beberapa form atau inputan jika memang dibutuhkan. Jadi kita bisa dengan lebih mudah untuk melakukan kustomisasi.

Actions

Actions merupakan fitur dari Laravel Jetsream yang digunakan untuk membuat logika dan menerima request yang mana salah satunya untuk melakukan update data profile. Kita bisa melihat action yang digunakan untuk melakukan update profile di dalam class berikut ini :

App\Actions\Fortify\UpdateUserProfileInformation

Di dalam class di atas kita bisa menyesuaikan data profile apa saja yang perlu diupdate dan tidak. Oleh karena itu, penyesuaian apa pun yang ingin kita lakukan pada logika harus dilakukan di class ini. Actions ini menerima data user yang sudah melakukan login dan menerima request input berupa array dari form, termasuk foto profil.

Foto Profile

Secara default Laravel Jetstream memungkin user untuk melakukan update foto profile, kita bisa fungsi yang digunakan untuk melakukan update foto profile di dalam Traits Laravel\Jetstream\HasProfilePhoto, dimana Traits tersebut akan otomatis terhubung dengan Model User App\Models\User saat kita melakukan installasi Laravel jetstream. Kita bisa melihatnya di app/Models/User.php :

use Laravel\Jetstream\HasProfilePhoto;
...

class User extends Authenticatable
{
   use HasProfilePhoto;
   ...
   ...
}

Dan jika kita buka Traits Laravel\Jetstream\HasProfilePhoto maka kita akan menemukan banyak function, diantaranya adalah :

  • updateProfilePhoto
  • getProfilePhotoUrlAttribute
  • defaultProfilePhotoUrl
  • profilePhotoDisk

Disini kita disarankan untuk melihat source code yang disediakan, sehingga kita bisa lebih paham secara penuh tentang fitur yang disediakan dan mampu membuat beberapa kustomisasi yang bisa sesuai kebutuhan.

Disable Fitur Foto Profile

Secara default ketika kita menggunakan Laravel Jetstream, maka kita dapat melakukan update foto profile dengan sangat mudah, akan tetapi disini kita juga dapat menon-aktifkan fitur ini jika dirasa tidak dibutuhkan. Kita bisa menon-aktifkan fitur ini di dalam file config/jetstream.php. Untuk menonaktifkan fitur, cukup beri komentar dari item konfigurasi, kurang lebih seperti berikut ini :

'features' => [
    // Features::profilePhotos(),
    Features::api(),
    Features::teams(),
]

Hapus Akun

Di dalam template profile juga tersedia fitur untuk mengahpus data akun dari user yang sedang login. Ketika user melakukan hapus data akun, maka action yang akan di panggil adalah :

App\Actions\Jetstream\DeleteUser



Kita bisa dengan bebas menyesuaikan logika hapus akun di dalam class ini. DI artikel selanjutnya kita akan membahas tentang Security yang ada di dalam Laravel Jetstream, seperti Two-Factor-Authentication, Password Update, Password Confirmation dan lain-lain.


Fika Ridaul Maulayya
Full-Stack Developer, Content Creator and CO-Founder SantriKoding.com

Suka dengan tulisan di SantriKoding? Kamu bisa memberikan dukungan dengan berdonasi atau bagikan konten ini di sosial media. Terima kasih atas dukungan Anda!

KEBIJAKAN KOMENTAR

Saat memberikan komenatar silahkan memberikan informasi lengkap tentang error, seperti: screenshot, link kode, dll. Baca aturan komentar kami