Belajar Laravel 13 #7: Sistem Autentikasi (Laravel Breeze)
Heru Iryanto
Teacher, Content Creator and Full-Stack DeveloperDi Kelas PHP Prosedural, membuat sistem Login/Logout adalah puncak penderitaan yang memicu stres. Anda harus mengingat rumus Enkripsi Sandi (password_hash), memulai Session, dan menanyakan Database apakah email-nya cocok secara manual.
Framework Laravel tidak diciptakan untuk membuang waktu. Sistem autentikasi dasar adalah kewajiban yang sudah seharusnya diberikan secara otomatis. Ekosistem Laravel menyediakan Starter Kit (Peralatan Tempur Instan). Yang paling ringan dan modern adalah Laravel Breeze.
1️⃣ Menanamkan Laravel Breeze
Paket ajaib ini akan menciptakan halaman: Login, Register, Dashboard, Reset Password, Confirm Password, hingga Update Profile secara raksasa dalam satu kedipan mata, lengkap menggunakan arsitektur Tailwind CSS.
Inilah mengapa di kelas sebelumnya Anda diwajibkan memahami pola pikir Utility-First Tailwind!
Langkah Memanggil Pasukan: Di dalam folder proyek Laravel Anda, buka Terminal dan jalankan tiga perintah mematikan ini secara berurutan:
# 1. Panggil tukang paket (Composer) untuk mengunduh kerangka Breeze
composer require laravel/breeze --dev
# 2. Perintahkan artisan untuk memasang kerangkanya (Pilih opsi Blade dengan Alpine)
php artisan breeze:install blade
# 3. Rakit dan kompres kekuatan kodingan Tailwind CSS-nya!
npm install
npm run build
Setelah menjalankan perintah php artisan breeze:install blade, akan terbentuk beberapa folder dan file. Folder dan file yang sering digunakan antara lain:
app/
└── Http/
├── Controllers/
│ ├── Auth/
│ └── ProfileController.php
└── Requests/
resources/
└── views/
├── auth/
├── components/
├── layouts/
└── profile/
routes/
├── web.php
└── auth.php
Kalau secara keseluruhan folder dan file yang terbentuk bisa dilihat pada tabel di bawah:
| Folder/File | Keterangan |
|---|---|
app/Http/Controllers/Auth/ | Controller autentikasi (Login, Register, Password, dll.) |
app/Http/Controllers/ProfileController.php | Controller untuk mengelola profil pengguna |
app/Http/Requests/Auth/ | Form Request untuk validasi login, register, dll. |
app/Http/Requests/ProfileUpdateRequest.php | Validasi update profil |
resources/views/auth/ | Halaman Login, Register, Forgot Password, Verify Email, Reset Password |
resources/views/profile/ | Halaman edit profil |
resources/views/layouts/ | Layout utama aplikasi |
resources/views/components/ | Blade Components (button, input, label, dropdown, dll.) |
routes/auth.php | Route autentikasi |
routes/web.php | Ditambahkan require __DIR__.'/auth.php'; dan route dashboard |
resources/css/app.css | CSS Tailwind |
resources/js/app.js | JavaScript utama |
tailwind.config.js (jika belum ada) | Konfigurasi Tailwind |
vite.config.js | Konfigurasi Vite (biasanya diperbarui bila diperlukan) |
tests/Feature/Auth/ | Pengujian fitur autentikasi |
tests/Feature/ProfileTest.php | Pengujian fitur profil |
Pada routes/web.php akan ada route dashboard, profile dan pemanggilan file auth.php:
<?php
use App\Http\Controllers\ProfileController;
use Illuminate\Support\Facades\Route;
Route::get('/', function () {
return view('welcome');
});
Route::get('/dashboard', function () {
return view('dashboard');
})->middleware(['auth', 'verified'])->name('dashboard');
Route::middleware('auth')->group(function () {
Route::get('/profile', [ProfileController::class, 'edit'])->name('profile.edit');
Route::patch('/profile', [ProfileController::class, 'update'])->name('profile.update');
Route::delete('/profile', [ProfileController::class, 'destroy'])->name('profile.destroy');
});
require __DIR__.'/auth.php';
Route-route sebelumnya yang sudah kita buat ternyata hilang. Kita perlu mengembalikannya nanti. Namun untuk saat ini jangan khawatir, biarkan saja dulu apa adanya.
2️⃣ Menyaksikan Keajaiban di Depan Mata
Jangan lupa jalankan perintah php artisan optimize di terminal terlebih dahulu sebelum membuka halaman http://localhost:8000.
Sekarang, buka Browser Anda dan ketikkan alamat:
http://localhost:8000. Maka akan muncul tombol “Log in” dan “Register”.
Sekarang coba klik tombol “Register”. Apakah mata Anda terbelalak? Sebuah kotak Formulir Pendaftaran premium yang sudutnya melengkung halus dan elegan dengan border Tailwind abu-abu tipis.
Coba isikan formulir tersebut dengan sembarang nama dan email, misal “Admin” dan “admin@gmail.com”, lalu masukkan password. Klik Register, dan Anda otomatis akan dilemparkan ke dalam sebuah ruang Dashboard Admin Privat!
Fitur tambahan yang langsung Anda dapatkan secara gratis tanpa menulis satu kode pun:
- Coba ketik email yang salah saat login, otomatis akan muncul garis merah tanda Error.
- Sandi Anda langsung di-enkripsi menggunakan sistem rahasia militer (Bcrypt).
- Jika ada Hacker yang mencoba memaksa login 100 kali berturut-turut, sistem Breeze otomatis akan memblokirnya sementara (Throttle Lockout).
3️⃣ Membedah Titik Eksekusi (Auth Core)
Bagaimana sihir ini bekerja?
Laravel menciptakan kerangka kontroler (Controller) khusus di dalam app/Http/Controllers/Auth/. Di sanalah semua logika rahasia Login itu tertulis.
(Anda tidak disarankan mengotak-atik file tersebut jika belum benar-benar menguasai Laravel).
Namun, ada dua hal yang harus Anda ubah saat Anda membuat proyek nyata: Mengubah Titik Lemparan Setelah Login Berhasil!
Secara default, setelah berhasil memasukkan sandi, pengunjung akan ditendang ke halaman bernama /dashboard. Bagaimana jika kita ingin melemparkannya ke /admin-panel? Cara mudah nya yaitu dengan merubah route /dashboard menjadi /admin-panel di file routes/web.php. Pada name('dashboard') tidak usah diubah.
Di Laravel 13 yang bersistem Skeleton Slim, Anda cukup melompat ke file routes/web.php (Atau bisa juga mengintip file kontroler AuthenticatedSessionController.php), namun Laravel memiliki file pengaturan tersembunyi jika Anda menelusuri Rute bawaannya.
Inti dari cara kita mengetahui “Siapakah nama orang yang sedang Login saat ini?” adalah memanggil fungsi global penyimpan roh (Session) yaitu:
Auth::user().
Contoh, kita buka View resources/views/dashboard.blade.php. Lalu, di atas kode {{ __("You're logged in!") }}, kita bisa tambahkan sintaks Blade berikut ini:
<h1 class="text-2xl text-blue-500 font-bold">
Halo Bos {{ Auth::user()->name }}, selamat datang kembali!
</h1>
🗽 Kesimpulan
Jika Anda menyerap materi ini dengan saksama, mulai detik ini juga, Anda tidak akan pernah menghabiskan waktu lebih dari 1 menit untuk meracik fondasi sistem Login untuk aplikasi Web klien Anda. Perusahaan rintisan (StartUp) sangat memuja efisiensi waktu kecepatan seperti ini.
Sistem Login sudah jadi, tetapi ada satu masalah mematikan. Ketika kita membuat route baru, misal /admin/laporan-keuangan, route ini kan harusnya tidak bisa diakses sebelum login, namun masih bisa diakses.
Bagaimana cara menaruh Satpam Berbadan Kekar di tengah jalan untuk mencegat Hacker tamu ini? Temukan portal keamanannya di materi Middleware (Penjaga Pintu Rute).
