🎯Tujuan

Mampu membuat Controller dan menampilkan data produk dari database ke halaman web menggunakan Blade.

Materi & Langkah Praktik

1. Membuat Controller

Controller digunakan sebagai jembatan antara Model dan View. Controller menerima permintaan (request), mengambil data dari database melalui model, kemudian mengirimkannya ke tampilan (Blade).

Jalankan perintah berikut untuk membuat controller baru:

php artisan make:controller ProductController

Laravel akan membuat file controller di folder:

app/Http/Controllers/ProductController.php

2. Tambahkan Method index di ProductController

Method index() bertugas mengambil semua data dari database lalu mengirimkannya ke view.

Buka file:

app/Http/Controllers/ProductController.php

Isi method-nya seperti berikut:

<?php

namespace App\Http\Controllers;

use App\Models\Product;

class ProductController extends Controller
{
    public function index()
    {
        $products = Product::all(); // ambil semua data produk
        return view('products.index', compact('products'));
    }
}

Penjelasan tambahan yang mudah dipahami:

• Product::all() → mengambil seluruh data dari tabel products.
• Variabel $products berisi daftar produk dalam bentuk collection.
• view('products.index', compact('products')) → mengirim data ke file Blade index.blade.php.
• compact('products') adalah cara singkat untuk membuat array ['products' => $products].

Dengan ini, file Blade nanti dapat mengakses variabel $products.

3. Tambahkan Route

Untuk mengakses halaman /products, perlu membuat route yang mengarah ke method index() di controller.

Buka file:

routes/web.php

Tambahkan:

use App\Http\Controllers\ProductController;

Route::get('/products', [ProductController::class, 'index'])->name('products.index');

Penjelasan:

• Route::get('/products', ...) → ketika URL /products diakses, jalankan fungsi tertentu.
• [ProductController::class, 'index'] → arahkan permintaan ke ProductController@index.
• ->name('products.index') → memberikan nama route agar mudah dipanggil dari Blade nantinya.

4. Buat Folder & File View

View adalah file HTML yang digunakan untuk menampilkan data kepada pengguna.

Buat file berikut:

resources/views/products/index.blade.php

Isi file view:

@extends('layouts.main')

@section('title', 'Daftar Produk')

@section('content')
<div class="d-flex justify-content-between align-items-center mb-3">
    <h2>Daftar Produk</h2>
    <a href="#" class="btn btn-primary btn-sm disabled">+ Tambah Produk (belum aktif)</a>
</div>

<table class="table table-striped table-bordered">
    <thead class="table-dark">
        <tr>
            <th>No</th>
            <th>Nama Produk</th>
            <th>Harga</th>
            <th>Stok</th>
            <th>Deskripsi</th>
        </tr>
    </thead>
    <tbody>
        @forelse ($products as $index => $product)
            <tr>
                <td>{{ $index + 1 }}</td>
                <td>{{ $product->name }}</td>
                <td>Rp {{ number_format($product->price, 0, ',', '.') }}</td>
                <td>{{ $product->stock }}</td>
                <td>{{ $product->description }}</td>
            </tr>
        @empty
            <tr>
                <td colspan="5" class="text-center">Belum ada data produk.</td>
            </tr>
        @endforelse
    </tbody>
</table>
@endsection

Penjelasan tambahan yang sangat penting:

• @extends('layouts.main') → menggunakan layout utama main.blade.php.
• @section('content') → bagian konten utama halaman.
• @forelse → digunakan untuk looping data namun tetap menangani kondisi kosong.
• number_format() → memformat harga menjadi format rupiah 8500000 → 8.500.000.
• Jika data kosong, muncul baris "Belum ada data produk.".

Dengan struktur ini, halaman produk terlihat rapi dan informatif.

5. Jalankan Aplikasi

Jalankan server:

php artisan serve

Buka:

👉 http://127.0.0.1:8000/products

Jika semua langkah benar, halaman daftar produk akan muncul seperti gambar di bawah ini:

Struktur Folder Penting

project-laravel/
├── 📁 app/
│   └── 📁 Http/
│       └── 📁 Controllers/
│           └── ProductController.php
├── 📁 resources/
│   └── 📁 views/
│       └── 📁 products/
│           └── index.blade.php
├── 📁 routes/
│   └── web.php