Friday , March 29 2024

Menampilkan Data Dari Database Codeigniter 4

Menampilkan Data Dari Database Codeigniter 4

lebakcyber.net – Menampilkan data dari database Codeigniter 4. Melanjutkan tutorial mengenai belajar codeigniter 4, pada kesempatan kali ini kita akan membahas mengenai bagaimana cara menampilkan data dari database di codeigniter 4.

Jadi langkah-langkah yang akan kita lakukan pada pembahasan kali ini adalah :

  • Edit File .env
  • Melakukan konfigurasi database
  • Mengimport database
  • Membuat Model
  • Membuat Controller
  • Membuat View

Edit File .env

Langkah pertama yang harus kita lakukan adalah merubah file .env yang ada pada baris 17 menghapus komentarnya dan ubah menjadi development seperti dibawah ini :

CI_ENVIRONMENT = development

Melakukan Konfigurasi Database

Pada tutorial belajar codeigniter 4 yang sebelumnya pernah kita bahas, kita sudah mempelajari tentang bagaimana cara melakukan konfigurasi atau setting database di codeigniter. Dan pada tutorial ini kita akan mencoba konfigurasi database melalui file .env dan silahkan ubah datanya sesuai dengan settingan kalian masing-masing.

#--------------------------------------------------------------------
# DATABASE
#--------------------------------------------------------------------

database.default.hostname = localhost
database.default.database = pelanggan
database.default.username = root
database.default.password = 
database.default.DBDriver = MySQLi

Pada konfigurasi database diatas saya menggunakan database dengan nama pelanggan yang nantinya akan kita gunakan pada tutorial seri belajar codeigniter 4 ini.

Mengimport Database

Selanjutnya kita lakukan proses import pada database pelanggan tersebut, silahkan eksekusi query sql dibawah ini agar lebih memudahkan kalian dalam mengikuti tutorial kali ini pada codeigniter 4 :

create table `biodata` (
    `nik` int (12),
    `nama` varchar (150),
    `alamat` varchar (450),
    `no_telp` int (12)
); 
insert into `biodata` (`nik`, `nama`, `alamat`, `no_telp`) values('10108823','Firdan Ardiansyah','Potlot','2147483647');
insert into `biodata` (`nik`, `nama`, `alamat`, `no_telp`) values('10108824','Kaka','BTN. Palaton','2147483647');
insert into `biodata` (`nik`, `nama`, `alamat`, `no_telp`) values('10108825','Ridho','Kuningan','2147483647');
insert into `biodata` (`nik`, `nama`, `alamat`, `no_telp`) values('10108826','Abdee','Mampang Prapatan','2147483647');
insert into `biodata` (`nik`, `nama`, `alamat`, `no_telp`) values('10108827','Bimbim','Thamrin','2147483647');

Membuat Model

Langkah selanjutnya adalah membuat Model di Codeigniter 4. Silahkan buat model dengan nama Model_Biodata.php pada folder app/Models/Model_Biodata.php agar dapat melakukan pemrosesan data pada database dengan codeigniter 4. Selanjutnya masukan perintah dibawah ini :

<?php

namespace App\Models;

use CodeIgniter\Model;

class Model_Biodata extends Model
{
    protected $table = 'biodata';

    public function getBiodata()
    {
        return $this->findAll();
    }
}

Membuat Controller

Setelah kita membuat model, langkah selanjutnya adalah membuat Controller yang nantinya akan kita gunakan untuk memanggil url pada web yang kita buat dan juga untuk mengarahkan kemana nantinya view akan ditampilkan.

Buat sebuah controller baru dengan nama Biodata pada folder App/Controllers/Biodata.php lalu tambahkan perintah seperti dibawah ini :

<?php

namespace App\Controllers;

use App\Models\Model_Biodata;

class Biodate extends BaseController
{
    public function index()
    {
        $biodata = new Model_Biodata();
        $data = $biodata->getBiodata();
        return view('biodata', compact('data'));
    }
}

Membuat View biodata

Selanjutnya kita akan membuat view biodata yang akan kita gunakan untuk menampilkan data dari database kepada user atau pengguna. Silahkan buat file biodata.php pada folder app/Views/biodata.php lalu masukan perintah dibawah ini :

<!doctype html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="jaranguda.com tutorial codeigniter4">
    <title>lebakcyber.net</title>

    <!-- Bootstrap core CSS -->
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
    <style>
        body {
            padding-top: 5rem;
        }
    </style>
</head>

<body>
    <nav class="navbar navbar-expand-md navbar-dark bg-dark fixed-top">
        <a class="navbar-brand" href="#">Navbar</a>
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsExampleDefault" aria-controls="navbarsExampleDefault" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
        </button>

        <div class="collapse navbar-collapse" id="navbarsExampleDefault">
            <ul class="navbar-nav mr-auto">
                <li class="nav-item active">
                    <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
                </li>
            </ul>
        </div>
    </nav>

    <main role="main" class="container-fluid">

        <h1>Menampilkan Data Dari Database Codeigniter 4</h1>
        <hr>

        <table class="table">
            <tt>
                <th>NIK</th>
                <th>Nama</th>
                <th>Alamat</th>
                <th>No. Telepon</th>
                <th>Aksi</th>
                </tr>

                <?php
                foreach ($data as $biodata) {
                ?>
                    <tr>
                        <td><?php echo $biodata['nik'] ?></td>
                        <td><?php echo $biodata['nama']; ?></td>
                        <td><?php echo $biodata['alamat']; ?></td>
                        <td><?php echo $biodata['no_telp']; ?></td>
                        <td>
                            <a href="#" class="btn btn-info btn-sm btn-edit">Edit</a>
                            <a href="#" class="btn btn-danger btn-sm btn-delete">Delete</a>
                        </td>
                    </tr>
                <?php
                }
                ?>
        </table>

    </main><!-- /.container -->
</body>

</html>

 

Sekarang coba kita jalankan, buka terminal di visual studio code lalu masukan perintah :

php spark serve

Akses melalui browser di alamat localhost:8080/biodata, nanti tampilannya akan seperti pada gambar dibawah ini :

Menampilkan Data Dari Database Codeigniter 4

Oke sampai sini kita sudah berhasil pembelajaran kita mengenai cara menampilkan database ke codeigniter 4. Semoga tutorial sederhana ini bisa bermanfaat dan sampai jumpa pada tutorial seri belajar Codeigniter 4 selanjutnya.

About Firdan Ardiansyah

Admin di lebakcyber.net Untuk berhubungan dengan saya, silahkan kirim email ke : firdan@lebakcyber.net

Leave a Reply

Your email address will not be published. Required fields are marked *