Rumahweb Journal
banner - belajar laravel bagian 7

Belajar Laravel Part 7: CRUD Menampilkan Data Dari Database

Pada sesi belajar Laravel bagian 6, kita telah mempelajari cara membuat tampilan maintenance mode. Dalam lanjutan belajar laravel bagian ke 7 ini, kita akan melanjutkan dengan mempelajari CRUD di Laravel. Artikel ini akan membahas cara membuat CRUD untuk menampilkan data dari database menggunakan Laravel.

Suatu website memiliki 4 fungsi dasar yang menjadikannya menarik dan informatif. Empat fungsi dasar tersebut yaitu membuat, mengubah, menghapus dan menampilkan data, hingga tampilan website yang dinamis dan informatif. 4 Fungsi dasar tersebut sering disingkat sebagai CRUD.

Apa itu CRUD?

CRUD adalah singkatan dari Create, Read, Update, dan Delete. Di Laravel sendiri, untuk membuat CRUD bisa dilakukan dengan 2 cara, yaitu menggunakan Query Builder atau menggunakan Eloquent.

Supaya lebih mudah dalam mempelajarinya, pada artikel ini kami akan membahas cara membuat CRUD di Laravel menggunakan Query Builder. Untuk cara membuat CRUD menggunakan Eloquent, akan dibahas dilain waktu.

Selengkapnya tentang CRUD bisa Anda pelajari di artikel berikut: Apa Itu CRUD?

Membuat CRUD menggunakan Query Builder

Pada sesi belajar Laravel CRUD kali ini, kita sedikit mengulang pembelajaran di pertemuan ke 3 sebelumnya, tentang membuat database.

Promo Hosting Murah Rumahweb

Step 1. Membuat Database di phpMyAdmin

Silakan Anda membuat database di locahost melalui PHPMyAdmin. Sebagai contoh, kami membuat database dengan nama dbrw-laraveltutorial.

Step 2. Isi Sample Data

Setelah itu, silakan inputkan script berikut dikolom SQL, untuk membuat table dan mengisi sample datanya.

-- phpMyAdmin SQL Dump
-- version 5.2.1
-- https://www.phpmyadmin.net/
--
-- Host: localhost:3306
-- Waktu pembuatan: 18 Nov 2024 pada 02.32
-- Versi server: 8.0.30
-- Versi PHP: 8.3.9

SET SQL_MODE = "NO_AUTO_VALUE_ON_ZERO";
START TRANSACTION;
SET time_zone = "+00:00";


/*!40101 SET @OLD_CHARACTER_SET_CLIENT=@@CHARACTER_SET_CLIENT */;
/*!40101 SET @OLD_CHARACTER_SET_RESULTS=@@CHARACTER_SET_RESULTS */;
/*!40101 SET @OLD_COLLATION_CONNECTION=@@COLLATION_CONNECTION */;
/*!40101 SET NAMES utf8mb4 */;

--
-- Database: `dbrw-laraveltutorial`
--

-- --------------------------------------------------------

--
-- Struktur dari tabel `pegawai`
--

CREATE TABLE `pegawai` (
  `pegawai_id` int NOT NULL,
  `pegawai_nama` text NOT NULL,
  `pegawai_jabatan` text NOT NULL,
  `pegawai_umur` int NOT NULL,
  `pegawai_alamat` varchar(1000) NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_0900_ai_ci;

--
-- Dumping data untuk tabel `pegawai`
--

INSERT INTO `pegawai` (`pegawai_id`, `pegawai_nama`, `pegawai_jabatan`, `pegawai_umur`, `pegawai_alamat`) VALUES
(1, 'Rudi', 'Web Designer', 25, 'Jl. Jogja'),
(3, 'Gawati Yulia Yuliarti', 'Belum / Tidak Bekerja', 39, 'Psr. Jend. Sudirman No. 876, Salatiga 94485, Sulsel'),
(4, 'Shakila Unjani Sudiati S.Pd', 'Belum / Tidak Bekerja', 37, 'Ki. Gotong Royong No. 646, Sukabumi 30063, Sulut'),
(5, 'Cinthia Sudiati', 'Biarawati', 35, 'Dk. Dahlia No. 270, Pagar Alam 27372, Sulut'),
(6, 'Gamani Budiman', 'Tukang Cukur', 31, 'Dk. Madiun No. 162, Padang 84417, NTB'),
(7, 'Kamaria Nurdiyanti', 'Konsultan', 40, 'Gg. Cut Nyak Dien No. 315, Pagar Alam 16040, NTB'),
(8, 'Cakrabuana Sitompul S.E.', 'Petani / Pekebun', 27, 'Kpg. Bayan No. 121, Surakarta 95950, DKI'),
(9, 'Paramita Ilsa Widiastuti', 'Penyiar Televisi', 29, 'Ki. Nanas No. 510, Tebing Tinggi 39880, Babel'),
(10, 'Lidya Aisyah Uyainah S.Gz', 'Penata Busana', 32, 'Ds. Jaksa No. 818, Payakumbuh 16409, Pabar'),
(11, 'Oni Rahimah', 'Penata Rias', 25, 'Jln. Industri No. 231, Langsa 99305, Sumbar'),
(12, 'Karen Astuti', 'Desainer', 26, 'Ds. R.M. Said No. 149, Cirebon 24653, Pabar'),
(13, 'Kajen Wasita', 'Penulis', 36, 'Dk. Gajah No. 836, Ambon 15105, Gorontalo'),
(14, 'Lintang Farida S.E.', 'Pedagang', 33, 'Dk. Moch. Toha No. 723, Bontang 86180, Jateng'),
(15, 'Jumari Cengkal Simbolon', 'Wakil Presiden', 28, 'Ki. Bagis Utama No. 784, Bengkulu 27766, Sulteng'),
(16, 'Laras Melani', 'Apoteker', 36, 'Ds. Sukajadi No. 367, Yogyakarta 53106, Malut'),
(17, 'Siti Puspasari', 'Pelaut', 38, 'Psr. Banceng Pondok No. 6, Sabang 96597, Kaltim'),
(18, 'Nadia Hartati', 'Penata Rambut', 37, 'Gg. Katamso No. 18, Tidore Kepulauan 92688, Aceh'),
(19, 'Puput Cici Lailasari S.T.', 'Psikiater / Psikolog', 37, 'Kpg. Baranangsiang No. 12, Tidore Kepulauan 36147, Bengkulu'),
(20, 'Zaenab Safitri', 'Buruh Nelayan / Perikanan', 34, 'Kpg. Gajah Mada No. 825, Padangsidempuan 17341, Kalbar'),
(21, 'Arsipatra Hutasoit', 'Promotor Acara', 25, 'Ds. Salak No. 439, Bitung 97331, Maluku'),
(22, 'Ajimat Dongoran S.Kom', 'Pegawai Negeri Sipil (PNS)', 26, 'Kpg. Kalimantan No. 88, Lhokseumawe 55880, Pabar'),
(23, 'Sabar Utama', 'Penyiar Radio', 26, 'Ki. Baya Kali Bungur No. 349, Bitung 19647, Sulteng'),
(24, 'Gandi Asmuni Firmansyah S.I.Kom', 'Penerjemah', 32, 'Jr. Pelajar Pejuang 45 No. 346, Pekalongan 59404, Bengkulu'),
(25, 'Dadi Daniswara Marpaung S.IP', 'Tukang Gigi', 32, 'Jln. Kiaracondong No. 119, Bau-Bau 79924, Sumut'),
(26, 'Putri Widiastuti', 'Programmer', 35, 'Psr. Gotong Royong No. 493, Palu 75920, Papua');

--
-- Indexes for dumped tables
--

--
-- Indeks untuk tabel `pegawai`
--
ALTER TABLE `pegawai`
  ADD PRIMARY KEY (`pegawai_id`);

--
-- AUTO_INCREMENT untuk tabel yang dibuang
--

--
-- AUTO_INCREMENT untuk tabel `pegawai`
--
ALTER TABLE `pegawai`
  MODIFY `pegawai_id` int NOT NULL AUTO_INCREMENT, AUTO_INCREMENT=53;
COMMIT;

/*!40101 SET CHARACTER_SET_CLIENT=@OLD_CHARACTER_SET_CLIENT */;
/*!40101 SET CHARACTER_SET_RESULTS=@OLD_CHARACTER_SET_RESULTS */;
/*!40101 SET COLLATION_CONNECTION=@OLD_COLLATION_CONNECTION */;

Step 3. Sesuaikan Config Database

Lakukan pengaturan config database di file .env.

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=dbrw-laraveltutorial
DB_USERNAME=root
DB_PASSWORD=

Keterangan:

  • DB_Database adalah nama database yang telah Anda buat.
  • DB_Username adalah nama user databasenya. Secara default berisi root. 
  • DB_Password  adalah password databasenya. Biasanya di localhost kosong

Step 4. Routing

Sesuaikan Route yang berada di routes/web.php untuk mengakses controller PegawaiController

use Illuminate\Support\Facades\DB;
use App\Http\Controllers\PegawaiController;

// Route untuk menampilkan data Pegawai
Route::get('/pegawai', [PegawaiController::class, 'index']);

Keterangan Pada script diatas, saat route ‘/pegawai’ diakses maka kita akan dibawa ke method index() pada PegawaiController.

Step 5. Controller

Selanjutnya membuat PegawaiController menggunakan perintah artisan berikut.


php artisan make:controller PegawaiController

Letak filenya ada di app/Http/Controllers/PegawaiController.php. Isi file PegawaiController.php menggunakan code berikut.

<?php

namespace App\Http\Controllers;

use Illuminate\Support\Facades\DB;
use Illuminate\Http\Request;

class PegawaiController extends Controller
{
    public function index()
    {
        // Mengambil semua data pegawai
        $pegawai = DB::table('pegawai')->get();
        
        // Mengirim data ke view
        return view('pegawai.index', ['pegawai' => $pegawai]);
    }
}

Penjelasan :

Mengambil data pegawai menggunakan perintah:

$pegawai = DB::table('pegawai')->get();

Perintah tersebut merupakan perintah yang mirip dengan select * from pegawai

Selanjutnya datanya dikirim ke view menggunakan perintah:

return view('pegawai.index', ['pegawai' => $pegawai]);

Step 6. View

Selanjutnya, kita akan belajar laravel untuk membuat view untuk menampilkan data Pegawai, letak filenya ada di resources/views/pegawai/index.blade.php. Pastikan setelah folder Views Anda membuat folder pegawai. Nantinya letak file index.blade.php berada di dalam folder pegawai.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Data Pegawai</title>
</head>
<body>

<h3>Data Pegawai</h3>
 
	<a href="/pegawai/tambah"> + Tambah Pegawai Baru</a>
	
	<br/>
	<br/>


    <table border="1">
        <thead>
            <tr>
                <th>ID</th>
                <th>Nama</th>
                <th>Alamat</th>
            </tr>
        </thead>
        <tbody>
            @foreach($pegawai as $p)
                <tr>
                    <td>{{ $p->pegawai_id }}</td>
                    <td>{{ $p->pegawai_nama }}</td>
                    <td>{{ $p->pegawai_alamat }}</td>
<td>
				<a href="/pegawai/edit/{{ $p->pegawai_id }}">Edit</a>
				|
				<a href="/pegawai/hapus/{{ $p->pegawai_id }}">Hapus</a>
			</td>

                </tr>
            @endforeach
        </tbody>
    </table>
</body>
</html>

Penjelasan

($pegawai as $p) : data yang dikirim controller ke view ditangkap sebagai $pegawai. Selanjutnya untuk memudahkan penulisan $pegawai dimisalkan sebagai $p

Selanjutnya dilakukan perulangan menggunakan foreach.

Step 7. Jalankan Aplikasi Laravel

Untuk menjalankan aplikasi Laravel di localhost menggunakan perintah artisan.

php artisan serve

Akses aplikasi di browser dengan URL: http://localhost:8000/pegawai

data pegawai - belajar laravel CRUD

Selamat, sampai disini data Anda sudah tampil. Untuk panduan CRUD lainnya akan kami tulis di edisi artikel selanjutnya.

Demikian tutorial belajar Laravel bagian ke 7 tentang CRUD. Semoga dengan memahami CRUD, anda dapat membuat website yang menarik dan informatif. Simak terus sesi belajar laravel selanjutnya. Semoga bermanfaat.

Bermanfaatkah Artikel Ini?

Klik bintang 5 untuk rating!

Rating rata-rata 0 / 5. Vote count: 0

Belum ada vote hingga saat ini!

Kami mohon maaf artikel ini kurang berguna untuk Anda!

Mari kita perbaiki artikel ini!

Beri tahu kami bagaimana kami dapat meningkatkan artikel ini?

VPS Alibaba

Anggit TS

Selamat membaca, Semoga tulisan saya bermanfaat.
Bila ada salah kata, mohon maaf.

"tak ada gading yang tak retak, maafkan kesalahan keluarga Gajah". :D

banner pop up - Pindah Hosting ke Rumahweb