[{"data":1,"prerenderedAt":95},["ShallowReactive",2],{"\u002Fposts\u002Fcontroller-read-data-menampilkan-produk?{\"username\":\"irezabdullah\"}":3},{"success":4,"message":5,"data":6},true,"Post retrieved successfully",{"post":7,"seriesInfo":25,"seriesItems":28,"seoDescription":94},{"id":8,"title":9,"slug":10,"body":11,"cover_image_path":12,"view_count":13,"part_number":14,"created_at":15,"updated_at":16,"category":17,"author":20},53,"Controller & Read Data (Menampilkan Produk)","controller-read-data-menampilkan-produk","### 🎯Tujuan\n\nMampu membuat **Controller** dan menampilkan data produk dari database ke halaman web menggunakan Blade.\n\n---\n\n### Materi & Langkah Praktik\n\n#### 1. Membuat Controller\n\nController digunakan sebagai jembatan antara **Model** dan **View**.\nController menerima permintaan (request), mengambil data dari database melalui model, kemudian mengirimkannya ke tampilan (Blade).\n\nJalankan perintah berikut untuk membuat controller baru:\n\n```bash\nphp artisan make:controller ProductController\n```\n\nLaravel akan membuat file controller di folder:\n\n```\napp\u002FHttp\u002FControllers\u002FProductController.php\n```\n\n---\n\n#### 2. Tambahkan Method `index` di `ProductController`\n\nMethod `index()` bertugas mengambil semua data dari database lalu mengirimkannya ke view.\n\nBuka file:\n\n```\napp\u002FHttp\u002FControllers\u002FProductController.php\n```\n\nIsi method-nya seperti berikut:\n\n```php\n\u003C?php\n\nnamespace App\\Http\\Controllers;\n\nuse App\\Models\\Product;\n\nclass ProductController extends Controller\n{\n    public function index()\n    {\n        $products = Product::all(); \u002F\u002F ambil semua data produk\n        return view('products.index', compact('products'));\n    }\n}\n```\n\n**Penjelasan tambahan yang mudah dipahami:**\n\n* `Product::all()` → mengambil seluruh data dari tabel `products`.\n* Variabel `$products` berisi daftar produk dalam bentuk collection.\n* `view('products.index', compact('products'))` → mengirim data ke file Blade `index.blade.php`.\n* `compact('products')` adalah cara singkat untuk membuat array `['products' => $products]`.\n\nDengan ini, file Blade nanti dapat mengakses variabel `$products`.\n\n---\n\n#### 3. Tambahkan Route\n\nUntuk mengakses halaman `\u002Fproducts`, perlu membuat route yang mengarah ke method `index()` di controller.\n\nBuka file:\n\n```\nroutes\u002Fweb.php\n```\n\nTambahkan:\n\n```php\nuse App\\Http\\Controllers\\ProductController;\n\nRoute::get('\u002Fproducts', [ProductController::class, 'index'])->name('products.index');\n```\n\n**Penjelasan:**\n\n* `Route::get('\u002Fproducts', ...)` → ketika URL `\u002Fproducts` diakses, jalankan fungsi tertentu.\n* `[ProductController::class, 'index']` → arahkan permintaan ke `ProductController@index`.\n* `->name('products.index')` → memberikan nama route agar mudah dipanggil dari Blade nantinya.\n\n---\n\n#### 4. Buat Folder & File View\n\nView adalah file HTML yang digunakan untuk menampilkan data kepada pengguna.\n\nBuat file berikut:\n\n```\nresources\u002Fviews\u002Fproducts\u002Findex.blade.php\n```\n\nIsi file view:\n\n```html\n@extends('layouts.main')\n\n@section('title', 'Daftar Produk')\n\n@section('content')\n\u003Cdiv class=\"d-flex justify-content-between align-items-center mb-3\">\n    \u003Ch2>Daftar Produk\u003C\u002Fh2>\n    \u003Ca href=\"#\" class=\"btn btn-primary btn-sm disabled\">+ Tambah Produk (belum aktif)\u003C\u002Fa>\n\u003C\u002Fdiv>\n\n\u003Ctable class=\"table table-striped table-bordered\">\n    \u003Cthead class=\"table-dark\">\n        \u003Ctr>\n            \u003Cth>No\u003C\u002Fth>\n            \u003Cth>Nama Produk\u003C\u002Fth>\n            \u003Cth>Harga\u003C\u002Fth>\n            \u003Cth>Stok\u003C\u002Fth>\n            \u003Cth>Deskripsi\u003C\u002Fth>\n        \u003C\u002Ftr>\n    \u003C\u002Fthead>\n    \u003Ctbody>\n        @forelse ($products as $index => $product)\n            \u003Ctr>\n                \u003Ctd>{{ $index + 1 }}\u003C\u002Ftd>\n                \u003Ctd>{{ $product->name }}\u003C\u002Ftd>\n                \u003Ctd>Rp {{ number_format($product->price, 0, ',', '.') }}\u003C\u002Ftd>\n                \u003Ctd>{{ $product->stock }}\u003C\u002Ftd>\n                \u003Ctd>{{ $product->description }}\u003C\u002Ftd>\n            \u003C\u002Ftr>\n        @empty\n            \u003Ctr>\n                \u003Ctd colspan=\"5\" class=\"text-center\">Belum ada data produk.\u003C\u002Ftd>\n            \u003C\u002Ftr>\n        @endforelse\n    \u003C\u002Ftbody>\n\u003C\u002Ftable>\n@endsection\n```\n\n**Penjelasan tambahan yang sangat penting:**\n\n* `@extends('layouts.main')` → menggunakan layout utama `main.blade.php`.\n* `@section('content')` → bagian konten utama halaman.\n* `@forelse` → digunakan untuk looping data namun tetap menangani kondisi kosong.\n* `number_format()` → memformat harga menjadi format rupiah `8500000` → `8.500.000`.\n* Jika data kosong, muncul baris `\"Belum ada data produk.\"`.\n\nDengan struktur ini, halaman produk terlihat rapi dan informatif.\n\n---\n\n#### 5. Jalankan Aplikasi\n\nJalankan server:\n\n```bash\nphp artisan serve\n```\n\nBuka:\n\n👉 [http:\u002F\u002F127.0.0.1:8000\u002Fproducts](http:\u002F\u002F127.0.0.1:8000\u002Fproducts)\n\nJika semua langkah benar, halaman daftar produk akan muncul seperti gambar di bawah ini:\n\n![](https:\u002F\u002Fi.imgur.com\u002FqdD3j20.png)\n\n---\n\n#### Struktur Folder Penting\n\n```\nproject-laravel\u002F\n├── 📁 app\u002F\n│   └── 📁 Http\u002F\n│       └── 📁 Controllers\u002F\n│           └── ProductController.php\n├── 📁 resources\u002F\n│   └── 📁 views\u002F\n│       └── 📁 products\u002F\n│           └── index.blade.php\n├── 📁 routes\u002F\n│   └── web.php\n```\n\n---","https:\u002F\u002Fcdn.rezweb.my.id\u002Fposts\u002FrW666J7ivX4MuEsp71OIFgkwX2d2fTja1eYKfEU1.jpg",871,6,"2025-10-14T16:16:23+07:00","2026-09-07T11:59:38+07:00",{"name":18,"slug":19},"LARAVEL","laravel",{"id":21,"name":22,"username":23,"avatar":24},1,"Irez Abdullah","irezabdullah","https:\u002F\u002Fcdn.rezweb.my.id\u002Favatars\u002Fd139726e-348f-4dab-95c6-bb87e2ad125e.jpeg",{"name":26,"slug":27},"Belajar Laravel dari Nol (Praktikum Web Framework) – Ringkas & Praktis","belajar-laravel-dari-nol-praktikum-web-framework-ringkas-praktis",[29,33,38,43,48,53,54,59,64,69,74,79,84,89],{"id":30,"slug":31,"title":32,"part_number":21},48,"pengenalan-web-framework-instalasi-laravel","Pengenalan Web Framework & Instalasi Laravel",{"id":34,"slug":35,"title":36,"part_number":37},49,"struktur-folder-routing-dasar","Struktur Folder & Routing Dasar",2,{"id":39,"slug":40,"title":41,"part_number":42},50,"blade-template-layouting-dengan-bootstrap-5-dmwo","Blade Template & Layouting dengan Bootstrap 5",3,{"id":44,"slug":45,"title":46,"part_number":47},51,"database-migration-qbsa","Database & Migration",4,{"id":49,"slug":50,"title":51,"part_number":52},52,"model-seeder","Model & Seeder",5,{"id":8,"slug":10,"title":9,"part_number":14},{"id":55,"slug":56,"title":57,"part_number":58},54,"form-tambah-produk-create","Form Tambah Produk (Create)",7,{"id":60,"slug":61,"title":62,"part_number":63},55,"edit-update-produk","Edit & Update Produk",8,{"id":65,"slug":66,"title":67,"part_number":68},56,"hapus-produk-validasi-form","Hapus Produk & Validasi Form",9,{"id":70,"slug":71,"title":72,"part_number":73},63,"upload-file-gambar-dan-validasi-cpw3","Upload File (Gambar) dan Validasi",10,{"id":75,"slug":76,"title":77,"part_number":78},62,"menampilkan-grafik-stok-produk","Menampilkan Grafik Stok Produk",11,{"id":80,"slug":81,"title":82,"part_number":83},64,"login-dan-implementasi-middleware-at","Login Dan Implementasi Middleware",12,{"id":85,"slug":86,"title":87,"part_number":88},61,"membuat-dashboard-admin-dengan-statistik-dan-grafik","Membuat Dashboard Admin dengan Statistik dan Grafik",13,{"id":90,"slug":91,"title":92,"part_number":93},65,"teknik-debugging-di-laravel","Teknik Debugging di Laravel",15,"🎯Tujuan Mampu membuat Controller dan menampilkan data produk dari database ke halaman web menggunakan Blade. Materi & Langkah Praktik Membuat Controller Contro...",1788757407796]