Tutorial Laravel 11 #5: Menampilkan Data dari Database

-

Halo teman-teman semuanya! Selamat datang kembali di seri tutorial "Tutorial Laravel 11 untuk Pemula". Di part kelima ini, kita akan mempelajari bagaimana cara Menampilkan Data dari Database di Laravel 11. Pada tahap ini, kita akan mengambil data dari tabel database menggunakan model, mengirimkan data tersebut melalui controller, dan menampilkannya di view.

Jika part sebelumnya adalah tentang membuat model, controller, dan route, sekarang kita akan mulai melihat bagaimana data yang kita simpan di database dapat muncul di aplikasi kita.

Apa Itu Menampilkan Data di Laravel?

Secara sederhana, proses menampilkan data berarti:

  1. Mengambil data dari database melalui Model.
  2. Memproses data tersebut di Controller.
  3. Mengirim data ke View untuk ditampilkan ke pengguna.

Bayangkan kita memiliki sebuah katalog produk di toko online. Model adalah gudang tempat semua produk disimpan, controller adalah manajer gudang yang mengambil barang sesuai permintaan, dan view adalah etalase toko tempat barang tersebut dipajang agar bisa dilihat oleh pembeli.

Langkah-Langkah Menampilkan Data dari Database

1. Mengambil Data Menggunakan Model

Buka file ProductController yang telah kita buat di part sebelumnya. Tambahkan kode untuk mengambil data dari tabel products menggunakan model Product.

<?php namespace App\Http\Controllers; use App\Models\Product; // Import model Product use Illuminate\Http\Request; class ProductController extends Controller { public function index() { // Mengambil semua data dari tabel products $products = Product::all(); // Mengirim data ke view return view('products.index', ['products' => $products]); } }
Penjelasan:
  • Product::all(): Digunakan untuk mengambil semua data dari tabel products.
  • ['products' => $products]: Data yang diambil disimpan dalam variabel $products dan dikirimkan ke view dalam bentuk array.

2. Menyesuaikan View

Sekarang, buka file resources/views/products/index.blade.php. Kita akan menambahkan Bootstrap untuk membuat tampilan tabel lebih menarik.

Tambahkan link CDN Bootstrap di bagian <head> file kita, dan modifikasi isi file menjadi seperti ini:

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Daftar Produk</title> <!-- CDN Bootstrap --> <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"> </head> <body style="background-color: #f3f4f6;"> <div class="container mt-5 p-4 bg-white rounded shadow"> <h1 class="mb-4 text-center">Daftar Produk</h1> <!-- Tabel Produk --> <table class="table table-striped table-bordered rounded"> <thead class="table-dark"> <tr> <th>#</th> <th>Gambar</th> <th>Nama Produk</th> <th>Deskripsi</th> <th>Harga</th> </tr> </thead> <tbody> @if ($products->isEmpty()) <tr> <td colspan="5" class="text-center text-muted">Tidak ada produk yang tersedia.</td> </tr> @else @foreach ($products as $product) <tr> <td>{{ $loop->iteration }}</td> <td> <img src="{{ $product->image }}" alt="{{ $product->name }}" class="img-thumbnail" width="100"> </td> <td>{{ $product->name }}</td> <td>{{ $product->description }}</td> <td>Rp {{ number_format($product->price, 0, ',', '.') }}</td> </tr> @endforeach @endif </tbody> </table> </div> </body> </html>
Penjelasan:
  • @if($products->isEmpty()): Mengecek apakah tabel products kosong.
  • @foreach($products as $product): Looping untuk menampilkan setiap data produk.
  • $loop->iteration: Memberikan nomor urut otomatis untuk setiap baris.
  • number_format: Format angka harga menjadi format rupiah (contoh: 15,000,000).

Jika sudah, silakan akses dan hasilnya akan menjadi seperti ini

Pada hasil di atas, tidak ada produk yang tersedia, karena memang belum ada data di database kita. Pada part selanjutnya, kita akan membuat fitur add data, maka nanti otomatis datanya langsung tampil di table atas yang sudah kita buat.

Kesimpulan

Pada part ini, kita telah belajar cara menampilkan data dari database di Laravel 11, mulai dari mengambil data melalui model, memprosesnya di controller, hingga menampilkannya di view. Langkah ini sangat penting karena data yang ditampilkan kepada user adalah salah satu inti dari sebuah aplikasi.

Semoga tutorial ini membantu teman teman semakin memahami Laravel. Sampai jumpa di part berikutnya, di mana kita akan mempelajari cara menambah data ke database.


Artikel ini dibaca sebanyak209kali

#Laravel

About Author

Fullstack Developer at Media Koding

Brian Harris

Follow me on