Tutorial Membuat CRUD Dengan Framework CodeIgniter

Pada tutorial kali ini kita bersama-sama akan belajar bagaimana membuat sebuah CRUD (Create, Read, Update, Delete) menggunakan framework CodeIgniter.
CodeIgniter adalah sebuah web framework yang dikembangkan dengan bahasa pemrogramman PHP, CodeIgniter sendiri merupakan framework yang sangat populer sekali di indonesia, banyak developer / programmer mengembangkan aplikasi maupun websitenya menggunakan framwork ini, CodeIgniter juga dikenal sebagai framework berukuran kecil dan memiliki kecepatan yang dibilang sangat cepat.
CodeIgniter Menggunakan Konsep MVC (Model-View-Controller) adalah sebuah metode untuk membuat sebuah aplikasi dengan memisahkan data (Model) dari tampilan (View) dan cara bagaimana memprosesnya (Controller).
Oke langsung saja kita mulai, silahkan download codeigniter di situs resminya www.codeigniter.com atau bisa ke repositorinya https://github.com/bcit-ci/CodeIgniter. Setelah berhasil didownload, silahkan extract dan copykan ke htdocs (jika menggunakan xampp) teman-teman.
Konfigurasi Aplikasi
Oke untuk pertama kita akan menkonfigurasi aplikasi kita seperti, mengatur alamat aplikasi(base_url), database, autoload, dll.
Langsung saja buka file database.php di application/config/database.php, ubah menjadi seperti ini:
$active_group = 'default';
$query_builder = TRUE;

$db['default'] = array(
    'dsn'   => '',
    'hostname' => 'localhost',
    'username' => 'root',
    'password' => '', //sesuaikan password phpmyadmin teman-teman
    'database' => 'ci_crud',
    'dbdriver' => 'mysqli',
    'dbprefix' => '',
    'pconnect' => FALSE,
    'db_debug' => (ENVIRONMENT !== 'production'),
    'cache_on' => FALSE,
    'cachedir' => '',
    'char_set' => 'utf8',
    'dbcollat' => 'utf8_general_ci',
    'swap_pre' => '',
    'encrypt' => FALSE,
    'compress' => FALSE,
    'stricton' => FALSE,
    'failover' => array(),
    'save_queries' => TRUE
);
Selanjutnya buka file autoload.php di folder application/config dan ubah bagian kode berikut ini:
// config autoload libraries
$autoload['libraries'] = array('');
Menjadi seperti ini:
$autoload['libraries'] = array('database', 'session');
//config autoload helper
$autoload['helper'] = array('');
Menjadi seperti ini:
$autoload['helper'] = array('url', 'form');
Selanjutnya buka file config.php di application/config/config.php, ubah bagian kode-kode dibawah ini:
$config['base_url'] = "";
Menjadi seperti berikut ini
$config['base_url'] = "http://".$_SERVER['HTTP_HOST'].
str_replace(basename($_SERVER['SCRIPT_NAME']),"",$_SERVER['SCRIPT_NAME']);
$config['encryption_key'] = '';
Menjadi seperti berikut ini
$config['encryption_key'] = 'CodeIgniterCrudBasic';
$config['csrf_protection'] = FALSE;
$config['csrf_token_name'] = 'csrf_token_name';
$config['csrf_cookie_name'] = 'csrf_cookie_name';
$config['csrf_expire'] = 7200;
$config['csrf_regenerate'] = TRUE;
$config['csrf_exclude_uris'] = array();
Menjadi seperti berikut ini
$config['csrf_protection'] = TRUE;
$config['csrf_token_name'] = 'csrf_token';
$config['csrf_cookie_name'] = 'csrf_cookie';
$config['csrf_expire'] = 7200;
$config['csrf_regenerate'] = TRUE;
$config['csrf_exclude_uris'] = array();
Selanjutnya, buatlah sebuah database baru di, http://localhost/phpmyadmin, beri nama databasenya dengan ci_crud kemudian import script berikut ini kedalam menu SQL.
-- phpMyAdmin SQL Dump
-- version 4.8.0
-- https://www.phpmyadmin.net/
--
-- Host: localhost
-- Generation Time: May 17, 2018 at 05:35 AM
-- Server version: 5.7.9
-- PHP Version: 7.2.2

SET SQL_MODE = "NO_AUTO_VALUE_ON_ZERO";
SET AUTOCOMMIT = 0;
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: `ci_crud`
--

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

--
-- Table structure for table `tbl_buku`
--

CREATE TABLE `tbl_buku` (
  `id_buku` int(11) NOT NULL,
  `no_isbn` varchar(100) NOT NULL,
  `nama_buku` varchar(100) NOT NULL,
  `tanggal_terbit` date NOT NULL,
  `pengarang` varchar(100) NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=latin1;

--
-- Dumping data for table `tbl_buku`
--

INSERT INTO `tbl_buku` (`id_buku`, `no_isbn`, `nama_buku`, `tanggal_terbit`, `pengarang`) VALUES
(2, '0002349876', 'Pandai Framework CodeIgniter 1 Minggu', '2018-05-22', 'Fika Ridaul Maulayya'),
(4, '0002349444', 'Jago JavaScript', '2018-05-24', 'Rizqi Maulana'),
(5, '0002343909', 'Menguasai Framework Ruby on Rails', '2018-05-26', 'Cahyadi Triyansyah'),
(6, '0002349097', 'Mendalami Vue JS ', '2018-02-19', 'Yudi Purwanto');

--
-- Indexes for dumped tables
--

--
-- Indexes for table `tbl_buku`
--
ALTER TABLE `tbl_buku`
  ADD PRIMARY KEY (`id_buku`);

--
-- AUTO_INCREMENT for dumped tables
--

--
-- AUTO_INCREMENT for table `tbl_buku`
--
ALTER TABLE `tbl_buku`
  MODIFY `id_buku` int(11) NOT NULL AUTO_INCREMENT, AUTO_INCREMENT=7;
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 */;
Membuat Aplikasi
Selanjutnya kita buat sebuah controller baru di folder application/controllers, simpan dengan nama Buku.php, kemudian masukkan kode berikut ini:
<?php
defined('BASEPATH') OR exit('No direct script access allowed');

class Buku extends CI_Controller {

    public function __construct(){

        parent ::__construct();

        //load model
        $this->load->model('model_buku'); 

    }

    public function index()
    {
        $data = array(

            'title'     => 'Data Buku',
            'data_buku' => $this->model_buku->get_all(),

        );

        $this->load->view('data_buku', $data);
    }

    public function tambah()
    {
        $data = array(

            'title'     => 'Tambah Data Buku'

        );

        $this->load->view('tambah_buku', $data);
    }

    public function simpan()
    {
        $data = array(

            'no_isbn'       => $this->input->post("no_isbn"),
            'nama_buku'         => $this->input->post("nama_buku"),
            'tanggal_terbit'    => $this->input->post("tanggal_terbit"),
            'pengarang'         => $this->input->post("pengarang"),

        );

        $this->model_buku->simpan($data);

        $this->session->set_flashdata('notif', '<div class="alert alert-success alert-dismissible"> Success! data berhasil disimpan didatabase.
                                                </div>');

        //redirect
        redirect('buku/');

    }

    public function edit($id_buku)
    {
        $id_buku = $this->uri->segment(3);

        $data = array(

            'title'     => 'Edit Data Buku',
            'data_buku' => $this->model_buku->edit($id_buku)

        );

        $this->load->view('edit_buku', $data);
    }

    public function update()
    {
        $id['id_buku'] = $this->input->post("id_buku");
        $data = array(

            'no_isbn'           => $this->input->post("no_isbn"),
            'nama_buku'         => $this->input->post("nama_buku"),
            'tanggal_terbit'    => $this->input->post("tanggal_terbit"),
            'pengarang'         => $this->input->post("pengarang"),

        );

        $this->model_buku->update($data, $id);

        $this->session->set_flashdata('notif', '<div class="alert alert-success alert-dismissible"> Success! data berhasil diupdate didatabase.
                                                </div>');

        //redirect
        redirect('buku/');

    }

    public function hapus($id_buku)
    {
        $id['id_buku'] = $this->uri->segment(3);

        $this->model_buku->hapus($id);

        //redirect
        redirect('buku/');

    }

}
Selanjutnya kita buat sebuah mode baru di folder application/models, simpan dengan nama Model_buku.php, kemudian masukkan kode berikut ini:
<?php
defined('BASEPATH') OR exit('No direct script access allowed');

class Model_buku extends CI_model{

    public function get_all()
    {
        $query = $this->db->select("*")
                 ->from('tbl_buku')
                 ->order_by('id_buku', 'DESC')
                 ->get();
        return $query->result();
    }

    public function simpan($data)
    {

        $query = $this->db->insert("tbl_buku", $data);

        if($query){
            return true;
        }else{
            return false;
        }

    }

    public function edit($id_buku)
    {

        $query = $this->db->where("id_buku", $id_buku)
                ->get("tbl_buku");

        if($query){
            return $query->row();
        }else{
            return false;
        }

    }

    public function update($data, $id)
    {

        $query = $this->db->update("tbl_buku", $data, $id);

        if($query){
            return true;
        }else{
            return false;
        }

    }

    public function hapus($id)
    {

        $query = $this->db->delete("tbl_buku", $id);

        if($query){
            return true;
        }else{
            return false;
        }

    }

}
Setelah itu kita buat 3 buah file view untuk tampilan aplikasi kita di folder application/views, buatlah 3 file yaitu:
  • data_buku.php
  • tambah_buku.php
  • edit_buku.php
Buka file data_buku.php, kemudian masukkan kode berikut ini:
<!DOCTYPE html>
<html>
<head>
    <title><?php echo $title ?></title>
    <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.1/css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.16/css/dataTables.bootstrap4.min.css">
</head>
<body>

    <div class="container" style="margin-top: 80px">
        <?php echo $this->session->flashdata('notif') ?>
        <a href="<?php echo base_url() ?>buku/tambah/" class="btn btn-md btn-success">Tambah Buku</a>
        <hr>
        <!-- table -->
        <div class="table-responsive">
            <table id="table" class="table table-striped table-bordered table-hover">
                <thead>
                  <tr>
                    <th>No.</th>
                    <th>No ISBN</th>
                    <th>Nama Buku</th>
                    <th>Tanggal Terbit</th>
                    <th>Pengarang</th>
                    <th>Options</th>
                  </tr>
                </thead>
                <tbody>

                <?php
                    $no = 1; 
                    foreach($data_buku as $hasil){ 
                ?>

                  <tr>
                    <td><?php echo $no++ ?></td>
                    <td><?php echo $hasil->no_isbn ?></td>
                    <td><?php echo $hasil->nama_buku ?></td>
                    <td><?php echo $hasil->tanggal_terbit ?></td>
                    <td><?php echo $hasil->pengarang ?></td>
                    <td>
                        <a href="<?php echo base_url() ?>buku/edit/<?php echo $hasil->id_buku ?>" class="btn btn-sm btn-success">Edit</a>
                        <a href="<?php echo base_url() ?>buku/hapus/<?php echo $hasil->id_buku ?>" class="btn btn-sm btn-danger">Hapus</a>
                    </td>
                  </tr>

                <?php } ?>

                </tbody>
              </table>
        </div>

    </div>

<script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.1/js/bootstrap.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/1.10.16/js/dataTables.bootstrap4.min.js"></script>
<script>
    $('#table').DataTable( {
    autoFill: true
} );
</script>
</body>
</html>
Apabila aplikasi dijalankan dengan mengetikkan alamat, http://localhost/folder-project/index.php/buku, kurang lebih tampilannya akan seperti ini:

Selanjutnya Buka file tambah_buku.php, kemudian masukkan kode berikut ini:
<!DOCTYPE html>
<html>
<head>
    <title><?php echo $title ?></title>
    <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.1/css/bootstrap.min.css">
</head>
<body>

    <div class="container" style="margin-top: 80px">
        <div class="col-md-12">
            <?php echo form_open('buku/simpan') ?>

              <div class="form-group">
                <label for="text">No ISBN</label>
                <input type="text" name="no_isbn" class="form-control" placeholder="Masukkan No. ISBN">
              </div>

              <div class="form-group">
                <label for="text">Nama Buku</label>
                <input type="text" name="nama_buku" class="form-control" placeholder="Masukkan Nama Buku">
              </div>

              <div class="form-group">
                <label for="text">Tanggal Terbit</label>
                <input type="date" name="tanggal_terbit" class="form-control" >
              </div>

              <div class="form-group">
                <label for="text">Pengarang</label>
                <input type="text" name="pengarang" class="form-control" >
              </div>

              <button type="submit" class="btn btn-md btn-success">Simpan</button>
              <button type="reset" class="btn btn-md btn-warning">reset</button>
            <?php echo form_close() ?>
        </div>
    </div>

<script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.1/js/bootstrap.min.js"></script>
</body>
</html>
Apabila aplikasi dijalankan dengan mengetikkan alamat, http://localhost/folder-project/index.php/buku/tambah, kurang lebih tampilannya akan seperti ini:

Selanjutnya Buka file edit_buku.php, kemudian masukkan kode berikut ini:
<!DOCTYPE html>
<html>
<head>
    <title><?php echo $title ?></title>
    <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.1/css/bootstrap.min.css">
</head>
<body>

    <div class="container" style="margin-top: 80px">
        <div class="col-md-12">
            <?php echo form_open('buku/update') ?>

              <div class="form-group">
                <label for="text">No ISBN</label>
                <input type="text" name="no_isbn" value="<?php echo $data_buku->no_isbn ?>" class="form-control" placeholder="Masukkan No. ISBN">
                <input type="hidden" value="<?php echo $data_buku->id_buku ?>" name="id_buku">
              </div>

              <div class="form-group">
                <label for="text">Nama Buku</label>
                <input type="text" name="nama_buku" value="<?php echo $data_buku->nama_buku ?>" class="form-control" placeholder="Masukkan Nama Buku">
              </div>

              <div class="form-group">
                <label for="text">Tanggal Terbit</label>
                <input type="date" name="tanggal_terbit" value="<?php echo $data_buku->tanggal_terbit ?>" class="form-control" >
              </div>

              <div class="form-group">
                <label for="text">Pengarang</label>
                <input type="text" name="pengarang" value="<?php echo $data_buku->pengarang ?>" class="form-control" >
              </div>

              <button type="submit" class="btn btn-md btn-success">Update</button>
              <button type="reset" class="btn btn-md btn-warning">reset</button>
            <?php echo form_close() ?>
        </div>
    </div>

<script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.1/js/bootstrap.min.js"></script>
</body>
</html>
Apabila aplikasi dijalankan dengan mengetikkan alamat, http://localhost/folder-project/index.php/buku/edit/2, kurang lebih tampilannya akan seperti ini:




1.      Pengertian codeigniter?
CodeIgniter adalah sebuah web framework yang dikembangkan dengan bahasa pemrogramman PHP, CodeIgniter sendiri merupakan framework yang sangat populer sekali di indonesia, banyak developer / programmer mengembangkan aplikasi maupun websitenya menggunakan framwork ini, CodeIgniter juga dikenal sebagai framework berukuran kecil dan memiliki kecepatan yang dibilang sangat cepat.
2.      Pengertian CodeIgniter Menggunakan Konsep MVC (Model-View-Controller)?
CodeIgniter Menggunakan Konsep MVC (Model-View-Controller) adalah sebuah metode untuk membuat sebuah aplikasi dengan memisahkan data (Model) dari tampilan (View) dan cara bagaimana memprosesnya (Controller).
3.      File mapa saja kah yang harus dibuka dan diubah ketika akan mengkonfigurasi aplikasi?
·         File database.php
·         File autoload.php
·         File config.php
4.      Pada folder apakah kita menyimpan 3 buah view untuk menampilkan aplikasi?
Application/view
5.      Cara menjalankan aplikasi yang dibuat?
http://localhost/folder-project/index.php/buku/edit/2

Komentar

Posting Komentar

Postingan populer dari blog ini

Pengertian XAMPP Beserta Fungsi dan Bagian-bagian Penting pada XAMPP

Gambar
Pengertian XAMPP Software yang satu ini bernama XAMPP yang merupakan singkatan dari Apache, MySQL, PHP dan Perl sedangkan huruf “X” dimaksudkan sebagai suatu software yang dapat dijalankan di  empat OS  utama seperti Windows, Mac OS, Linux dan Solaris. Istilah ini seringkali disebut dengan cross platform (software multi OS). Sesuai dengan namanya software yang satu ini merupakan gabungan dari beberapa software dengan fungsi yang sama yakni menunjang para pembuat web yang menginginkan adanya web server sendiri di PC atau laptopnya. Software ini juga berlisensi GNU dan dapat didownload secara gratis di internet mengingat peran vital yang dimilikinya terutama bagi pembuat web pemula. Software XAMPP didirikan oleh suatu perusahaan bernama Apache Friends. Dengan adanya beberapa tools pemrograman seperti MySQL, PHP dan Perl yang dimilikinya tentu mengindikasikan jika anda menekuni salah satu atau semuanya berarti harus memiliki software yang bernama XAMPP ini. Maksud dari A...
Baca selengkapnya

Mengevaluasi Pengamanan Sistem Basis Data Pada RDBMS

A. Password Akses Basis Data       Seperti yang telah Anda ketahui, memberikan akses database setingkat root user kepada non-root user bukanlah tindakan cerdas. Sebagian besar orang pasti ingin memberikan akses dengan tingkat atau level berbeda ke berbagai macam user. MySQL dapat mengabulkan keinginan Anda. Ikutilah perintah sederhana di bawah ini: GRANT [permission type] ON [database name].[table name] TO 'non-root'@'localhost'; Anda hanya harus mengganti ‘permission type’ value dengan semacam permisson yang hendak Anda berikan kepada user baru. Anda pun harus menentukan nama database dan table. Kedua hal ini mempermudah root user melakukan kontrol yang tepat terhadap pemberian hak akses. Sama seperti contoh di atas, ‘non-root’ adalah username, jadi Anda bebas menggantinya dengan pilihan Anda sendiri B.Enkripsi Password      Enkripsi adalah teknik untuk mengamankan data-data tersebut agar isinya tidak diketahui orang lain. Enkripsi biasanya dila...
Baca selengkapnya