Selanjutnya kita akan membahas mengenai controller, penjelasan detailnya bis di cek pada
Dalam konteks Laravel, controller adalah kelas PHP yang bertanggung jawab untuk memproses permintaan HTTP dari pengguna dan mengembalikan respons yang sesuai. Controller menyatukan logika aplikasi dan memastikan bahwa permintaan dari pengguna diarahkan dengan benar ke model yang sesuai atau ke tampilan yang tepat.
Model dalam Laravel adalah representasi dari tabel database. Dengan menggunakan model, pengembang dapat melakukan operasi-operasi database seperti membuat, membaca, mengupdate, dan menghapus data dengan sangat mudah dan efisien.
Langsung saja buka file StudentsController.php pada folder App/Http/Controller, selanjutnya tulis code berikut :
public function index()
{
return view('students')->with([
'students' => Students::all(),
]);
}Penjelasan :
public function index() {}: Fungsiindexdideklarasikan dalam kontroler. Biasanya fungsi ini digunakan untuk menampilkan daftar semua data tertentu, dalam hal ini data dari semua “Students”.return view('students'): Kode ini mengembalikan tampilan yang bernama ‘students’. Tampilan ini adalah halaman yang akan dilihat user saat fungsi ini dijalankan.->with([ 'students' => Students::all(), ]): Bagian ini mengirimkan data ke tampilan yang sedang dilihat. Fungsiwithdalam Laravel digunakan untuk meneruskan data ke tampilan.'students' => Students::all(),: Berarti kita memberikan array assosiatif ke methodwith, dimana ‘students’ adalah nama kunci yang akan digunakan di tampilan untuk mengakses data ini, danStudents::all()adalah operasi yang dipanggil pada model EloquentStudentsuntuk mendapatkan semua data siswa yang ada dalam database.
Jadi dalam konteks lengkap, fungsi index ini mengambil semua data siswa dari database dan mengirimkannya ke tampilan ‘students’ yang akan digunakan untuk menampilkan data siswa tersebut.
Lalu lengkapi code pada file web.php sebagai berikut :
// menampilkan data
Route::get('/students', [StudentsController::class, 'index'])->name('students');Penjelasan :
Route::get('/students', [StudentsController::class, 'index'])->name('students');
Route::get('/students',: Ini adalah bagian dari Route API Laravel, yaitu cara Laravel untuk mendefinisikan rute baru untuk aplikasi web Anda.getmengacu pada metode HTTP GET yang Paling Sering digunakan untuk mengambil sumber daya dari server. ‘/students’ adalah URL atau jalur tempat pengguna akan terhubung ketika mereka mengetik ‘www.yourwebsite.com/students’ di web browser mereka.[StudentsController::class, 'index']): Ini menunjukkan bahwa ketika pengguna menavigasi ke ‘/students’, maka metodeindexdariStudentsControllerakan dipanggil.->name('students');: Menamai rute sangat bermanfaat jika Anda perlu merujuk ke rute khusus di tempat lain di aplikasi web Anda. Anda hanya perlu merujuk ke nama rute dan Laravel akan mengetahui URL yang harus digunakan. Dalam hal ini, rute dinamai ‘students’.
Secara keseluruhan, kode ini menginstruksikan Laravel untuk memanggil metode index pada StudentsController ketika seseorang mengakses ‘www.yourwebsite.com/students’ dan memberi nama ‘students’ ke rute ini untuk merujuk dengan mudah di tempat lain.
Selanjutnya kita akan menambahkan beberapa data didalam database sebagai berikut :
Lalu buka file students.blade.php dan tulislah code berikut :
<x-app-layout>
<x-slot name="header">
<h2 class="font-semibold text-xl text-gray-800 leading-tight">
{{ __('Students') }}
</h2>
</x-slot>
<div class="py-12">
<div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
<div class="bg-white overflow-hidden shadow-sm sm:rounded-lg p-3">
<div class="p-2 text-gray-900">
<h4>Students Data</h4>
</div>
<div class="card">
<div class="card-body">
<table class="table table-sm table-striped table-bordered">
<thead>
<tr>
<th>No</th>
<th>Id Students</th>
<th>Full Name</th>
<th>Genre</th>
<th>Adress</th>
<th>Email</th>
<th>Phone</th>
<th>Action</th>
</tr>
</thead>
<tbody>
@foreach ($students as $row)
<tr>
<th>{{ $loop->iteration }}</th>
<td>{{ $row->idstudents }}</td>
<td>{{ $row->fullname }}</td>
<td>{{ $row->gender == 'M' ? 'Male' : 'Female' }}</td>
<td>{{ $row->address }}</td>
<td>{{ $row->emailaddress }}</td>
<td>{{ $row->phone }}</td>
<td>
<i class="fa fa-pencil-square-o" aria-hidden="true" > |
<i class="fa fa-trash" aria-hidden="true"></i>
</td>
</tr>
@endforeach
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</x-app-layout>
Penjelasan :<thead>: Ini adalah elemen HTML yang digunakan untuk membungkus baris tabel (<tr>) yang berisi sel header tabel (<th>). Biasanya berfungsi sebagai judul kolom dari tabel.<tr>adalah singkatan dari table row. Ini digunakan untuk mendefinisikan baris dalam tabel HTML.<th>adalah singkatan dari table head. Ini digunakan untuk mendefinisikan sel header dalam tabel HTML. Sel header adalah sel yang berfungsi sebagai judul kolom."No","Id Students","Full Name","Genre","Address","Email","Phone", dan"Action"adalah teks yang akan ditampilkan dalam sel header tabel tersebut.
Jadi secara keseluruhan, kode ini mendefinisikan header tabel dengan kolom “No”, “Id Students”, “Full Name”, “Genre”, “Address”, “Email”, “Phone”, dan “Action”.
<tbody>: Ini digunakan untuk mendefinisikan bagian tubuh dari tabel HTML yang berisi baris dan kolom data.@foreach ($students as $row) ... @endforeach: Kode ini merupakan loop dalam Laravel Blade yang berfungsi untuk mengulangi elemen dalam array$students. Setiap iterasi, sebuah elemen daristudentsdiarahkan ke variabel$row.<tr>: Ini digunakan untuk membuat baris baru dalam tabel untuk setiap pengulangan.<th>{{ $loop->iteration }}</th>: Ini menampilkan nomor iterasi untuk setiap pengulangan.$loopadalah variabel khusus Laravel yang tersedia dalam lingkup setiap foreach, yang memuat informasi tentang loop saat ini.<td>{{ $row->xxx }}</td>:<td>digunakan untuk membuat kolom data dalam suatu baris tabel.{{ $row->xxx }}adalah sintaks Laravel Blade yang digunakan untuk menampilkan data dari variabel$rowdengan xxx sebagai properti dari objek$row.{{ $row->gender == 'M' ? 'Male' : 'Female' }}: Ini adalah operan kondisi ternary dalam PHP. Jika jenis kelamin mahasiswa adalah ‘M’, maka ‘Male’ akan ditampilkan, jika bukan, maka ‘Female’.<i class="fa fa-pencil-square-o" aria-hidden="true"></i>dan<i class="fa fa-trash" aria-hidden="true"></i>: Ini adalah ikon berkelas Font Awesome yang bisa digunakan untuk berbagai aksi seperti edit (pensil) dan delete (trash).
Secara keseluruhan, kode ini membuat tabel datanya, lalu me-loop array $students untuk menampilkan setiap mahasiswa pada barisnya sendiri.
NOTE :
Jika tampilan website berantakan jangan lupa untuk menambahkan link css dan icon pada file app.blade.php pada folder layouts.
<!-- Fonts -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="preconnect" href="https://fonts.bunny.net">
<link href="https://fonts.bunny.net/css?family=figtree:400,500,600&display=swap" rel="stylesheet" />
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous">
<!-- Scripts -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL" crossorigin="anonymous"></script>
@vite(['resources/css/app.css', 'resources/js/app.js'])Hasilnya adalah sebagai berikut :
