Breaking News
Loading...
Tuesday, 27 February 2018

Info Post
Codeigniter adalah salah satu framework untuk bahasa pemrograman PHP. Menjadi satu dari sekian banyak yang paling sering dipakai oleh developer web khususnya di Indonesia, Merasa sangat perlu saya membahas semua yang diperlukan oleh yang ingin dan baru pertama kali menggunakan framework Codeigniter. Codeigniter atau orang biasa menyebut; CI, mempunyai rule model hampir sama dengan framework kebanyakan, prinsip utamanya adalah MVC. 
Jadi bagi yang sudah terbiasa dengan Model - View - Controller, akan mudah memahami Codeigniter, namun bagi yang belum terbiasa, tenang saja, tutorial ini akan memanjakan kalian dengan pembahasan yang lengkap serta mudah dimengerti. Tutorial ini karena baru pertama kali membahas Codeigniter, Maka akan saya batasi hanya pada instalasi Codeigniter, Configurasi Database dan lain-lain, juga bagaimana menampilkan tampilan sederhana menggunakan rule model Codeigniter.
Baik langsung saja pada pembahasan, untuk yang terbiasa belajar dengan langsung melihat script bisa teman-teman download DISINI;

1. Proses download Codeigniter

Untuk menggunakan framework Codeigniter, pertama kali download dulu framework-nya, kalian bisa download dari website resminya, http://www.codeigniter.com/. Untuk performa terbaik, sebaiknya download versi yang terbaru. Sampai pada tulisan ini dibuat, versi Codeigniter adalah 3.1.7. 

2. instalasi Codeigniter

Setelah selesai download Masternya, extract file ZIP-nya dan langsung saja letakkan di folder htdocs jika kalian menggunakan Xampp sebagai paket file server. Jika diperhatikan susunan folder setelah kalian extract akan tampak seperti gambar di bawah ini, Jangan lupa agar prakteknya gampang kalian beri ganti nama folder yang sama dengan projek saya, yaitu; "belajar_ci". Folder itu menjadi folder projek kita nantinya.

Struktur Folder Codeigniter
Gambar 1. Struktur Folder Codeigniter
Penjelasan dari tiap-tiap folder bisa kalian baca dari dokumentasi resminya, sengaja tidak saya jelaskan disini karena susunan folder biasanya berubah mengikut perubahan versinya. Namun jangan khawatir, folder dan file yang penting akan tetap saya jelaskan sesuai kebutuhan, agar teman-teman bisa praktek tanpa harus bingung memikirkan file konfigurasi yang sebenarnya tidak termasuk pada pembahasan tulisan kali ini. 

3. konfigurasi Base Url Codeigniter

Konfigurasi kali ini dimulai dari konfigurasi base url saja, silahkan buka file config pada direktori application/config/config.php. Ubah base_url ke folder projek kalian.


$config['base_url'] = 'http://localhost/belajar_ci';

 

Pada tahap ini, sebenarnya teman-teman sudah bisa melihat hasil dari instalasinya. Coba saja buka browser dan masukkan alamat sesuai projek kalian, atau dalam kasus ini; "http://localhost/belajar_ci" pada browser. Hasilnya akan seperti gambar di bawah ini,

Hasil Codeigniter
Gambar 2. Hasil Codeigniter

4. Konfigurasi Database

Database adalah perlu jika nanti sudah mengarah ke pembuatan sistem yang sebenarnya, cara konfigurasinya adalah, buka file database.php pada direktori application/config/database.php. Lalu ubah hanya pada bagian script di bawah sebagai permulaan,


$db['default']['hostname'] = "localhost";

$db['default']['username'] = "username_database";

$db['default']['password'] = "password_database";

$db['default']['database'] = "nama_database";

 

Lalu agar database ter-load secara otomatis, maka perlu juga menambahkan pengaturan di file autoload.php pada direktori application/config/autoload.php, lalu tambahkan pada baris mana saja script berikut.


$autoload['libraries'] = array('database');
 

5. File Controller

Controller adalah penghubung antara Model dan View. Di dalamnya berisi fungsi yang mengatur kapan mengambil data dan kapan menampilkannya ke user. Secara default, file controller sudah ada pada framework CodeIgniter. Yaitu pada direktori application/controller/Welcome.php. Itu berarti nama controller-nya adalah Welcome.php. Perlu diperhatikan, kalau kalian buka file tersebut akan terlihat bahwa nama Class harus sama dengan nama file-nya. Itu ketentuan.


<?php

defined('BASEPATH') OR exit('No direct script access allowed');



class Welcome extends CI_Controller {



 public function index()

 {

  $this->load->view('welcome_message');

 }

}

 

Fungsi index pada controller adalah fungsi yang pertama kali dipanggil ketika controller di-load. 


$this->load->view('welcome_message');

 

Script di atas berarti fungsi index akan memanggil file View welcome_message.php untuk ditampilkan ke user saat controller Welcome dipanggil.

6. File View 

Pada tahap 5 kita sudah belajar bagaimana controller bekerja. Sekarang teman-teman bisa buka file View welcome_message.php pada direktori application/views/welcome_message.php. Disitu bisa teman-teman perhatikan bahwa isinya hanya berupa file html biasa. Bisa dicoba ubah dan refresh projecknya di browser, lalu lihat hasilnya. Silahkan bereksperimen lebih lanjut agar terbiasa.

7. File Model

Model adalah sekumpulan fungsi yang bertugas untuk mengambil data, umunya dari database. Data yang sudah di ambil oleh controller akan diteruskan ke View tadi. Sekarag teman-teman buat file model baru di direktori application/models/. Beri nama filenya "welcome_model.php". Lalu copy-pastekan script berikut;


<?php

class Welcome_model extends CI_Model {



    function __construct()

    {

          parent::__construct();

    }



    function get_data()

        {

            // Data yang akan dikirim ke View oleh Controller

            $data = "Belajar CodeIgniter Oleh www.ngompile.com";

            return $data;

        }



}

?>

 

Dari script di atas, yang perlu teman-teman pahami adalah pada fungsi get_data, fungsi ini akan dipanggil oleh controller untuk diteruskan ke View. Fungsi ini akan me-return nilai String yang isinya "Belajar CodeIgniter Oleh www.ngompile.com".

8. Finalisasi projek

Sekarang tahap selanjutnya adalah memanggil model dari controller dan lalu menampilkannya ke view. Untuk itu maka script controller-nya harus diubah menjadi seperti berikut;


<?php

defined('BASEPATH') OR exit('No direct script access allowed');



class Welcome extends CI_Controller {



 public function index()

 {

  // load file model

  $this->load->model('welcome_model');

  // panggil fungsi model

  $result ['data'] = $this->welcome_model->get_data();

  $this->load->view('welcome_message', $result);

 }

}

 

Keterangan script sudah ada dalam baris kode, bisa teman-teman baca sendiri. Lalu setelah itu perlu juga mengubah file View agar bisa menampilkan apa yang dikirim oleh controller pada script ini -> $this->load->view('welcome_message', $result); .


<?php

defined('BASEPATH') OR exit('No direct script access allowed');

?><!DOCTYPE html>

<html lang="en">

<head>

 <meta charset="utf-8">

 <title>Welcome to CodeIgniter</title>



 <style type="text/css">



 ::selection { background-color: #E13300; color: white; }

 ::-moz-selection { background-color: #E13300; color: white; }



 body {

  background-color: #fff;

  margin: 40px;

  font: 13px/20px normal Helvetica, Arial, sans-serif;

  color: #4F5155;

 }



 a {

  color: #003399;

  background-color: transparent;

  font-weight: normal;

 }



 h1 {

  color: #444;

  background-color: transparent;

  border-bottom: 1px solid #D0D0D0;

  font-size: 19px;

  font-weight: normal;

  margin: 0 0 14px 0;

  padding: 14px 15px 10px 15px;

 }



 code {

  font-family: Consolas, Monaco, Courier New, Courier, monospace;

  font-size: 12px;

  background-color: #f9f9f9;

  border: 1px solid #D0D0D0;

  color: #002166;

  display: block;

  margin: 14px 0 14px 0;

  padding: 12px 10px 12px 10px;

 }



 #body {

  margin: 0 15px 0 15px;

 }



 p.footer {

  text-align: right;

  font-size: 11px;

  border-top: 1px solid #D0D0D0;

  line-height: 32px;

  padding: 0 10px 0 10px;

  margin: 20px 0 0 0;

 }



 #container {

  margin: 10px;

  border: 1px solid #D0D0D0;

  box-shadow: 0 0 8px #D0D0D0;

 }

 </style>

</head>

<body>



<div id="container">

 <h1><?php echo $data;?></h1>



 <div id="body">

  <p>The page you are looking at is being generated dynamically by CodeIgniter.</p>



 </div>



 

</div>



</body>

</html>



 

Maka hasilnya akan terlihat seperti gambar berikut ini;

Hasil terakhir Codeigniter
Gambar 3. Hasil terakhir Codeigniter

Demikian tulisan tentang CodeIgniter kali ini. Jika ada pertanyaan bisa tinggalkan komentar di kolom komentar di bawah.


0 comments:

Post a Comment