MATERI PELATIHAN

WEB FRAMEWORK CODEIGNITER

Pemateri :
Hasanuddin, S.T.,M.Cs.

Kerjasama Prodi Teknik Informatika & SIG WAP dan Web Programming
Fakultas Teknologi Industri
Universitas Ahmad Dahlan

2010
 KATA PENGANTAR

Assalamualaikum Wr. Wb.

Alhamadulillah, puji syukur kami panjatkan kehadirat Allah SWT yang telah
melimpahkan rahmat-Nya hingga kami dapat menyelenggarakan Pelatihan Web
Framework CodeIgniter. Workshop ini dapat terselenggara atas kerjasama Pimpinan
Prodi Teknik Informatika dan Special Interest Group (SIG) WAP dan Web Programming
Program Studi (Prodi) Teknik Informatika Fakultas Teknologi Industri Universitas
Ahmad Dahlan (UAD) Yogyakarta.
Materi dalam pelatihan ini disajikan secara sistematis dan mendasar karena
untuk menguasai web framework sejenis CodeIgniter apalagi dengan latar belakang
kompetensi yang beragam, tidak bisa instan dalam waktu yang singkat, namun perlu
bertahap. Pada materi ini difokuskan untuk menguasai dasar-dasar OOP (Object
Oriented Programming) dan MVC (Model, View, Controller) serta pengenalan
framework CodeIgniter. Secara keseluruhan materi dalam pelatihan ini disadur dari
berbagai sumber untuk memudahkan peserta dalam memahami materi yang disajikan.
Harapan yang ingin dicapai dengan adanya pelatihan ini adalah semoga
para peserta dapat membangun suatu aplikasi berbasis web menggunakan Framework
CodeIgniter. Semoga dengan pelatihan ini dapat menambah wawasan dan bekal bagi
calon pembimbing/penguji KP/TP/TA di masa-masa mendatang. Jika terdapat suatu
kekurangan, kami mohon maaf sebesar-besarnya. Kritik dan saran dapat dilayangkan
ke hasan@uad.ac.id.

Wassalamualaikum Wr. Wb.

Yogyakarta, 1 November 2010

Hasanuddin, S.T., M.Cs.

Pelatihan Web Framework CodeIgniter 2010 UAD (Oleh : Hasanuddin) 2

 DAFTAR ISI

HALAMAN JUDUL ............................................................................................... 1

KATA PENGANTAR ............................................................................................. 2
DAFTAR ISI .......................................................................................................... 3

Sesi 1 Dasar Pemrograman Web dan OOP ....................................... 4

Sesi 2 Instalasi/konfigurasi CodeIgniter dan
Konsep Dasar MVC Controller ............................................. 8
Sesi 3 Konsep Dasar MVC View dan Model ................................... 12
Sesi 4 Stud Kasus Aplikasi 1 ................................................................ 17
Sesi 5 Stud Kasus Aplikasi 2 ................................................................ 20
Sesi 6 Stud Kasus Aplikasi 3 ................................................................ 25

DAFTAR PUSTAKA ............................................................................................... 29

Pelatihan Web Framework CodeIgniter 2010 UAD (Oleh : Hasanuddin) 3

 Sesi 1
Dasar Pemrograman Web dan OOP

1. Pendahuluan

Untuk melakukan pemrograman web sisi server diperlukan software/tools Web

Server
Web server secara umum terbagi 2 berdasarkan sistem operasi server web :
o IIS (Internet Information Services) Sistem Operasi Windows
o Apache Sistem Operasi selain windows
Untuk memudahkan pengembang web (khususnya di sisi server selain
Windows) disediakan paket web server opensource, antara lain :
o XAMPP
o WAMP
o Apache2triad
o dll
Materi dasar pemrograman web server :
o Data dan variabel
o Seleksi dan percabangan
o Perulangan
o Array
o Fungsi
o OOP dalam PHP

2. Latihan

Persiapan :
Pastikan web server telah aktif dan dapat menjalankan http://localhost
tanpa error.
Gunakan editor web yang tersedia (misalnya Macromedia Dreamweaver)
Letakkan file program pada folder masing-masing di web root (misalnya
C:/XAMPP/htdocs/workshop/).

Pelatihan Web Framework CodeIgniter 2010 UAD (Oleh : Hasanuddin) 4

 Nama file : latihan1.php

<?php
$nama = "Budiman";
$alamat = "Yogyakarta";

$a = 3;
$b = 7;
$c = $a + $b;

echo "Nama : ".$nama.", Alamat : ".$alamat."<br>";

echo "A + B = ".$a." + ".$b." = ".$c."<br><br>";

if ($a > $b)

{
echo "Bilangan ".$a." Lebih besar dari ".$b."<br>";
} else {
echo "Bilangan ".$b." Lebih besar dari ".$a."<br>";
}

for($i=$a;$i<$b;$i++)
{
echo $i."<br>";
}
?>
Ketik dan jalankan kode program di atas melalui web browser.

Nama file : latihan2.php

<?php
$nama = array("ali","budi","anto");
$nama[3] = "joko";
$nama[4] = "budiman";

for($i=0; $i<count($nama);$i++)
{
echo "Indeks ke-".$i." Isinya = ".$nama[$i]."<br>";
}
?>
Ketik dan jalankan kode program di atas melalui web browser.

Pelatihan Web Framework CodeIgniter 2010 UAD (Oleh : Hasanuddin) 5

 Nama file : latihan3.php
<?php
function tambah($j, $k)
{
return ($j+$k);
}
echo "Hasil jumlah 5 dan 8 = ".tambah(5,8);
echo "<br><br>";

function kali()
{
$a = 5; $b = 10;
return ($a*$b);
}
echo "Hasil kali 5 dan 10 adalah ".kali();
echo "<br><br>";

function selisih($r, $s)

{
$hasil = $s - $r;
echo "Selisih antara ".$r." dan ".$s." adalah ".$hasil;
}
selisih(5,9);
?>
Ketik dan jalankan kode program di atas melalui web browser.

Nama file : latihan4.php

<?php
class Konsumen {
var $belanja;

function Konsumen() {
$this->belanja=0;
}
function beli($harga,$jum) {
$hasil = $harga * $jum;
$this->belanja = $this->belanja + $hasil;
}
function cetak() {
echo "Total belanja = ".$this->belanja;
}
}
$budi = new Konsumen();
echo "Data pertama <br>";
$budi->cetak();

Pelatihan Web Framework CodeIgniter 2010 UAD (Oleh : Hasanuddin) 6

 echo "<br>Data kedua <br>";
$budi->beli(5000,3);
$budi->cetak();

echo "<br>Data ketiga <br>";

$budi->beli(10000,5);
$budi->cetak();
?>
Ketik dan jalankan kode program di atas melalui web browser.

3. Tugas Mandiri (disesuaikan dengan sisa waktu)

a. Modifikasi program latihan1.php agar variabel a dan b didapatkan dari URL
(metode GET).
b. Modifikasi program latihan2.php dengan pengiriman data melalui form
HTML menggunakan metode POST.
c. Modifikasi program latihan4.php dengan menambahkan fungsi diskon dan
fungsi kembalian pada class konsumen.

Pelatihan Web Framework CodeIgniter 2010 UAD (Oleh : Hasanuddin) 7

 Sesi 2
Instalasi/konfigurasi CodeIgniter dan
Konsep Dasar MVC Controller

1. Pendahuluan

Untuk melakukan instalasi CodeIgniter, anda harus memiliki source code atau
bendel paket CodeIgniter. Anda dapat mendownload pada
www.codeigniter.com (dalam workshop ini, master CodeIgniter 1.7.2 telah
disediakan).
Struktur isi file instalasi CodeIgniter adalah :
o file index.php file utama web
o file license.txt lisensi produk
o folder system folder sistem aplikasi
o folder user_guide file dokumentasi bagi pengguna
Web framework secara arsitektur sistem terdiri dari 3 bagian yang dikenal
dengan konsep MVC. Ketiga bagian tersebut yaitu :
o Model berhubungan dengan penyajian dan manipulasi data dari dan
ke database
o View berhubungan dengan penyajian data pada tampilan halaman
web
o Controller logic pemrograman yang mengatur keterlibatan Model dan
View.

2. Latihan
Persiapan :
Pastikan web server telah aktif dan dapat menjalankan http://localhost
tanpa error.
Gunakan editor web yang tersedia (misalnya Macromedia Dreamweaver)
Pastikan master CodeIgniter 1.7.2 terdapat di komputer anda.

Langkah Instalasi CodeIgniter:

a. Ekstrak master (source code) Framework CodeIgniter 1.7.2 pada web root
komputer anda masing-masing. Misal C:/XAMPP/htdocs/workshop/.
b. Atur file konfigurasi (config.php) yang terletak pada folder
/system/application/config dengan mengganti baris :
$config['base_url'] = "http://example.com/";
Ubah sesuai URL komputer masing-masing, sebagai contoh adalah :
$config['base_url'] = "http://localhost/workshop/";
c. Buat database baru (misalnya menggunakan PhpMyAdmin) dengan nama
database workshopcidb.
d. Atur file database.php yang terletak di /system/application/config dan ubah
konfigurasi koneksi ke database seperti kode berikut :

Pelatihan Web Framework CodeIgniter 2010 UAD (Oleh : Hasanuddin) 8

 $db['default']['hostname'] = "localhost";
$db['default']['username'] = "root";
$db['default']['password'] = "";
$db['default']['database'] = "workshopcidb";

e. Atur file autoload.php dan lakukan konfigurasi beberapa baris seperti di

bawah ini :
$autoload['libraries'] = array('database','session','email','validation');
$autoload['helper'] = array('url','form','table','html');
$autoload['plugin'] = array('captcha');

f. Buka web browser dan ketikkan alamat URL sistem, maka akan tampil
halaman utama aplikasi CodeIgniter.
Contoh URL : http://localhost/workshop

Latihan Menggunakan Controller Dasar :

a. Buat file controller dengan nama latihan1.php yang terletak di folder :
/system/application/controllers/ berisi script berikut :
<?php
class latihan1 extends Controller {
function latihan1()
{
parent::Controller();
}
function index()
{
echo "Selamat datang di CodeIgniter";
echo br(1).anchor('latihan1/coba1','Ke Fungsi Coba1');
echo br(1).anchor('latihan1/coba2','Ke Fungsi Coba2');
}
function coba1()
{
echo "Kalimat ini ditampilkan melalui fungsi Coba1";
echo br(1).anchor('latihan1','Ke Halaman Utama');
}
function coba2()
{
echo "Kalimat ini ditampilkan melalui fungsi Coba2";
echo br(1).anchor('latihan1','Ke Halaman Utama');
}
}
?>

Pelatihan Web Framework CodeIgniter 2010 UAD (Oleh : Hasanuddin) 9

 b. Buka web browser, masukkan alamat URL di bawah ini :
http://localhost/workshop/index.php/latihan1

c. Agar pengalamatan halaman awal menjadi ringkas misalnya seperti URL di

bawah ini :
http://localhost/workshop

Maka buka file routes.php pada /system/application/config selanjutnya ubah

baris program berikut :

$route['default_controller'] = "welcome";

Menjadi :
$route['default_controller'] = "latihan1";

d. Buka kembali web browser, masukkan alamat URL di bawah ini :

http://localhost/workshop

Latihan Menggunakan Controller Lanjut :

a. Buat file controller dengan nama latihan2.php yang terletak di folder :
/system/application/controllers/ berisi script berikut :

<?php
class latihan2 extends Controller {
function latihan2()
{
parent::Controller();
}
function index() {
echo "Selamat datang di CodeIgniter";
echo br(1).anchor('latihan2/coba1/uad','Ke Fungsi Coba1');
echo br(1).anchor('latihan2/coba2/3/7','Ke Fungsi Coba2');
}
function coba1($teks) {
echo "Teks yang diterima pada fungsi Coba1 : ".$teks;
echo br(1).anchor('latihan2','Ke Halaman Utama');
}
function coba2($bilangan1, $bilangan2) {
echo "Bilangan yang diterima melalui fungsi Coba2 : ".$bilangan1.
dan .$bilangan2;
$hasil = $bilangan1 + $bilangan2;
echo br(1).Hasil jumlah keduanya adalah = .$hasil;
echo br(1).anchor('latihan2','Ke Halaman Utama');
}
}
?>

Pelatihan Web Framework CodeIgniter 2010 UAD (Oleh : Hasanuddin) 10

 b. Buka web browser, masukkan alamat URL di bawah ini :
http://localhost/workshop/index.php/latihan2

3. Tugas Mandiri (disesuaikan dengan sisa waktu)

a. Modifikasi controller latihan2.php pada fungsi coba2, agar menghasilkan
output di bawah ini :

Bilangan Genap antara 3 dan 7 adalah :

4 6

b. Modifikasi controller latihan2.php pada fungsi coba1, agar teks yang

diterima (dalam hal ini : uad) terkirim dan ditampilkan pada fungsi baru
(misalnya : fungsi coba3).

Pelatihan Web Framework CodeIgniter 2010 UAD (Oleh : Hasanuddin) 11

 Sesi 3
Konsep Dasar MVC View dan Model

1. Pendahuluan

Selain komponen Controller, dalam konsep MVC perlu dikuasai juga 2

komponen lainnya, yaitu :
o View
o Model
Bagian View berhubungan dengan penyajian halaman web, misalnya form input
data, konfirmasi interaksi maupun informasi dari database.
Dalam menyajikan halaman web, dalam view dapat digunakan beberapa
layanan yang disediakan oleh framework CodeIgniter yang terdiri dari :
o Fungsi html
o Fungsi tabel
o Fungsi form
Dalam mengelola data dari dan ke database, dalam model dapat digunakan
beberapa layanan yang disediakan oleh framework CodeIgniter yang terdiri
dari:
o Pengiriman query
o Penyajian hasil query
Materi selengkapnya tentang fungsi-fungsi dalam View dan Model, disediakan
terpisah (termasuk dalam source code pelatihan).

Latihan Menggunakan Controller dan View :

a. Buat file controller dengan nama mahasiswa.php yang terletak di folder :
/system/application/controllers/ berisi script berikut :

<?php
class Mahasiswa extends Controller {
function Mahasiswa()
{
parent::Controller();
}
function index()
{
echo "Menggunakan view dan controller<br>";
echo "Isilah form dengan klik link berikut<br>";
echo anchor('mahasiswa/form','Form Input Mahasiswa');
}
function form()
{
$this->load->view('formMahasiswa');
}

Pelatihan Web Framework CodeIgniter 2010 UAD (Oleh : Hasanuddin) 12

 function kirim()
{
$data['nim'] = $_POST['nim'];
$data['nama'] = $_POST['nama'];
$data['prodi'] = $_POST['prodi'];
$this->load->view('kirimMahasiswa',$data);
}
}
?>

b. Buat file view dengan nama formMahasiswa.php yang terletak di folder

/system/application/views/ berisi script berikut :

<?php
$this->load->helper('form');
$this->load->library('table');
$this->table->set_caption('Form Input Data Mahasiswa');
echo form_open("mahasiswa/kirim");
$this->table->add_row("NIM : ", form_input('nim'));
$this->table->add_row("Nama : ", form_input('nama'));
$this->table->add_row("Program Studi: ",
form_dropdown('prodi',array('Teknik Informatika','Teknik Elektro','Teknik
Industri',Teknik Kimia),'0'));
$this->table->add_row(form_submit('submit','Simpan'));
echo $this->table->generate();
echo form_close();
?>
c. Buat file view dengan nama kirimMahasiswa.php yang terletak di folder
/system/application/views/ berisi script berikut :
<?php
echo "<h3 align='center'>Hasil Input Data Mahasiswa</h3>";
echo "NIM :".$nim.'<br>';
echo "Nama Lengkap :".$nama.'<br>';
echo "Program Studi:".$prodi.'<br><br>';
echo anchor('mahasiswa/form','Isi Form Lagi');
?>

d. Untuk melihat hasil dari studi kasus ini, buka web browser dan masukkan URL
di bawah ini:
http://localhost/workshop/index.php/mahasiswa

e. Amati hasil output program di atas dan lakukan percobaan input data melalui
form

Pelatihan Web Framework CodeIgniter 2010 UAD (Oleh : Hasanuddin) 13

 Latihan Menggunakan Controller, View dan Model :
a. Buat tabel barang dengan field kode_barang varchar(10), nama_barang
varchar(50), harga_satuan bigint.
b. Buat file model dengan nama model_barang.php yang terletak di folder
/system/application/models berisi script berikut :

<?php
class model_barang extends Model{
function model_barang()
{
parent::Model();
}
function getBarang()
{
$this->load->database();
$query = $this->db->query('select kode_barang, nama_barang,
harga_satuan from barang order by kode_barang desc limit 1');
if($query->num_rows() > 0)
{
foreach($query->result() as $row)
{
$this->kode = $row->kode_barang;
$this->nama = $row->nama_barang;
$this->harga = $row->harga_satuan;
}
} else {
$this->kode = 'Kosong';
$this->nama = 'Kosong';
$this->harga = 'Kosong';
}
}
function addBarang($data)
{
$this->load->database();
$this->db->set('kode_barang',$data['kode']);
$this->db->set('nama_barang',$data['nama']);
$this->db->set('harga_satuan',$data['harga']);
$this->db->insert('barang');
}
}
?>

c. Buat file controller dengan nama toko.php yang terletak di folder

/system/application/controllers berisi script berikut :

Pelatihan Web Framework CodeIgniter 2010 UAD (Oleh : Hasanuddin) 14

 <?
class Toko extends Controller {
function Toko()
{
parent::Controller();
}
function index() {
echo "Interaksi sederhana ke database<br>";
echo "Isilah form melalui link berikut<br><br>";
echo anchor('toko/form','Form Input Barang');
}
function form() {
$this->load->helper('form');
$this->load->library('table');
$this->table->set_caption('Form Input Barang');
echo form_open("toko/kirim");
$this->table->add_row("Kode Barang : ", form_input('kode'));
$this->table->add_row("Nama Barang : ", form_input('nama'));
$this->table->add_row("Harga Satuan: ", form_input('harga'));
$this->table->add_row( form_submit('submit','Simpan'));
echo $this->table->generate();
echo form_close();
}

function lihat() {
$this->load->model('model_barang');
$this->model_barang->getBarang();
$data = array ( 'kode' => $this->model_barang->kode,
'nama' => $this->model_barang->nama,
'harga' => $this->model_barang->harga
);
$this->load->view('view_barang', $data);
}
function kirim() {
$data = array ( 'kode' => $_POST['kode'],
'nama' => $_POST['nama'],
'harga' => $_POST['harga']
);
$this->load->model('model_barang');
$this->model_barang->addBarang($data);
echo anchor('toko/lihat','Lihat Data Barang');
}
}
?>

Pelatihan Web Framework CodeIgniter 2010 UAD (Oleh : Hasanuddin) 15

 d. Buat file view dengan nama view_barang.php yang terletak di folder
/system/application/views berisi script berikut :
<?php
echo "<h1>Menampilkan Data Barang</h1>";
echo "Data barang terakhir adalah :<br><br>";
echo "Kode Barang :".$kode;
echo "<br>Nama Barang :".$nama;
echo "<br>Harga Satuan :".$harga."<br>";
echo anchor('toko/form','Input Data Barang Lagi');
?>

e. Untuk melihat hasil program di atas, buka web browser dan masukkan URL di
bawah ini:
http://localhost/workshop/index.php/toko

f. Amati hasil output program di atas dan lakukan percobaan input data melalui
form

Pelatihan Web Framework CodeIgniter 2010 UAD (Oleh : Hasanuddin) 16

 Sesi 4
Stud Kasus Aplikasi 1 (Kalkulatorku)

1. Pendahuluan
Kalkulatorku merupakan aplikasi sederhana untuk mengolah angka dalam
fungsi penjumlah dan perkalian.
Arsitektur MVC dari aplikasi tersebut adalah sebagai berikut :

Model View Controller

mKalkulator vUtama kalkulator

(mkalkulator.php) (vutama.php) (kalkulator.php)
vHasil (vhasil.php)

Pada bagian Model, kita hanya akan membuat satu file model yaitu
mkalkulator.php. Pada model ini dalamnya akan terdapat fungsi penjumlahan
dan fungsi perkalian.
Pada bagian Controller, kita juga hanya membuat sebuah file controller yang
kita beri nama kalkulator.php. Di dalam controller ini terdapat fungsi-fungsi
pengaturan logika jalannya aplikasi kita.
Pada bagian View, kita akan membuat 2 buah file. File pertama (vutama.php)
berfungsi untuk menampilkan form input dari kalkulator, sedangkan file kedua
(vhasil.php) berfungsi untuk menampilkan hasil perhitungan kalkulator.

2. Langkah Pembuatan Aplikasi

a. Buat project/sistem codeigniter baru dengan nama kalkulatorku (misal :
C:/xampp/htdocs/kalkulatorku).
b. Atur file config.php di direktori system/application/config/ dengan mengatur
base_URL menjadi seperti berikut :

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

c. Atur file autoload.php di direktori system/application/config/ dengan

mengatur library dan helper menjadi seperti berikut :

$autoload['helper'] = array('url','form','html');
$autoload['library'] = array('table');

d. Atur file routes.php di direktori system/application/config/ dengan mengatur

default controller menjadi seperti berikut :

$route['default_controller'] = "kalkulator";

Pelatihan Web Framework CodeIgniter 2010 UAD (Oleh : Hasanuddin) 17

 e. Buat file mkalkulator.php pada direktori system/application/models, dan isi
dengan baris kode berikut ini :

<?php
Class mkalkulator extends Model {
function mkalkulator(){
parent::Model();
}
function penjumlahan($a, $b)
{
$hasil_jumlah = $a + $b;
return $hasil_jumlah;
}
function perkalian($i, $j)
{
$hasil_kali = $i * $j;
return $hasil_kali;
}
}
?>

f. Buat file kalkulator.php pada direktori system/application/controllers, dan isi

dengan baris kode di bawah ini:

<?php
class kalkulator extends Controller {
function kalkulator(){
parent::Controller();
}

function index(){
$this->load->view('vutama');
}

function hasil(){
$bil1 = $_POST['bil1'];
$bil2 = $_POST['bil2'];
$operasi = $_POST['operasi'];
if($operasi=='jumlah'){
$this->load->model('mkalkulator');
$data = array ( 'bil1' => $bil1, 'bil2' => $bil2, 'tanda' => '+', 'hasil' =>
$this->mkalkulator->penjumlahan($bil1,$bil2));
$this->load->view('vhasil',$data);
} else {

Pelatihan Web Framework CodeIgniter 2010 UAD (Oleh : Hasanuddin) 18

 $this->load->model('mkalkulator');
$data = array ( 'bil1' => $bil1, 'bil2' => $bil2, 'tanda' => 'X',
'hasil' => $this->mkalkulator->perkalian($bil1,$bil2));
$this->load->view('vhasil',$data);
}
}
}
?>

g. Buat file vutama.php pada direktori system/application/views, dan isi dengan

kode berikut ini :
<?php
echo heading('Aplikasi Kalkulatorku',3);
echo form_open('kalkulator/hasil');
$this->table->set_heading('Bilangan 1','Bilangan 2','Operasi');
$this->table->add_row(form_input('bil1'), form_input('bil2'),
form_dropdown('operasi', array('jumlah' => 'Penjumlahan', 'kali' =>
'Perkalian')));
$this->table->add_row('',form_submit('mysubmit','Hitung'),'');
echo $this->table->generate();
echo form_close();
?>

h. Buat file vhasil.php pada direktori system/application/views, dan isi dengan

kode berikut ini :
<?php
echo heading('Hasil Perhitungan',3);
echo $bil1.' '.$tanda.' '.$bil2.' = '.$hasil;
echo br(2).anchor('kalkulator','Hitung Lagi');
?>

i. Jalankan aplikasi dengan alamat URL di bawah ini :

http://localhost/kalkulatorku

Pelatihan Web Framework CodeIgniter 2010 UAD (Oleh : Hasanuddin) 19

 Sesi 5
Stud Kasus Aplikasi 2 (Simple PhoneBook)

1. Pendahuluan

Simple PhoneBook merupakan aplikasi sederhana untuk menampilkan dan

mengolah data berupa PhoneBook.
Arsitektur aplikasi tersebut adalah sebagai berikut :

Pada folder Model, kita hanya akan membuat satu file model saja yaitu
phone_model.php. Pada model ini kita akan membuat sebuah model dengan
nama Phone_model. Di dalamnya akan terdapat fungsi-fungsi yang
berhubungan dengan database. karena sudah jelas semua data kontak kita
akan disimpan di database.
Pada folder Controller, kita juga hanya membuat sebuah file controller yang
kita beri nama phone.php. Di dalam phone.php ini kita akan membuat sebuah
controller yang bernama Phone dimana akan terdapat fungsi-fungsi pengaturan
logika jalannya aplikasi kita.
Dan yang terakhir adalah pada folder Views, kita akan membuat 4 buah file
dimana masing-masing file views akan mempunyai tugas untuk menampilkan
data dari controller.

Pelatihan Web Framework CodeIgniter 2010 UAD (Oleh : Hasanuddin) 20

2. Langkah Pembuatan Aplikasi
a. Buat project/sistem codeigniter baru dengan nama phonebook (misal :
C:/xampp/htdocs/phonebook).
b. Atur file config.php di direktori system/application/config/ dengan mengatur
base_URL menjadi seperti berikut :

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

c. Atur file autoload.php di direktori system/application/config/ dengan

mengatur library dan helper menjadi seperti berikut :

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

d. Atur file routes.php di direktori system/application/config/ dengan mengatur

default controller menjadi seperti berikut :

$route['default_controller'] = "phone";

e. Buat database baru (Misal : menggunakan http://localhost/phpmyadmin)

dengan nama phonebookdb, kemudian jalankan SQL berikut (pada menu SQL) :

CREATE TABLE IF NOT EXISTS phdata (

id int(11) NOT NULL AUTO_INCREMENT,
name varchar(255) NOT NULL,
phone varchar(150) NOT NULL,
address varchar(255) DEFAULT NULL,
additional_desc varchar(255) DEFAULT NULL,
PRIMARY KEY (id)
) ENGINE=MyISAM DEFAULT CHARSET=latin1 AUTO_INCREMENT=5 ;

INSERT INTO `phdata` (`id`, `name`, `phone`, `address`, `additional_desc`)

VALUES
(1, 'Agus', '0361 568 985', 'Gianyar, Bali', 'Web Designer'),
(2, 'Budi', '021 958 5589', 'DKI Jakarta', 'System Programmer'),
(3, 'Made Gede', '0361 589 4786', 'Denpasar, bali', 'Service Komputer
panggilan'),
(4, 'Putu Putra', '0361 310 6985', 'Ubud, Bali', 'Cuma contoh doank..');

f. Atur koneksi ke database melalui file database.php di direktori

system/application/config/ sehingga menjadi seperti berikut :

$db['default']['hostname'] = "localhost";
$db['default']['username'] = "root";
$db['default']['password'] = "";
$db['default']['database'] = "phonebookdb";

Pelatihan Web Framework CodeIgniter 2010 UAD (Oleh : Hasanuddin) 21

 g. Buat file phone_model.php pada direktori system/application/models, dan isi
dengan baris kode berikut ini :

<?php
Class Phone_model extends Model {
function Phone_model(){
parent::Model();
}
function get_all()
{
$query = $this->db->query('select * from phdata order by id');
return $query->result();
}
function get_one($id)
{
$query = $this->db->query('select * from phdata where id='.$id);
return $query->result();
}
}
?>

h. Buat file phone.php pada direktori system/application/controllers, dan isi

dengan baris kode di bawah ini:

<?php
Class Phone extends Controller {
function Phone(){
parent::Controller();
}
function index(){
$this->show_all();
}
function show_all(){
$data['querys']=$this->phone_model->get_all();
$this->load->view('showall',$data);
}
function show_one($id){
$data['querys']=$this->phone_model->get_one($id);
$this->load->view('showone',$data);
}
}
?>

i. Buat file showall.php pada direktori system/application/views, dan isi dengan

kode berikut ini :

Pelatihan Web Framework CodeIgniter 2010 UAD (Oleh : Hasanuddin) 22

 <html>
<head>
<title>Web Phone Book 1.0 by Pande Putu Eka Putra</title>
</head>
<body>
<h1>Contact Listing:</h1>
<table cellpadding="5" cellspacing="1" border="1">
<tr>
<th>ID</th><th>Name</th><th>Phone
Number</th><th>Address</th><th>Additional
Descriptions</th><th>Action</th>
</tr>
<?php foreach($querys as $rows){?>
<tr>
<td><?php echo $rows->id;?></td>
<td><?php echo $rows->name;?></td>
<td><?php echo $rows->phone;?></td>
<td><?php echo $rows->address;?></td>
<td><?php echo $rows->additional_desc;?></td>
<td><?php echo anchor('phone/show_one/'.$rows->id,'Detail');?></td>
</tr>
<?php }?>
</table>
</body>
</html>

j. Buat file showone.php pada direktori system/application/views, dan isi dengan

kode berikut ini:

<html><head>
<title>Web Phone Book 1.0 by Pande Putu Eka Putra</title>
</head>
<body><h1>Contact Detail:</h1>
<table cellpadding="5" cellspacing="1" border="1">
<?php foreach($querys as $rows) {?>
<tr><td>ID</td><td><?php echo $rows->id;?></td></tr>
<tr><td>Name</td><td><?php echo $rows->name;?></td></tr>
<tr><td>Phone</td><td><?php echo $rows->phone;?></td></tr>
<tr><td>Adress</td><td><?php echo $rows->address;?></td></tr>
<tr><td>Desc</td><td><?php echo $rows->additional_desc;?></td></tr>
<?php } ?>
</table>
<?php
echo "<br>".anchor('phone','Kembali');
?>
</body></html>

Pelatihan Web Framework CodeIgniter 2010 UAD (Oleh : Hasanuddin) 23

 k. Jalankan aplikasi dengan alamat URL di bawah ini :

http://localhost/phonebook

Pelatihan Web Framework CodeIgniter 2010 UAD (Oleh : Hasanuddin) 24

 Sesi 6
Stud Kasus Aplikasi 3 (Gallery)

1. Pendahuluan
Gallery merupakan aplikasi sederhana untuk mengupload dan menampilkan list
file yang telah diupload.
Arsitektur aplikasi tersebut adalah sebagai berikut :

Model View Controller

mgallery gallery_view gallery

(mgallery.php) (gallery_view.php) (gallery.php)
gallery_lihat
(gallery_lihat.php)

Pada bagian Model, kita hanya akan membuat satu file model untuk operasi
upload file.
Pada bagian Controller, kita juga hanya membuat sebuah file dimana akan
terdapat fungsi-fungsi pengaturan logika jalannya aplikasi kita.
Pada folder Views, kita akan membuat 2 buah file. Pertama file untuk
menampilkan form upload file dan kedua file untuk menampilkan list file yang
diupload.

2. Langkah Pembuatan Aplikasi

a. Buat project/sistem codeigniter baru dengan nama gallery (misal :
C:/xampp/htdocs/gallery).
b. Atur file config.php di direktori system/application/config/ dengan mengatur
base_URL menjadi seperti berikut :

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

c. Atur file autoload.php di direktori system/application/config/ dengan

mengatur helper menjadi seperti berikut :

$autoload['helper'] = array('url','form','file','html');

d. Atur file routes.php di direktori system/application/config/ dengan mengatur

default controller menjadi seperti berikut :

$route['default_controller'] = "gallery";

Pelatihan Web Framework CodeIgniter 2010 UAD (Oleh : Hasanuddin) 25

 e. Buat folder images di root application sehingga akan tercipta direktori :
System/application/images/

f. Buat folder thumbs di folder images sehingga akan tercipta direktori :

System/application/images/thumbs/

g. Buat file mgallery.php pada direktori system/application/models, dan isi

dengan baris kode berikut ini :

<?php
class MGallery extends Model{
var $gallery_path;

function MGallery(){
parent::Model();
$this->gallery_path = realpath(APPPATH . 'images');
}
function do_upload(){
$config = array(
'allowed_types'=>'jpg|jpeg|gif|png',
'upload_path' => $this->gallery_path,
'max_size' => 2000
);

$this->load->library('upload',$config);
$this->upload->do_upload();
$image_data = $this->upload->data();

$config = array(
'source_image'=> $image_data['full_path'],
'new_image'=>$this->gallery_path . '/thumbs',
'maintain_ration'=>true,
'width'=>160,
'height'=>120
);

$this->load->library('image_lib', $config);
$this->image_lib->resize();
}
}
?>

h. Buat file gallery.php pada direktori system/application/controllers, dan isi

dengan baris kode di bawah ini:

Pelatihan Web Framework CodeIgniter 2010 UAD (Oleh : Hasanuddin) 26

 <?php
class Gallery extends Controller{
function Gallery(){
parent::Controller();
}
function index(){
$this->load->model('MGallery');

if($this->input->post('upload')){
$this->MGallery->do_upload();
}
$this->load->view('gallery_view');
}

function lihat(){
$this->load->view('gallery_lihat');
}
}
?>

i. Buat file gallery_view.php pada direktori system/application/views, dan isi

dengan kode berikut ini :

<?php
echo form_open_multipart('gallery');
echo form_upload('userfile');
echo form_submit('upload','Upload');
echo form_close();
echo br(1).anchor('gallery/lihat','Lihat Gallery');
?>

j. Buat file gallery_lihat.php pada direktori system/application/views, dan isi

dengan kode berikut ini:

<?php
echo heading('Daftar File Dalam Gallery',3);
$data = get_filenames('system/application/images/thumbs/');
foreach($data as $df)
{
echo $df.br(1);
}
echo br(1).anchor('gallery','Input Gallery Lagi');
?>

Pelatihan Web Framework CodeIgniter 2010 UAD (Oleh : Hasanuddin) 27

 k. Jalankan aplikasi dengan alamat URL di bawah ini :

http://localhost/gallery

Pelatihan Web Framework CodeIgniter 2010 UAD (Oleh : Hasanuddin) 28

 DAFTAR PUSTAKA

1. David Upton, CodeIgniter for Rapid PHP Application Development, PACKT

Publishing, Birmingham-Mumbai, 2007.
2. Thomas Myer, Creating a Blogging Tool with CodeIgniter, Wiley Publishing,
Indianapolis, 2009.
3. Wiwit Siswoutomo, PHP Undercover : Mengungkap Rahasia Pemrograman PHP,
Elexmedia Komputindo, Jakarta, 2004.

Pelatihan Web Framework CodeIgniter 2010 UAD (Oleh : Hasanuddin) 29