Laravel / Pemrograman Web Lanjut · July 28, 2022 0

Authentication, untuk membatasi hak akses user dengan Laravel UI #belajarlaravel-11

Autentikasi adalah sebuah proses validasi atau pembuktian identitas terhadap pengguna yang ingin mengakses suatu file, aplikasi, atau sistem tertentu. Untuk membuat-nya kita menggunakan Laravel UI, untuk dokumentasinya bisa di cek di : https://github.com/laravel/ui

Install dengan menggunakan composer

composer require laravel/ui

Selanjutnya setelah paket laravel/ui diinstal, Anda dapat menginstal perancah frontend menggunakan perintah ui Artisan:

php artisan ui bootstrap --auth

Setelah menginstal paket laravel/ui Composer dan membuat scaffolding frontend, file package.json Laravel akan menyertakan paket bootstrap untuk membantu Anda memulai membuat prototipe frontend aplikasi Anda menggunakan Bootstrap. Namun, jangan ragu untuk menambah atau menghapus paket dari file package.json sesuai kebutuhan untuk aplikasi Anda sendiri. Anda tidak diharuskan menggunakan kerangka Bootstrap untuk membangun aplikasi Laravel Anda – ini disediakan sebagai titik awal yang baik bagi mereka yang memilih untuk menggunakannya.

Sebelum mengkompilasi CSS Anda, instal dependensi frontend proyek Anda menggunakan manajer paket Node (NPM):

npm install

Setelah dependensi diinstal menggunakan npm install, Anda dapat mengkompilasi file SASS Anda ke CSS biasa menggunakan Vite. Perintah npm run dev akan memproses instruksi di file vite.config.js Anda. Biasanya, CSS terkompilasi Anda akan ditempatkan di direktori public/build/assets:

npm run dev

Jika kita sudah mempunyai template sendiri maka arahkan .css dan .js pada file bootstrap pada aplikasi yang sedang di bangun

Selanjutnya secara otomatis akan dibuatkan file login.blade.php, registrasi.blade.php dan verify.blade.php

Halaman Login
Halaman Register
Halaman Reset Password

Selanjutnya silahkan melakukan setting pada tampilan aplikasi website agar menyesuaikan dengan tampilan menu dari Laravel UI yang baru. Setelah itu lakukan registrasi user baru untuk mengakses halaman dasboard admin.

Isi tabel users setelah selesai melakukan resgistrasi user

Setelah itu silahkan login

Halaman setelah login berhasil

Didalam aplikasi tersebut ada duah buah menu yaitu halaman About dan alaman Buku, menu itu merupakan modul yang sudah kita buat pada pertemuan sebelumnya.

Untuk menampilkan menu tersebut kita harus melakukan sebuah Autentikasi pada halaman route kita, yaitu dengan cara menambahkan code berikut:

<?php

use App\Http\Controllers\BukuController;
use Illuminate\Support\Facades\Route;
use Illuminate\Support\Facades\Auth;


Route::get('/', function () {
    return view('welcome', [
        "title" => "Home"
    ]);
});

Route::get('/about', function () {
    return view('about', [
        "title" => "About"
    ]);
});

Route::middleware(['auth'])->group(function () {
    Route::get('/buku', [BukuController::class, 'index']);
    Route::get('/buku/create', [BukuController::class, 'create']);
    Route::post('/buku/save', [BukuController::class, 'save']);
    Route::get('/buku/{id}/edit', [BukuController::class, 'edit']);
    Route::put('/buku/{id}', [BukuController::class, 'update']);
    Route::post('/buku/{id}', [BukuController::class, 'destroy']);
});

Auth::routes();

Route::get('/home', [App\Http\Controllers\HomeController::class, 'index'])->name('home');

Setelah kita login barulah kita bisa mengakses semua route yang mengarah pada controller buku

Sebelum login hanya bisa menampilkan halaman

Tampilan halaman sebelum login

Tugas :

Silahkan edit dan sesuaikan dengan tampilan sebelumnya yang kita buat, jika ada error papda $title dihalaman Home, Login, Register dan Forgor Password silahkan tambahkan tittle dimasing-masing contotller halaman pada folder laravel->ui