Skip to content Skip to sidebar Skip to footer

Widget Atas Posting

Home / codeigniter

Tutorial CRUD di Codeigniter 4 Untuk Pemula

By Abdul Aziz Post a Comment
Pada tutorial sebelumnya admin sudah membahas tentang Cara Instalasi Codeigniter 4 dan kali ini admin akan membahas bagaimana cara menampilkan, menambah, mengedit dan menghapus data atau istilahnya adalah CRUD di codeigniter 4 dengan menggunakan database mysql.

Inilah tutorial cara membuat CRUD dengan menggunakan framework Codeigniter 4

CRUD merupakan hal yang sangat basic ketika anda memulai atau mencoba sebuah bahasa pemrograman baru maupun framework baru dengan menggunakan database. Seorang programer yang belajar bahasa pemrograman baru dimulai dari yang basic yaitu mereka belajar membuat CRUD.

CRUD menjadi modal awal bagi programer untuk menguasai sebuah framework, sehingga mereka bisa merabah dan mengembangkannya untuk aplikasi yang mereka buat.

Jika anda belum paham tentang codeigniter 4 dan belum tahu bagaimana cara instalasi codeigniter 4 silahkan anda baca Cara Instalasi Codeigniter 4 

Langsung saja kita kelangkah-langkah tutorial yang pertama yaitu

Membuat Database dan Tabel di MySQL

 Yang belum tahu bagaimana cara membuat database di mysql silahkan anda baca : Cara Membuat database di Mysql dan Cara Membuat Tabel di Database MySQL.

 Query Membuat Database
mysql> create database latihan;
Query OK, 1 row affected (0.05 sec)

Selanjutnya silahkan anda buat tabel di database latihan
mysql> create table biodata (
    -> nik char(10) not null,
    -> nama varchar(64),
    -> hobi varchar(32),
    -> alamat varchar(32),
    -> PRIMARY KEY(nik)
    -> );
Query OK, 0 rows affected (0.09 sec)

Dapatkan file framework Codeigniter 4
  1. Kunjungi situs resminya untuk mendapatkan file codigniter 4 di situs resminya https://codeigniter.com/
  2. Ekstrak file framework codeigniter 4 di root web server anda
  3. Edit folder file codeigniter 4 anda sesuai dengan keinginan anda (folder admin ci-project)
Setelah langkah diatas sudah selesai buka Command Prompt/terminal kemudian masuk kedalam folder project codeigniter 4 yang sudah anda buat tadi. Kemudian ketikan perintah

php spark serve

Perintah diatas digunakan untuk menjalankan codeigniter 4 sehingga di terminal/command promt anda muncul tampilan seperti dibawah ini: 

C:\AppServ\www\ci-project>php spark serve


CodeIgniter CLI Tool - Version 4.0.3 - Server-Time: 2020-05-20 04:03:13am

CodeIgniter development server started on http://localhost:8080
Press Control-C to stop.

Membuat Koneksi Database

Membuat koneksi database di codeigniter 4 ada dua cara yaitu cara pertama dengan dengan menggunakan file env yang ada di folder root project atau dengan file Database.php yang ada di folder app/config

 Cara koneksi database dengan file env

 Cari file env kemudian buka di text editor anda kemudian cari kode berikut ini

# database.default.hostname = localhost
# database.default.database = ci4
# database.default.username = root
# database.default.password = root
# database.default.DBDriver = MySQLi

kemudian ubah menjadi seperti ini

database.default.hostname = localhost
database.default.database = latihan
database.default.username = root
database.default.password = 12345678
database.default.DBDriver = MySQLi

namadatabase, username, dan password sesuaikan dengan punya kalian, Jika sudah silahkan save as file tersebut dengan nama .env

 Cara koneksi database dengan file Database.php

silahkan anda cari file Database.php di folder app/config kemudian buka di text editor kalian kemudian cari kode berikut ini :

public $default = [
  'DSN'      => '',
  'hostname' => 'localhost',
  'username' => '',
  'password' => '',
  'database' => '',
  'DBDriver' => 'MySQLi',
  'DBPrefix' => '',
  'pConnect' => false,
  'DBDebug'  => (ENVIRONMENT !== 'production'),
  'cacheOn'  => false,
  'cacheDir' => '',
  'charset'  => 'utf8',
  'DBCollat' => 'utf8_general_ci',
  'swapPre'  => '',
  'encrypt'  => false,
  'compress' => false,
  'strictOn' => false,
  'failover' => [],
  'port'     => 3306,
 ];

kemudian ubah sesuai dengan nama database, username, dan password anda lalu simpan

 public $default = [
  'DSN'      => '',
  'hostname' => 'localhost',
  'username' => 'root',
  'password' => '12345678',
  'database' => 'latihan',
  'DBDriver' => 'MySQLi',
  'DBPrefix' => '',
  'pConnect' => false,
  'DBDebug'  => (ENVIRONMENT !== 'production'),
  'cacheOn'  => false,
  'cacheDir' => '',
  'charset'  => 'utf8',
  'DBCollat' => 'utf8_general_ci',
  'swapPre'  => '',
  'encrypt'  => false,
  'compress' => false,
  'strictOn' => false,
  'failover' => [],
  'port'     => 3306,
 ];

cara diatas ini merupakan sama dengan cara yang dipakek di CI 3.

Menampilkan data dari database mysql(READ);

Inputkan beberapa data kedalam tabel .
+---------+--------------+--------------+---------+
| nik     | nama         | hobi         | alamat  |
+---------+--------------+--------------+---------+
| 12222   | Angel Okta   | Membaca Buku | Bangsri |
| 12345   | Budi Santosa | Jalan-jalan  | Jepara  |
| 167889  | M. Nazriel   | Menggambar   | Mlonggo |
| 7866576 | Suliswati    | Membaca Buku | Bangsri |
+---------+--------------+--------------+---------+

1. Buatlah file baru dengan nama "Models_biodata.php" di folder apps/Models kemudian masukan kode berikut ini :

<?php namespace App\Models;
use CodeIgniter\Model;
 
class Models_biodata extends Model
{
    protected $table = 'biodata';
     
    public function getBiodata()
    {
            return $this->findAll();  
    }
 }

Dari code diatas terdapat return $this->findAll(); yang artinya codeigniter langsung mengetahui table yang digunkana yaitu tabel "biodata" yang sudah diset melalui kode protected $table = 'biodata';

 2. Buatlah file controler dengan nama "Biodata.php" di folder apps/Controller kemudian input kode berikut ini :

<?php namespace App\Controllers;
 
use CodeIgniter\Controller;
use App\Models\Models_biodata;
 
class Biodata extends BaseController
{
    public function index()
    {
        $model = new Models_biodata();
        $data['bio'] = $model->getBiodata();
        echo view('view_biodata',$data);
    }
}

Dari kode diatas maka terdapat beberapa fungsi kode yang digunakan untuk memanggil function yang ada di Model dan juga fungsi untuk meneruskan ke views.

3. Buat file view dengan nama "view_biodata.php" simpan di folder "apps/view" lalu input kode berikut ini

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Data Biodata</title>
</head>
<body> 
    <table border="1">
        <thead>
            <tr>
                <th>NIK</th>
                <th>Nama</th>
                <th>Hobi</th>
                <th>Alamat</th>
            </tr>
        </thead>
        <tbody>
        <?php foreach($bio as $row):?>
            <tr>
                <td><?=$row['nik'];?></td>
                <td><?=$row['nama'];?></td>
                <td><?=$row['hobi'];?></td>
                <td><?=$row['alamat'];?></td>
            </tr>
        <?php endforeach;?>
        </tbody>
    </table>
</body>
</html>

Silahkan jalankan di browser anda ketikan : http://localhost:8080/biodata

 Jika coding anda berhasil maka tampilannya akan seperti berikut ini:
Menginput Data ke Dalam Database MySQL(INSERT)

1. silahkan anda buat tampilan form html,nya buat file baru dengan nama form_biodata.php simpan di folder "app/view" kemudian masukan kode berikut ini:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Input Data</title>
</head>
<body>
    <form action="/biodata/simpandata" method="post">
     <label>Nik :</label><br/>
        <input type="number" name="nik"><br/>
        <label>Nama :</label><br/>
        <input type="text" name="nama"><br/>
        <label>Hobi :</label><br/>
        <input type="text" name="hobi"><br/>
        <label>Alamat :</label><br/>
        <textarea name="alamat"></textarea><br/>
        <button type="submit">Simpan</button>
    </form>
</body>
</html>

Kode diatas akan membuat sebuah tampilan form untuk input biodata.

2. Kemudian anda buka kembali file Biodata.php yang ada di folder "app/contrtoller" kemudian edit inputkan beberapa kode sehingga seperti dibawah ini :

<?php namespace App\Controllers;
 
use CodeIgniter\Controller;
use App\Models\Models_biodata;
 
class Biodata extends BaseController
{
    public function index(){
        $model = new Models_biodata();
        $data['bio'] = $model->getBiodata();
        echo view('view_biodata',$data);
    }

    public function tambahdata(){
     echo view('form_biodata');
    }

    public function simpandata(){
     $model = new Models_biodata();
        $data = array(
            'nik'  => $this->request->getPost('nik'),
            'nama' => $this->request->getPost('nama'),
            'hobi' => $this->request->getPost('hobi'),
            'alamat' => $this->request->getPost('alamat'),
        );
        $model->saveBiodata($data);
        return redirect()->to('/biodata');
    }
}

Kode diatas terdapat tambahan function tambahdata() yang berfungsi untuk menampilkan form_biodata dan function simpandata() yang berfungsi untuk menyimpan data ke database melalui model.

3. Buka kembali file Models_biodata.php yang ada di folder "app/Models"  edit dan inputkan beberapa kode sehingga tampilannya seperti ini :

<?php namespace App\Models;
use CodeIgniter\Model;
 
class Models_biodata extends Model
{
    protected $table = 'biodata';
     
    public function getBiodata($id = false)
    {
        if($id === false){
            return $this->findAll();
        }else{
            return $this->getWhere(['nik' => $id]);
        }   
    }

    public function saveBiodata($data){
     $query = $this->db->table($this->table)->insert($data);
        return $query;
    }
 }

Terdapat satu tambahan function saveBiodata($data) yang berfungsi untuk menyimpan data ke database.



Ubah Data di Database MySQL(Update)

1. Buka file form_biodata.php yang ada di folder "app/Views" kemdian edit beberapa kode hingga seperti dibawah ini :
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Input Data</title>
</head>
<body>
 <?php
 if(empty($bio)) {
  $nik = "";
  $nama = "";
  $hobi = "";
  $alamat = "";
  $link = "simpandata";
 } else {
  $nik = $bio->nik;
  $nama = $bio->nama;
  $hobi = $bio->hobi;
  $alamat = $bio->alamat;
  $link = "update";
 }
 ?>
    <form action="/biodata/<?=$link;?>" method="post">
     <label>Nik :</label><br/>
        <input type="number" name="nik" value="<?=$nik;?>"><br/>
        <label>Nama :</label><br/>
        <input type="text" name="nama" value="<?=$nama;?>"><br/>
        <label>Hobi :</label><br/>
        <input type="text" name="hobi" value="<?=$hobi;?>"><br/>
        <label>Alamat :</label><br/>
        <textarea name="alamat"><?=$alamat;?></textarea><br/>
        <button type="submit">Simpan</button>
    </form>
</body>
</html>

Terdapat tambahan kode PHP IF atau logika yang berfungsi untuk memilah jika menunjukan form tersebut sebagai form edit maupun form input.

2. silahkan anda buka file view_biodata.php yang ada di folder "app/view" kemudian edit dan inputkan kode berikut ini:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Data Biodata</title>
</head>
<body> 
    <table border="1">
        <thead>
            <tr>
                <th>NIK</th>
                <th>Nama</th>
                <th>Hobi</th>
                <th>Alamat</th>
                <th>Aksi</th>
            </tr>
        </thead>
        <tbody>
        <?php foreach($bio as $row):?>
            <tr>
                <td><?=$row['nik'];?></td>
                <td><?=$row['nama'];?></td>
                <td><?=$row['hobi'];?></td>
                <td><?=$row['alamat'];?></td>
                <td><a href="/biodata/edit/<?=$row['nik'];?>">Edit</a></td>
            </tr>
        <?php endforeach;?>
        </tbody>
    </table>
</body>
</html>

Terdapat tambahan link untuk mengarah ke form edit.

3. Buka file Biodata.php yang ada di folder "app/Controllers" kemdian edit beberapa kode hingga seperti dibawah ini :

<?php namespace App\Controllers;
 
use CodeIgniter\Controller;
use App\Models\Models_biodata;
 
class Biodata extends BaseController
{
    public function index(){
        $model = new Models_biodata();
        $data['bio'] = $model->getBiodata();
        echo view('view_biodata',$data);
    }

    public function tambahdata(){
     echo view('form_biodata');
    }

    public function simpandata(){
     $model = new Models_biodata();
        $data = array(
            'nik'  => $this->request->getPost('nik'),
            'nama' => $this->request->getPost('nama'),
            'hobi' => $this->request->getPost('hobi'),
            'alamat' => $this->request->getPost('alamat'),
        );
        $model->saveBiodata($data);
        return redirect()->to('/biodata');
    }

    public function edit($id){
        $model = new Models_biodata();
        $data['bio'] = $model->getBiodata($id)->getRow();
        echo view('form_biodata', $data);
    }

    public function update(){
        $model = new Models_biodata();
        $id = $this->request->getPost('nik');
  $data = array(
            'nik'  => $this->request->getPost('nik'),
            'nama' => $this->request->getPost('nama'),
            'hobi' => $this->request->getPost('hobi'),
            'alamat' => $this->request->getPost('alamat'),
        );
        $model->updateBiodata($data, $id);
        return redirect()->to('/biodata');
    }
}

Kode diatas terdapat dua tambahan fungsi yaitu : function edit($id) yang berfungsi menampilkan data dari database menuju form edit dan function update yang berfungsi untuk menyimpan data ke database melalui models.

4. Buka file Models_biodata.php yang ada di folder "app/Models" kemdian edit beberapa kode hingga seperti dibawah ini :

<?php namespace App\Models;
use CodeIgniter\Model;
 
class Models_biodata extends Model
{
    protected $table = 'biodata';
     
    public function getBiodata($id = false)
    {
        if($id === false){
            return $this->findAll();
        }else{
            return $this->getWhere(['nik' => $id]);
        }   
    }

    public function saveBiodata($data){
     $query = $this->db->table($this->table)->insert($data);
        return $query;
    }

    public function updateBiodata($data, $id){
        $query = $this->db->table($this->table)->update($data, array('nik' => $id));
        return $query;
    }
 }

Terdapat tambahan function updateBiodata() yang berfungsi untuk menyimpan data yang sudah diubah kedalam database.

Silahkan jalankan program anda jika berhasil maka akan berjalan dan tidak ada error.
 


Menghapus Data di Database MySQL(Delete)

1. silahkan buka file view_biodata.php yang ada di folder "app/view" kemudian edit dan inputkan kode berikut ini:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Data Biodata</title>
</head>
<body> 
    <table border="1">
        <thead>
            <tr>
                <th>NIK</th>
                <th>Nama</th>
                <th>Hobi</th>
                <th>Alamat</th>
                <th>Aksi</th>
            </tr>
        </thead>
        <tbody>
        <?php foreach($bio as $row):?>
            <tr>
                <td><?=$row['nik'];?></td>
                <td><?=$row['nama'];?></td>
                <td><?=$row['hobi'];?></td>
                <td><?=$row['alamat'];?></td>
                <td><a href="/biodata/edit/<?=$row['nik'];?>">Edit</a> | <a href="/biodata/hapus/<?=$row['nik'];?>">Hapus</a></td>      </tr>
        <?php endforeach;?>
        </tbody>
    </table>
</body>
</html>

Terdapat tambahan link untuk menghapus data.

2. Buka file Biodata.php yang ada di folder "app/Controllers" kemdian edit beberapa kode hingga seperti dibawah ini :

<?php namespace App\Controllers;
 
use CodeIgniter\Controller;
use App\Models\Models_biodata;
 
class Biodata extends BaseController
{
    public function index(){
        $model = new Models_biodata();
        $data['bio'] = $model->getBiodata();
        echo view('view_biodata',$data);
    }

    public function tambahdata(){
     echo view('form_biodata');
    }

    public function simpandata(){
     $model = new Models_biodata();
        $data = array(
            'nik'  => $this->request->getPost('nik'),
            'nama' => $this->request->getPost('nama'),
            'hobi' => $this->request->getPost('hobi'),
            'alamat' => $this->request->getPost('alamat'),
        );
        $model->saveBiodata($data);
        return redirect()->to('/biodata');
    }

 public function edit($id){
        $model = new Models_biodata();
        $data['bio'] = $model->getBiodata($id)->getRow();
        echo view('form_biodata', $data);
    }

    public function update(){
        $model = new Models_biodata();
        $id = $this->request->getPost('nik');
  $data = array(
            'nik'  => $this->request->getPost('nik'),
            'nama' => $this->request->getPost('nama'),
            'hobi' => $this->request->getPost('hobi'),
            'alamat' => $this->request->getPost('alamat'),
        );
        $model->updateBiodata($data, $id);
        return redirect()->to('/biodata');
    }

    public function hapus($id){
        $model = new Models_biodata();
        $model->DelBiodata($id);
        return redirect()->to('/biodata');
    }
}

Terdapat tambahan function hapus() yang berfungsi untuk menghapus data di database melalui models.

3. Buka file Models_biodata.php yang ada di folder "app/Models" kemdian edit beberapa kode hingga seperti dibawah ini :

<?php namespace App\Models;
use CodeIgniter\Model;
 
class Models_biodata extends Model
{
    protected $table = 'biodata';
     
    public function getBiodata($id = false)
    {
        if($id === false){
            return $this->findAll();
        }else{
            return $this->getWhere(['nik' => $id]);
        }   
    }

    public function saveBiodata($data){
     $query = $this->db->table($this->table)->insert($data);
        return $query;
    }

    public function updateBiodata($data, $id){
        $query = $this->db->table($this->table)->update($data, array('nik' => $id));
        return $query;
    }

    public function DelBiodata($id){
        $query = $this->db->table($this->table)->delete(array('nik' => $id));
        return $query;
    } 
 }

Terdapat tambahan function DelBiodata($id) yang berfungsi untuk menghapus data dari database.

Coba anda jalankan program anda yang sudah dibuat jika berhasil maka akan berjalan dengan lancar.

buka : http://localhost:8080/biodata


Semoga tutorial CRUD dengan Codeigniter 4 bisa bermanfaat bagi anda semua

Post a Comment for "Tutorial CRUD di Codeigniter 4 Untuk Pemula"