Membuat Laravel Bootstrap Auth Scaffolding

Untuk membuat Laravel Bootstrap Auth Scaffolding, berikut adalah langkah-langkahnya:

Langkah 1: Instalasi Laravel UI

Laravel UI adalah paket yang menyediakan fungsionalitas otentikasi primitif. Instal Laravel UI menggunakan Composer:

composer require laravel/ui

Langkah 2: Pilih Templat Otentikasi

Laravel UI mendukung beberapa templat otentikasi termasuk Bootstrap, Vue, React, dan lain-lain. Jika Anda ingin menggunakan Bootstrap, jalankan perintah berikut:

php artisan ui bootstrap --auth

Perintah ini akan menghasilkan tata letak antarmuka pengguna (UI) dengan Bootstrap dan membuat file-file terkait untuk otentikasi seperti registrasi, login, dan reset password.

Langkah 3: Install Dependensi NPM

sebelum menjalankan pastikan telah menginstal node.js di sini https://nodejs.org

untuk mengecek apakah node.js sudah di install gunahkan perintah berikut:

node -v
// atau
node --version

Instal dependensi JavaScript menggunakan npm atau yarn. Masuk ke direktori proyek Laravel dan jalankan perintah:

npm install
# atau
yarn install

Langkah 4: Compile Asset JavaScript dan CSS

Setelah menginstal dependensi, kompilasi file JavaScript dan CSS menggunakan Laravel Mix. Laravel Mix telah dikonfigurasi secara otomatis oleh perintah php artisan ui bootstrap --auth. Jalankan perintah berikut:

npm run dev
# atau
yarn dev

Perintah ini akan mengkompilasi dan menggabungkan asset JavaScript dan CSS ke dalam direktori public/js dan public/css.

Langkah 5: Jalankan Server Pengembangan Laravel

Terakhir, jalankan server pengembangan Laravel dengan perintah:

php artisan serve

Sekarang, Anda dapat mengakses aplikasi di http://localhost:8000. Tata letak antarmuka pengguna (UI) Anda menggunakan Bootstrap dan sudah terintegrasi dengan fitur otentikasi Laravel yang telah disediakan. Anda dapat menyesuaikan tampilan otentikasi sesuai kebutuhan proyek Anda di dalam file Blade di direktori resources/views/auth.

Berikut adalah cara menerapkan otentikasi pada route-route yang telah Anda berikan:

  1. Tambahkan Middleware Auth pada Route yang Diperlukan:

    Edit file web.php (atau file routes lainnya jika Anda memisahkan route-rute ke dalam file terpisah) dan tambahkan middleware auth pada route-route yang perlu dilindungi:

    use App\Http\Controllers\ProductController;
    
    // Route untuk menampilkan daftar produk (hanya dapat diakses oleh pengguna yang sudah login)
    Route::get('/products', [ProductController::class, 'index'])->name('products.index')->middleware('auth');
    
    // Route untuk menampilkan formulir tambah produk (hanya dapat diakses oleh pengguna yang sudah login)
    Route::get('/products/create', [ProductController::class, 'create'])->name('products.create')->middleware('auth');
    
    // Route untuk menyimpan produk baru (hanya dapat diakses oleh pengguna yang sudah login)
    Route::post('/products', [ProductController::class, 'store'])->name('products.store')->middleware('auth');
    
    // ... (lanjutkan dengan route-route lainnya)
    

    Dengan menambahkan middleware auth, route tersebut hanya akan diakses oleh pengguna yang sudah login. Jika pengguna belum login, mereka akan diarahkan ke halaman login.

  2. Tambahkan Otentikasi pada Controller (Opsional):

    Jika Anda ingin memastikan bahwa pengguna yang mencoba mengakses metode-metode di ProductController juga sudah login, Anda dapat menambahkan middleware auth di dalam konstruktor controller:

    namespace App\Http\Controllers;
    
    use Illuminate\Http\Request;
    
    class ProductController extends Controller
    {
        public function __construct()
        {
            $this->middleware('auth');
        }
    
        // ... (metode-metode controller lainnya)
    }

    Dengan menambahkan middleware auth pada konstruktor controller, semua metode dalam ProductController akan memerlukan otentikasi pengguna.

Dengan langkah-langkah di atas, route-route yang membutuhkan otentikasi akan otomatis melindungi aksesnya. Pengguna yang belum login akan diarahkan ke halaman login. Pastikan juga bahwa Anda telah mengonfigurasi otentikasi pengguna (misalnya, dengan menggunakan tabel pengguna, fungsi hash password, dll.) di aplikasi Laravel Anda.

Di bab berikutnya akan belajar cara membuat pagination di project yang telah dibuat.

program lengkapnya bisa dilihat dibawah:

Last updated