← Kembali ke materi
Latihan · Laravel Dasar

Component kartu menu

Menyiapkan Laravel… hanya lama di kunjungan pertama.

Latihan paling nyaman dikerjakan di laptop.

Instruksi

Kartu menu nanti dipakai di beberapa halaman: daftar menu, menu hemat, dan pencarian. Kita jadikan component supaya cukup ditulis sekali.

  1. Buat resources/views/components/menu-card.blade.php dengan @props(['menu']). Isinya <article class="menu-card"> berisi:
    • nama sebagai link (class="menu-card__name")
    • deskripsi (menu-card__desc)
    • harga (menu-card__price)
    • badge Habis kalau tidak tersedia
  2. Di menu/index.blade.php, bungkus perulangan dengan <div class="menu-grid">, dan tampilkan setiap menu dengan <x-menu-card :menu="$menu" />.

Kode

Hasil

Tekan Jalankan untuk melihat halaman.