Membangun Web Menggunakan CodeIgniter 3. Riski Annisa, M.Kom

Membangun Web

Menggunakan CodeIgniter 3

Riski Annisa, M.Kom

Pertemuan 1

Web Programming

Riski Annisa, M.Kom RNC

Kontrak Perkuliahan

Kontrak Perkuliahan

• Datang tepat waktu

• Wajib mempunyai modul

• Membawa laptop yang sudah terinstal aplikasi

1. XAMPP/ WAMP/ dll

2. Editor Web (Sublime, Dreamweaver, dll)

• Ketidakhadiran max 3 kali pertemuan, lebih dari itu nilai akhir max. C

• Kehadiran berisi Hadir dan Tidak Hadir

Peraturan

• Sediakan Alat Tulis

• Berpakaian rapi dan bersepatu

• Tidak diperbolehkan menggunakan headset/earphone

• Menyimpan alat komunikasi di tas

• Fokus

Ketentuan Kelompok dan Tugas

• Bentuk kelompok min 3 org atau max 5org

• Kelompok wajib mengisi lembar kerja tim dengan format sbb:

Materi Pertemuan 1

Website yang Menggunakan Web Codeigniter

• Framework adalah sebuah struktur konseptual

dasar yang digunakan untuk memecahkan sebuah permasalahan atau isu-isu kompleks

Keuntungan Framework

• Menghemat Waktu Pengembangan – Dengan struktur dan library yang telah disediakan oleh framework maka tidak perlu lagi memikirkan hal-hal tersebut, jadi Anda hanya fokus ke

proses bisnis yang akan dikerjakan.

• Reuse of code – Dengan menggunakan framework maka

perkerjaan kita akan memiliki struktur yang baku, sehingga kita dapat menggunakanya kembali di proyek-proyek lainnya.

• Bantuan komunitas - Ada komunitas-komunitas yang siap

membantu jika ada permasalahan, selain itu juga bisa berbagi ilmu sehingga dapat meningkatkan kemampuan pemrograman kita.

• Kumpulan best practice – sebuah framework merupakan kumpulan best practice yang sudah teruji. Jadi kita dapat meningkatkan kualitas kode kita.

Kenapa Menggunakan Framework?

• Didalam sebuah framework biasanya sudah tersedia struktur aplikasi yang baik,

• standard coding (1),

• best practice (2) dan

• design pattern (3),

• dan common function (4).

• Framework web untuk PHP:

• Codeigniter • Symfony

• Yii • CakePHP

• Slim framework • Phalcon

• Zend framework • Kohana

• Laravel • FuelPHP, dll

Apa itu Codeigniter?

• CodeIgniter adalah sebuah web application

framework yang bersifat open source digunakan untuk membangun aplikasi php dinamis.

• Tujuan utama pengembangan Codeigniter adalah untuk membantu developer untuk mengerjakan aplikasi lebih cepat daripada menulis semua code dari awal.

• CodeIgniter diperkenalkan kepada public pada tanggal 28 februari 2006.

Apa Kelebihan CodeIgniter?

• Kecepatan. Berdasarkan hasil benchmark CodeIgniter merupakan salah satu framework PHP tercepat yang ada saat ini.

• Mudah dimodifikasi dan beradaptasi. Sangat mudah memodifikasi behavior framework ini. Tidak membutuhkan server requirement yang macam-macam serta mudah mengadopsi library lainya.

• Dokumentasi lengkap dan jelas. Bahkan tanpa buku ini pun

CodeIgniter sebenarnya telah menyediakan sebuah panduan yang lengkap mengenai CodeIgniter. Semua informasi yang anda

butuhkan tentang codeigniter ada disana.

• Learning Curve Rendah. CodeIgniter sangat mudah dipelajari.

Dalam pemilihan framework hal ini sangat penting diperhatikan karena kita juga harus memperhatikan skill dari seluruh anggota team. Jika sebuah framework sangat sulit dipelajari maka akan beresiko untuk memperlambat team development anda.

MVC

• MVC adalah konsep dasar yang harus diketahui sebelum mengenal CodeIgniter .

• MVC adalah singkatan dari Model View Controller.

• MVC sebenarnya adalah sebuah pattern/teknik

pemogramanan yang memisahkan bisnis logic (alur pikir), data logic (penyimpanan data) dan

presentation logic (antarmuka aplikasi) atau secara sederhana adalah memisahkan antara desain, data dan proses.

MVC dan PHP biasa

MVC - Model

• Model berhubungan dengan data dan interaksi ke database atau webservice.

• Model juga merepresentasikan struktur data dari aplikasi yang bisa berupa basis data maupun data lain, misalnya dalam bentuk file teks, file XML

maupun webservice.

• Model akan berisi class dan fungsi untuk mengambil, melakukan update dan menghapus data website.

• Sebuah aplikasi web biasanya menggunakan basis data dalam menyimpan data, maka pada bagian

Model biasanya akan berhubungan dengan perintah- perintah query SQL.

MVC - View

• View berhubungan dengan segala sesuatu yang akan ditampilkan ke end-user.

• Bisa berupa halaman web, rss, javascript dan lain-lain.

• Dalam view harus menghindari adanya logika atau pemrosesan data didalamnya.

• Di dalam view hanya berisi variabel-variabel yang berisi data yang siap ditampilkan.

• View dapat dikatakan sebagai halaman website yang

dibuat dengan menggunakan HTML dan bantuan CSS atau JavaScript.

• Di dalam view jangan pernah ada kode untuk melakukan koneksi ke basisdata. View hanya dikhususkan untuk

menampilkan data-data hasil dari model dan controller

MVC - Controller

• Controller bertindak sebagai penghubung data dan view.

• Di dalam Controller inilah terdapat class-class dan fungsi- fungsi yang memproses permintaan dari View ke dalam struktur data di dalam Model.

• Controller juga tidak boleh berisi kode untuk mengakses basis data karena tugas mengakses data telah diserahkan kepada model.

• Tugas controller adalah menyediakan berbagai variabel yang akan ditampilkan di view, memanggil model untuk melakukan akses ke basis data, menyediakan penanganan kesalahan/error, mengerjakan proses logika dari aplikasi serta melakukan validasi atau cek terhadap input.

Apa Object Oriented Programming (OOP)?

• Object Oriented Programming (OOP) merupakan paradigma pemrograman yang berorientasikan kepada obyek.

• Semua data dan fungsi pada paradigma ini

dibungkus dalam kelas-kelas atau obyek-obyek.

• Konsep dari OOP sendiri adalah semua pemecahan masalah dibagi ke dalam obyek.

• Dalam konsep OOP data dan fungsi-fungsi yang akan mengoperasikannya digabungkan menjadi satu kesatuan yang dapat disebut sebagai obyek.

Apa itu Object?

• Sebuah obyek adalah kumpulan dari variabel

dan fungsi yang dibungkus menjadi satu entitas.

Entitas tersebut dapat berupa variabel biasa.

• Sebuah obyek diciptakan melalui sebuah kelas atau dengan istilah instance of class.

• Obyek memiliki 2 elemen utama:

1. Attributes atau Properties: Yaitu nilai-nilai yang tersimpan dalam objek tersebut dan secara

langsung maupun tidak langsung menentukan karakteristik dari obyek tersebut.

2. Method: Yaitu suatu aksi yang akan dijalankan atau dikerjakan oleh obyek tersebut.

Apa itu Class?

• Class dapat didefinisikan sebagai struktur data atau cetak biru dari suatu obyek.

• Lebih jelasnya adalah sebuah bentuk dasar atau blueprint yang mendefinisikan variabel, method umum pada semua obyek.

• Obyek sendiri adalah kumpulan variabel dan fungsi yang dihasilkan dari template khusus atau disebut class.

• Obyek adalah elemen pada saat run-time yang akan

diciptakan, dimanipulasi, dan dibuang/di-destroy ketika eksekusi.

<?php

/** Contoh kelas **/

class Kendaraan{}

/*** end of class

***/

?>

Source Code

<?php

/** contoh kelas **/ class kendaraan{

/*** property class ***/ private $warna;

private $jumlah_pintu; private $jumlah_roda;

public $harga;

public $merk;

/*** method class ***/

public function construct(){

echo 'ini adalah object kendaraan. <br />';

}

public function set_harga($harga){

$this->harga = $harga;

}

public function show_harga(){

echo 'harga kendaraan : rp.'.$this->harga.'. <br />';

}

public function jalan(){

echo 'brrroooooom!!!';

} }

/*** end of class ***/

/** contoh object **/

#mengcreate object $saya_adalah_object dari class kendaraan

$saya_adalah_object= new kendaraan;

$saya_adalah_object->set_harga(100000);

$saya_adalah_object->show_harga();

$saya_adalah_object->jalan();

• Setiap property dan method memiliki identifier.

Identifier-lah yang mengatur bagaimana property dan method digunakan.

• Identifier tersebut adalah public, private dan protected.

• Private berarti method atau property yang ada di dalam suatu kelas hanya bisa diakses di dalam kelasnya.

• Sedangkan pada method atau property yang bersifat public berarti method atau property tersebut bisa diakses di dalam dan di luar kelas.

Inheritance

• Inheritance atau dalam bahasa Indonesianya disebut sebagai pewarisan adalah suatu cara untuk membuat sebuah kelas yang baru dengan menggunakan kelas lain yang sebelumnya sudah dibuat.

• Pada hubungan inheritance, sebuah class turunan mewarisi kelas leluhur (parent class).

• Oleh karena mewarisi, maka semua atribut dan method class dari induk akan dibawa (kecuali yang bersifat

private), secara intrinsik menjadi bagian dari class anak.

• Adapun keuntungan yang didapat dari inheritance

menambah fitur baru pada kelas anak dan mengubah atau mengganti fitur yang diwarisi dari kelas parent

Source Code

<?php

/* inheritance.php */

class Bapak {

private $nama ="Bapak";

function Bapak($n) {

$this->nama = $n;

}

function Hallo() {

echo "Halo, saya $this->nama <br>";

} }

class Anak extends Bapak { function Hai(){

Echo “hai dari kelas anak”;

} }

$test = new Anak("Anak dari Bapak");

$test->Hallo();

Pertemuan 2

(Web Programming)

Riski Annisa, M. Kom

Instalasi CodeIgniter

• Untuk melakukan instalasi Codeigniter ini sangatlah mudah, cukup mengikuti langkah-langkah sebagai berikut:

Langkah 1: Download Codeigniter dari link berikut ini:

https://www.codeigniter.com

Langkah 2: Unzip file tersebut

Langkah 3: Pindahkan semua file dan folder ke server local atau server development anda

Langkah 4: setelah selesai dipindahkan, bukalah URL dari server anda, misalnya: http://localhost/codeigniter3 atau yang lainnya sesuaikan dengan saat folder dipindahkan.

• Dan saat anda membuka URL tersebut, akan terlihat tampilan sebagai berikut.

Arsitektur CodeIgniter

• Arsitektur dari framework Codeigniter dapat dilihat pada gambar berikut ini:

• Seperti terlihat pada alur kerja pada gambar, terlihat bahwa setiap ada request menuju Codeigniter, selalu ditampung dan diarahkan ke file index.php.

• Routing akan menentukan apakah akan melanjutkan request ke tahap 3 untuk proses caching ataukah ke tahap 4 untuk dilakukan pengecekan keamanan.

• Jika halaman yang di request telah ada dalam Caching, maka Routing akan melewatkan request ke tahap 3 dan

mengembalikan respon dari caching ke user.

• Namun jika halaman yang di request tidak terdapat dalam Caching, maka Routing akan melewatkan request ke tahap 4 untuk dilakukan pengecekan Security.

• Sebelum melewatkan request ke Application Controller, fitur Security akan melakukan pengecekan pada data yang disubmit oleh user. Setelah dilakukan pengecekan, Application Controller me-load Model, Library, Helper, Plugin, dan Script untuk

kemudian dilewatkan ke View.

• View akan melakukan render pada halaman yang di request dan menyimpannya dalam Caching, dan karena halaman yang di request tidak terdapat dalam caching sebelumnya, maka kali ini halaman ini akan di simpan dalam Caching agar permintaan pada halaman yang sama kedepannya dapat dilakukan dengan lebih cepat.

Struktur Direktori

• Folder application

• Cache: folder ini berisi semua halaman yang telah di cache dalam aplikasi kita.

Halaman yang telah di cache inilah yang nantinya

dapat mempercepat akses pada halaman-halaman yang sering di akses.

• Config: folder ini berisi berbagai file yang berisi konfigurasi aplikasi kita. Dengan bantuan file config.php, kita dapat mengkonfigurasi aplikasi kita. Sedangkan untuk mengkonfigurasi koneksi database, kita dapat menggunakan file

database.php.

• Controller: folder ini berisi file-file controller dari aplikasi kita, dan ini merupakan bagian paling dasar dari aplikasi yang kita kembangkan.

• Core: folder ini berisi Class-Class utama aplikasi kita.

• Helpers: folder ini berisi Class-Class buatan kita yang merupakan penambahan fungsi dari Class helper yang sudah ada dan dapat membantu pengembangan aplikasi.

• Hooks: file-file dalam folder ini dimaksudkan untuk melakukan perubahan cara kerja dalam system core codeigniter.

• Language: berisi file-file yang berhubungan dengan Bahasa.

• Libraries: folder ini berisi Class-Class buatan kita yang dapat membantu aplikasi kita.

• Logs: merupakan folder yang berisi file-file yang berhubungan dengan log dari system codeigniter.

• Models: database method akan diletakkan dalam folder ini.

• Third_party: dalam folder ini kita dapat meletakkan plugin dari berbagai sumber untuk digunakan dalam aplikasi kita, misalnya plugin phpexcel, tinyMCE, dan lain sebagainya.

• Views: folder tempat kita meletakkan file-file HTML kita.

Folder system

• Core: folder ini berisi kode-kode core framework Codeigniter. Jangan mengubah apapun yang ada dalam folder ini. Semua yang anda lakukan berada dalam folder application.

Bahkan jika anda bermaksud untuk menambah fungsi dalam core

Codeigniter, yang perlu anda

lakukan adalah menggunakan fitur hooks, dan folder hooks terletak dalam folder application.

• Database: folder database berisi driver-diver database dan file-file pendukung database.

• Fonts: berisi file-file yang berhubungan dengan font.

• Helpers: folder ini berisi class-class helper standart Codeigniter (misalnya date, cookie, dan URL

helper).

• Language: dalam folder ini berisi file-file bahasa.

• Libraries: berisi library standart yang digunakan dalam framework Codeigniter untuk membantu anda mempercepat proses pengembangan aplikasi yang berhubungan dengan email, calender, upload file, dan masih banyak lagi. Anda juga dapat

membuat sendiri library anda atau melakukan extend, atau bahkan melakukan overwrite atau mengganti library standart, tetapi class tersebut harus diletakkan dalam folder application/libraries agar terpisah dengan library standart Codeigniter.

Hal ini penting dilakukan agar proses upgrade maupun update system pada core framework Codeigniter dapat dengan mudah dilakukan.

Folder user_guide

• Folder ini, sesuai dengan namanya, dapat kita tebak jika berisi file-file

dokumentasi dari framework Codeigniter.

• File-file ini bersifat offline, sehingga dapat membantu

kita mempelajari fungsi-fungsi yang terdapat pada berbagai macam library, helper, dan class-class.

Framework MVC

CodeIgniter

Controller

• Layer ini merupakan bagian yang menjadi jembatan antara layer Model dan layer View, maupun bagian lain yang dibutuhkan dalam proses HTTP request sehingga dihasilkan sebuah halaman WEB.

Model

• Layer ini merupakan layer yang menangani struktur data. Biasanya layer ini berisi metode atau fungsi- fungsi yang membantu retrieve, insert, update, dan delete informasi yang ada dalam database.

View

• Layer ini merupakan leyer presentasi kepada user.

Sebuah view biasanya berupa sebuah halaman WEB, tetapi dalam Codeigniter, sebuah view juga dapat berupa bagian dari halaman utuh WEB.

Misalnya hanya berisi sebuah header, footer, menu atas, RSS, atau yang lainnya.

Membuat CodeIgniter

Membuat Class Controller

• Untuk membuat sebuah Class Controller pada framework Codeigniter, yang perlu dilakukan

adalah membuka folder application/controllers.

• Di dalam folder ini anda akan menemukan 2 buah file, index.html dan Welcome.php. File-file ini

merupakan file default yang ada dalam Codeigniter.

• Buatlah sebuah file dalam folder yang sama dengan kedua file tersebut, kemudian beri nama

“Percobaan.php”. Tetapi yang perlu anda ingat

adalah, untuk penamaan file controller huruf besar dan kecil sangatlah berpengaruh, dan disarankan untuk controller gunakanlah huruf besar untuk huruf pertama penamaannya. Setelah itu bukalah file tersebut dengan editor SublimeText atau editor lainnya.

• Kemudian tuliskan kode dibawah ini dalam file tersebut.

• Class Percobaan merupakan extends dari Class CI_Controller yang merupakan bawaan dari

framework Codeigniter. Class-class yang nantinya anda buat harus melakukan extends class

CI_Controller.

Memanggil Controller

• Class controller pada file “Percobaan.php” dapat dipanggil menggunakan URI berikut:

• Dapat dilihat, kata “percobaan” pada URI di atas setelah index.php, merupakan nama dari Class Controller.

• Sesuai dengan pemberian nama Class “Percobaan”, kita cukup menuliskan “percobaan” setelah index.php.

• Pemberian nama Class dalam Codeigniter harus

menggunakan huruf besar pada huruf pertama nama Class, tetapi pada saat pemanggilan dalam URI, kita cukup menggunakan huruf kecil saja.

• Segmen-segment pada URL pada codeigniter

mencerminkan Controller yang dipanggil. Contoh:

http://www.domainsaya.com/class/fungsi/id maka domain tersebut dapat dipecah menjadi bagian-

bagian diantaranya:

• Adapun komponen-komponen URL adalah:

• Konfigurasi Base Url, Bagian ini merupakan url yang kita masukkan pada konfigurasi base_url yang berupakan url paling dasar untuk mengakses web atau aplikasi kita

• Segmen URI pertama yaitu class. Class tersebut

merupakan nama kelas controller yang akan kita panggil.

Apabila segment ini kosong maka akan digantikan dengan default controller yang telah disetting di konfigurasi router.php

• Segmen URI kedua yaitu fungsi dari class controller yang telah kita panggil tadi. Apabila segment kedua ini kosong maka fungsi yang dipanggil adalah fungsi index dari kelas controller tersebut

• Segmen URI ketiga biasanya berisi parameter dari fungsi.

Jika fungsi dari controller yang dipanggil mempunyai parameter maka parameternya harus dimasukkan sebagai segment URI sesuai urutan.

Membuat dan Memanggil Constructor Method

• Selanjutnya, ubah sedikit kode-kode pada Class Percobaan yang telah kita buat tadi, menjadi seperti di bawah ini:

• Dengan kode di atas, kita dapat melakukan 3 cara pemanggilah URI sebagai berikut:

• http://localhost/codeigniter3/index.php/percobaan

• http://localhost/codeigniter3/index.php/percobaan/index

• http://localhost/codeigniter3/index.php/percobaan/halo

Noted:

1. Nama dari sebuah Class Controller harus diawali dengan huruf besar.

2. Pada URI Class Controller harus dipanggil menggunakan huruf kecil.

3. Jangan menggunakan nama yang sama antara nama Class dengan nama Method, karena akan mengakibatkan fungsi Parent Class di overwrite.

Membuat View

• Pada bagian view yang merupakan presentation layer, kita dapat membuat sebuah tampilan yang sederhana atau kompleks.

• View juga dapat berupa bagian-bagian sederhana seperti header, footer, menu atau lainnya.

• View ini tidak dapat diakses secara langsung, melainkan harus dipanggil melalui sebuah Controller.

Langkah yang perlu kita lakukan adalah sebagai berikut:

• Buatlah sebuah file baru di dalam folder application/views dan berilah nama

view_percobaan.php

• Setelah file dibuat, bukalah file tersebut dengan editor favorit anda.

• Kemudian tuliskan kode dibawah ini.

Memanggil View

• Kemudian tambahkan sebuah method baru dalam file controller percobaan.php, dengan kode seperti di bawah ini.

• Sebuah file view dapat dipanggil melalui Controller dengan kode di bawah ini:

• dan jika anda ingin mengakses file-file view yang ada di dalam sebuah direktori, maka bentuk kode yang harus dijalankan adalah sebagai berikut:

• tidak perlu menambahkan ekstensi file “.php”, kecuali kita membuat file view yang berekstensi selain php.

Membuat Class Model

• Class model di desain untuk bekerja dengan informasi yang tersimpan di dalam database.

• Sebagai contoh, jika anda menggunakan

Codeigniter untuk memanajemen users dalam aplikasi yang anda buat, maka anda harus

membuat sebuah Class Model yang didalamnya terdapat method atau fungsi-fungsi untuk:

• mengambil seluruh record,

• mengambil detail sebuah record,

• menambah record,

• mengupdate record, dan

• menghapus record dari data tabel users dalam database.

• Buatlah file Class Model yang tersimpan dalam folder application/models, dan kode dasar untuk pembuatan sebuah Class Model adalah sebagai berikut:

• Dimana Nama_model adalah nama dari Class model dan nama filenya adalah Nama_model.php. Setiap Class model yang kita buat harus inherit atau

merupakan extends dari Codeigniter Class CI_Model.

Memanggil Model

• Model dapat dipanggil melalui Controller. Berikut ini adalah kode untuk memanggil model.

• dimana nama_model adalah nama model yang akan kita panggil. Setelah proses pemanggilan,

anda dapat dengan mudah menggunakan method yang ada didalamnya dengan cara pemanggilan sebagai berikut:

Routing

• Codeigniter memiliki system routing URI yang sangat user friendly, artinya mudah dibaca atau dipahami.

• Dengan system ini kita dapat dengan mudah me “re route” sebuah URL.

• Biasanya, terdapat hubungan one to one antara sebuah URL string dengan Controller/method() -nya.

• Default segment lengkap URI pada framework

codeigniter desain paternnya adalah sebagai berikut:

• dimana segmen pertama (terhitung setelah index.php), merupakan nama class atau nama controller.

• Segmen kedua merupakan pemanggilan terhadap

method atau fungsi tertentu dalam sebuah class dalam controller.

• Segment ketiga merupakan ID yang akan dikirimkan ke controller

Tersedia file khusus untuk melakukan kustomisasi routing pada framework Codeigniter ini. File ini terletak pada

folder application/config/route.php.

Pertemuan 3

(Web Programming)

Riski Annisa, M.Kom

Memahami Penggunaan Konsep MVC

(Non Database)

• Pertama, buatlah sebuah file model dengan nama M_mvc.php, kemudian simpan pada

latihanci/application/models.

Penjelasan code…

• Baris ke-2, digunakan untuk membuat kelas m_mvc.

Perintah extends digunakan untuk memanggil semua fungsional controller CodeIgniter. Istilahnya adalah diwariskan atau diturunkan (inherit).

• Baris ke-4, digunakan untuk membuat fungsi mvc.

• Baris ke-5, digunakan untuk membuat sebuah variable kalimat ($kalimat) yang mana variable tersebut

menyimpan suatu nilai. Nilai disini adalah suatu kalimat

“Konsep MVC Non Database”.

• Baris ke-6, terdapat sebuah perintah return, di mana perintah return digunakan untuk mengakhiri suatu fungsi dan mengembalikan atau memberikan suatu nilai pada fungsi yang bersangkutan.

• Selanjutnya, buatlah file controller dengan nama C_mvc.php dan simpan file tersebut pada folder latihanci/application/controllers

Penjelasan code…

• Baris ke-2, digunakan untuk membuat kelas C_mvc.

Perintah extends digunakan untuk memanggil semua fungsionalitas controller CodeIgniter

• Baris ke-4, digunakan untuk membuat fungsi index

• Baris ke-5, digunakan untuk me-load/memanggil file model bernama M_mvc.php pada folder model.

• Baris ke-6, terdapat sebuah variable $data dengan nama 'tes' yang digunakan untuk menyimpan nilai untuk menjalankan fungsi mvc pada kelas M_mvc.

• Baris ke-7, digunakan untuk me-load/memanggil file V_mvc.php, dimana didalamnya telah mengandung

$data.

• Pada controller M_mvc memanggil file view v_mvc.php maka buatlah file nya pada folder latihanci/application/views

Membuat Form pada

CodeIgniter

• Untuk membuat form CodeIgniter, harus

memanggil helper form terlebih dahulu dan di buat codenya di bagian controller

Pada html

di CodeIgniter

Form

Input type Text

Pada html

di CodeIgniter

Form Hidden

Pada html

di CodeIgniter

Form Hidden(2)

Pada html

di CodeIgniter

Dropdown

Pada html

di CodeIgniter

CheckBox

Pada html

di CodeIgniter

Submit

Pada html

di CodeIgniter

Pertemuan 4

(Web Programming)

Riski Annisa, M.Kom

Operasi CRUD

(Create-Read-Update-Delete)

• Operasi CRUD merupakan suatu kewajiban dasar yang harus dikuasai untuk membangun suatu aplikasi.

• Dengan operasi CRUD user dapat memasukkan data baru, melihat struktur data, memperbarui data sampai pada penghapusan data.

• Database yang akan digunakan pada operasi CRUD ini adalah database MySQL. Perlu diketahui bahwa

codeigniter tidak hanya mendukung MySQL saja

sebagai database-nya tetapi juga mendukung MySQLi, PostgreSQL, ODBC, Ms.SQL, SQLite, dan Oracle.

Membuat Database

• Langkah pertama adalah membuat database dengan nama kampus, selanjutnya buat tabel dengan nama tblmahasiswa sebagai berikut:

Nama Fields Tipe data Size Ket

nim Varchar 10 Primary Key

nama Varchar 30

kelas Varchar 10

Konfigurasi Database

• Untuk melakukan konfigurasi database pada framework codeigniter cukup membuka file database.php yang berada pada folder

latihanci/application/config

Ubah menjadi →

• Sebelum menjalankan operasi database, ada library helper yang harus sudah di load.

• Helper yang harus di-load dapat di-set melalui file autoload.php yang ada di dalam

latihanci/application/config

• Hal tersebut dilakukan agar library dan helper di- load pada file controller

Diubah menjadi →

Diubah menjadi →

Operasi Create

Menambah Data

• Buatlah file model dengan nama Mmahasiswa.php kemudian simpan file tersebut di dalam folder

latihanci/application/model

Penjelasan Code…

• Baris ke-2 digunakan untuk membuat kelas Mmahasiswa.

• Baris ke-4 digunakan untuk membuat fungsi tambah

• Baris ke-5 sampai 7 digunakan untuk menyimpan nilai pengiriman data pada variabel POST ke dalam masing-masing variable yang sudah ditentukan.

• Baris ke-8 sampai 10 digunakan untuk memasukkan variable yang telah dibentuk di atas ke dalam nilai array yang mana nilainya disimpan pada $data

• Langkah selanjutnya kita membuat file controller dengan nama Mhs.php dan simpan file ke dalam folder latihanci/application/controller

Penjelasan Code …

• Baris ke-2 digunakan untuk membuat kelas Mhs

• Baris ke-4 digunakan untuk membuat fungsi add_mahasiswa

• Baris ke-5 apabila dikirim oleh variable POST bernama submit maka lakukan eksekusi selanjutnya

• Baris ke-6 digunakan untuk memanggil file model bernama mmahasiswa

• Baris ke-7 digunakan untuk menjalankan perintah pada fungsi tambah yang berada pada kelas mmahasiswa. Disini proses penyimpanan data dilakukan

• Baris ke-8 digunakan untuk mengalihkan/mengarahkan (redirect) URL pada posisi mhs/index

• Baris ke-10 digunakan untuk memanggil file view mahasiswa_tambah.php

• Buat form view di latihanci/application/view dengan nama file mahasiswa_tambah.php

mahasiswa_tambah.php

====================================

====

<!DOCTYPE html>

<html>

<head>

<title>Form Tambah Mahasiswa</title>

</head>

<body>

<h1>Form Tambah Mahasiswa</h1>

<?php echo

form_open('Mhs/add_mahasiswa'); ?>

<table>

<tr>

<td>NIM</td>

<td>:</td>

<td>

<?php

$Nim = array('name' => 'nim', 'maxlength' => '15',

'value' => '', 'size' => '20' );

echo form_input($Nim);

?>

</td>

</tr>

<tr>

<td>Nama</td>

<td>:</td>

<td><?php

$Nama = array('name' =>

'nama',

'maxlength' => '100', 'value' => '',

'size' => '30' );

echo form_input($Nama);

?>

</td>

</tr>

<tr>

<td>Kelas</td>

<td>:</td>

<td>

<?php

$Kelas = array('name' => 'kelas', 'maxlength' => '10',

'value' => '', 'size' => '30' );

echo form_input($Kelas);

?>

</td>

</tr>

</table>

<?php echo

form_submit('submit','SIMPAN');?>

<?php echo form_close(); ?>

</body>

</html>

Pertemuan 5

(Web Programming)

Riski Annisa, M.Kom

Operasi Read

Menampilkan Data

• Buka kembali file model Mmahasiswa.php,

kemudian tambahkan skrip program yang tercetak tebal di bawah ini untuk membuat fungsi baru

bernama tampil().

Penjelasan code …

• Baris ke-14 digunakan untuk membuat fungsi tampil

• Baris ke-15 digunakan untuk mengambil seluruh data pada tabel komentar. Query-nya akan sama dengan query (select * from tblmahasiswa)

• Baris ke-16 terdapat fungsi num_rows dimana num_rows berfungsi untuk menghitung jumlah data yang ada. Jadi, jika jumlah dari variable $tampil yang merupakan vaariabel untuk menyimpan seluruh data pada tabel tblmahasiswa lebih dari 0 maka lakukan eksekusi selanjutnya.

• Baris ke-17 digunakan untuk melakukan perulangan ke dalam bentuk variable baru bernama $data.

• Baris ke-18 digunakan untuk mengubah setiap data pada variable

$data menjadi kumpulan array ke dalam variable $hasil

• Baris ke-20 terdapat sebuah perintah return dimana perintah return digunakan untuk mengakhiri suatu fungsi dan

mengembalikan atau memberikan suatu nilai pada fungsi yang bersangkutan.

• Selanjutnya, edit fungsi index pada pada file controller yang sudah dibuat. Buka lagi file

Mhs.php pada latihanci/application/controller

Penjelasan code …

• Baris ke-14 digunakan untuk memanggil file model bernama Mmahasiswa.php

• Baris ke-15 terdapat sebuah variable $data dengan nama hasil yang digunakan untuk menyimpan nilai untuk menjalankan perintah fungsi tampil pada kelas mmahasiswa, dimana perintah tersebut untuk

menampilkan data pada tabel komentar

• Baris ke-16 sampai 19 digunakan untuk menampilkan pesan yg dibuat oleh sintax javascript

• Baris ke-20 digunakan untuk memanggil file

mahasiswa_tampil.php yang nantinya akan dibuat di view yang didalamnya mengandung $data.

• Karena skrip controller memanggil view bernama mahasiswa_tampil.php maka buat file tersebut dan simpan di latihanci/application/views

Penjelasan code …

• Baris ke-7 digunakan untuk menampilkan teks Tambah Data pada halaman web dimana teks tersebut berfungsi untuk membuat lik URL untuk menampilkan halaman tambah data. Code tersebut dalam HTML seperti:

• <a href=“tujuan-link-url”>Tambah Data</a>

• Baris ke-17 artinya jika variable $hasil datanya tidak kosong maka lakukan eksekusi selanjutnya dimana variable $hasil ini menampung data dari tabel tblmahasiswa

• Baris ke-18 digunakan untuk melakukan perulangan dari hasil nilai array bernama $hasil dan diubah kedalam bentuk satuan variable $data

• Baris ke-22 sampai 24 digunakan untuk menampilkan data berdasarkan kolom field nim, nama, kelas.

• Baris ke-28 digunakan untuk mengakhiri suatu perulangan

• Baris ke-31 sampai 37 merupakan kondisi lain dari baris ke 17 dimana data pada tabel tblmahasiswa tidak ada atau kosong maka ada menampilkan tulisan “DATA BELUM ADA”

Menggunakan Validasi

Form

Validasi CodeIgniter

• Sebuah aplikasi yang baik harus memiliki sebuah kontrol terhadap inputan user.

• Validation form sangat penting pada aplikasi.

Sebuah aplikasi akan memiliki banyak inputan dari pengguna dan semua inputan untuk pengguna

harus aman.

• CodeIgniter memiliki sebuah library Form

Validation Library yang akan membantu kita untuk membuat sebuah validasi yang cepat, mudah dan aman.

• Ada 2(dua) cara menambahkan library form_validation pada codeigniter

• Pertama dapat dilakukan di bagian controller

• Atau melalui

latihanci/application/config/autoload.php ditambah form_validation menjadi

• Selanjutnya, tambahkan aturan validasi seperti berikut ini pada controller Mhs.php di

latihanci/application/controller/

• Untuk menampilkan pesan errornya tambahkan code berikut ini pada file view

Aturan-aturan validasi CI

Aturan Keterangan

required Isi inputan tidak boleh kosong.

matches Isi inputan harus sama dengan inputan tertentu contoh matches [password].

min_length Panjang inputan harus memiliki jumlah minimal karakter, contoh penggunaan min_length[6] artinya panjang inputan harus lebih besar dari 6 karakter.

max_length Panjang inputan harus memiliki jumlah maksimal karakter, contoh max_length[12] artinya panjang inputan tidak boleh lebih dari 12 karakter.

exact_length Panjang inputan harus sama dengan jumlah karakter yang diinginkan, contoh exact_length[8] artinya panjang inputan harus sama dengan 8 karakter.

alpha Inputan harus berisi semua huruf alfabet mulai dari a-z.

Aturan Keterangan

alpha_numeric Inputan harus berisi karakter alfabet dan numeric.

alpha_dash Inputan harus berisi semua huruf alfabet mulai dari a-z , underscores atau dashes.

numeric Inputan hanya boleh berisi angka / huruf numeric.

integer Inputan hanya boleh berisi angka integer saja.

is_natural Inputan hanya boleh berisi bilangan natural saja: 0, 1, 2, 3, dan seterusnya.

is_natural_no_zero Inputan hanya boleh berisi bilangan natural saja kecuali nol: 1, 2, 3, dan seterusnya.

valid_email Inputan harus berisi format email yang benar.

valid_emails Inputan harus berisi format email yang benar di batasi dengan koma jika alamat email lebih dari satu.

valid_ip Inputan harus berisi format IP yang benar.

valid_base64 Inputan harus berisi format karakter base64 yang benar.

Pertemuan 6

(Web Programming)

Riski Annisa, M.Kom

Operasi Update

Mengubah Data

• Buka kembali file Mmahasiswa.php pada folder

latihanci/application/models, kemudian tambahkan skrip program yang tercetak dibawah ini untuk

membuat fungsi baru

Penjelasan Code …

• Baris ke-24 digunakan untuk membuat fungsi ubah.

• Baris ke-26 sampai 31 digunakan untuk menyimpan nilai pengiriman data pada variable POST ke dalam masing-masing variable yang sudah ditentukan.

• Baris ke-32 digunakan untuk menentukan data mana yang akan diubah berdasarkan field id yang sama

dengan variable $nim yang ditangkap.

• Baris ke-33 digunakan untuk mengubah data dari

variable $data yang didapat dari form terhadap tabel tblmahasiswa

• Baris ke-36 digunakan untuk membuat fungsi bernama ubah_tampil, di mana di dalamnya terdapat parameter

$nim yang belum ditentukan nilainya.

• Selanjutnya buka kembali file controller Mhs.php pada folder latihanci/application/controllers.

Tambahkan script dibawah ini:

Penjelasan Code …

• Baris ke-23 digunakan untuk membuat fungsi update_mahasiswa.

• Baris ke-25 apabila $_POST belum dilakukan makan akan dilakukan eksekusi selanjutnya.

• Baris ke-26 digunakan untuk memanggil file model bernama Mmahasiswa.php

• Baris ke-27 terdapat sebuah variable $data dengan nama hasil, yang digunakan untuk menyimpan nilai untuk menjalankan perintah fungsi ubah_tampil pada kelas mmahasiswa.

• Baris ke-28 digunakan untuk memanggil file edit_mahasiswa.php dimana didalamnya telah mengandung $data.

Penjelasan code (lanjutan)…

• Baris ke-29 {else} merupakan perintah berlawanan jadi jika perubahan dilakukan maka akan dieksekusi perintah

selanjutnya.

• Baris ke-30 digunakan untuk memanggil file model Mmahasiswa.php

• Baris ke-31 digunakan untuk menjalankan perintah fungsi ubah pada kelas model mmahasiswa. Disinilah proses

perubahan dilakukan. Ketika fungsi ubah dijalankan melalui kelas mmahasiswa, dimana didalamnya dikirimkan variable berikan nilai nim ($nim) yang ditangkap.

• Baris ke-32 digunakan untuk mengalihkan/mengarahkan halaman web(redirect) pada posisi mhs/index, dimana mhs berperan sebagai URL1 untuk sebuah kelas, dan index

berperan sebagai segment URL 2 untuk sebuah fungsi.

• Sekarang buat halaman form edit_mahasiswa.php pada folder latihanci/application/views

• Tambahkan baris berikut ini pada mahasiswa_tampil.php pada folder latihanci/application/views

Operasi Delete

Menghapus Data

• Buka kembali file Mmahasiswa.php pada folder

latihanci/application/models, kemudian tambahkan skrip program yang tercetak dibawah ini untuk

membuat fungsi baru

Penjelasan code …

• Baris ke-41 digunakan untuk membuat fungsi hapus dimana pada fungsi tersebut terdapat parameter yang ditangkap dari sebuah form.

• Baris ke-43 digunakan untuk menghapus data pada tabel tblmahasiswa sesuai nim yang dipilih.

• Baris ke-44 digunakan untuk mengarahkan halaman web (redirect) pada posisi mhs/index, dimana mhs berperan sebagai segment URL1 untuk sebuah

kelas dan index berperan sebagai segment URL2 untuk sebuah fungsi.

• Selanjutnya buka kembali file controller Mhs.php pada folder latihanci/application/controllers.

Tambahkan script dibawah ini:

Penjelasan code …

• Baris ke-36 digunakan untuk membuat fungsi delete_komentar.

• Baris ke-38 sampai 39 digunakan untuk melakukan proses hapus data sesuai nim yang dipilih

• Baris ke-40 digunakan untuk mengarahkan halaman web (redirect) pada posisi mhs/index, dimana mhs berperan sebagai segment URL1 untuk sebuah

kelas dan index berperan sebagai segment URL2 untuk sebuah fungsi.

• Tambahkan baris berikut ini pada mahasiswa_tampil.php pada folder latihanci/application/views

Menggunakan Validasi

Form

Validasi CodeIgniter

• Sebuah aplikasi yang baik harus memiliki sebuah kontrol terhadap inputan user.

• Validation form sangat penting pada aplikasi.

Sebuah aplikasi akan memiliki banyak inputan dari pengguna dan semua inputan untuk pengguna

harus aman.

• CodeIgniter memiliki sebuah library Form

Validation Library yang akan membantu kita untuk membuat sebuah validasi yang cepat, mudah dan aman.

• Ada 2(dua) cara menambahkan library form_validation pada codeigniter

• Pertama dapat dilakukan di bagian controller

• Atau melalui

latihanci/application/config/autoload.php ditambah form_validation menjadi

• Selanjutnya, tambahkan aturan validasi seperti berikut ini pada controller Mhs.php di

latihanci/application/controller/

• Untuk menampilkan pesan errornya tambahkan code berikut ini pada file view

Aturan-aturan validasi CI

Aturan Keterangan

required Isi inputan tidak boleh kosong.

matches Isi inputan harus sama dengan inputan tertentu contoh matches [password].

min_length Panjang inputan harus memiliki jumlah minimal karakter, contoh penggunaan min_length[6] artinya panjang inputan harus lebih besar dari 6 karakter.

max_length Panjang inputan harus memiliki jumlah maksimal karakter, contoh max_length[12] artinya panjang inputan tidak boleh lebih dari 12 karakter.

exact_length Panjang inputan harus sama dengan jumlah karakter yang diinginkan, contoh exact_length[8] artinya panjang inputan harus sama dengan 8 karakter.

alpha Inputan harus berisi semua huruf alfabet mulai dari a-z.

Aturan Keterangan

alpha_numeric Inputan harus berisi karakter alfabet dan numeric.

alpha_dash Inputan harus berisi semua huruf alfabet mulai dari a-z , underscores atau dashes.

numeric Inputan hanya boleh berisi angka / huruf numeric.

integer Inputan hanya boleh berisi angka integer saja.

is_natural Inputan hanya boleh berisi bilangan natural saja: 0, 1, 2, 3, dan seterusnya.

is_natural_no_zero Inputan hanya boleh berisi bilangan natural saja kecuali nol: 1, 2, 3, dan seterusnya.

valid_email Inputan harus berisi format email yang benar.

valid_emails Inputan harus berisi format email yang benar di batasi dengan koma jika alamat email lebih dari satu.

valid_ip Inputan harus berisi format IP yang benar.

valid_base64 Inputan harus berisi format karakter base64 yang benar.

Integrasi Bootstrap dengan CodeIgniter

Riski Annisa, M.Kom

Langkah 1:

• Download bootstrap di website

http://getbootstrap.com/docs/3.3/

Langkah 2:

• Setelah di download bootstrap dan di extact ke dalam folder isi file-nya seperti ini:

Langkah 3:

• Hasil download yang sudah di-extract ke dalam

folder tadi pindahkan ke htdocs dan buat file asset seperti gambar dibawah ini:

Memanggil Bootstrap

dengan CodeIgniter :

Langkah 1:

• Buka file config.php di folder application/config.

Cari bagian $config[‘base_url] = ‘..’; isi titik-titik tersebut dengan root/folder_CI nya.

Langkah 2:

• Buka file autoload.php di dalam folder

application/config. Lalu cari $autoload[‘helper’] = array(); . Kemudian edit dengan menambahkan url di dalam array tersebut sehingga menjadi

$autoload[‘helper’] = array(‘url’);.

• Fungsinya agar base_url yang di-setting bisa digunakan.

Langkah 3:

• Buka welcome_message.php yang berlokasi di application/view. File ini akan menjadi tampilan awal codeigniter dan di file ini juga akan membuat tampilan dengan bootstrap. Delete semua kode di welcome_message.php .

• Lalu tambahkan kode default html. Dan diantara tag <head></head> memanggil css dari

bootstrapnya. Seperti gambar berikut :

Langkah 4:

• Membuat sebuah tamplate sederhana

menggunakan bootstrap: Selanjutnya buatlah file baru di application/view dengan nama

file menu_view.php. Ketikkan code berikut ini:

• Untuk menampilkan view_menu.php sebelumnya, buatlah View.php di dalam folder

application/controllers. Kemudian ketikkan code berikut untuk memanggil view_menu.php

• Selanjutnya view_menu.php baru bisa di panggil di browser

• Ini adalah tampilan dari menu sederhana yang telah dibuat

Langkah 5:

• Jika ingin menambahkan tampilan yang lebih

tertata dengan merapihkan content suatu halaman, dengan cara membuat kerangkanya terlebih

dahulu. Buatlah folder baru di application/view dengan nama folder “data” :

• Kemudian di dalam folder komponen buatlah file

• footer.php

• headet.php

• meta.php

• File meta.php berisi script-script yang di dalamnya terdapat link-link untuk pemanggilan Bootstrap itu sendiri dan awalan tag html.

• File header.php berisi tentang content-content(isi) yang akan di tampilankan ke user, tidak perlu menggunakan tag html lagi karna tadi sudah ditentukan strukturnya tinggal memanggilnya nanti di controller.

• File footer berisi tag akhir menutup tag html dari file meta.

Langkah 6:

• Setelah itu buatlah folder dengan nama pages di application/view :

• Di dalamnya terserah mau di isi dengan content apapun yang diinginkan. Disana tidak perlu

menambahkan struktur html, langsung ke intinya saja:

Langkah 7:

• Selanjutnya, tinggal diatur di controller-nya. Edit View.php pada folder application/controllers

menjadi berikut:

Keterangan :

• Untuk membuat sebuah navbar yang di dalamnya terdapat tampilan lain atau halaman lain bisa

menggunakan cara seperti diatas. Dalam satu class controller tetapi terdapat beberapa halaman.

• Function index adalah untuk tampilan awal dari halaman tersebut.

• Jika ingin membuat lagi sebuah function pastinya bisa dengan public function namafunction().

• Jika ingin menampilkan halaman lain seperti code di atas dengan hanya tinggal mengganti pages yang

ditujukan dan mengganti nama functionnya.

Langkah 8:

• Selanjutnya hanya tinggal mengatur router yang ada di folder application/config .

• Apa fungsi dari router itu sendiri ? router

digunakan untuk memetakan permintaan atau request kedalam class controller didalam website yang kita buat.

• Bisa secara default mengarahkan agar secara

otomatis akan memanggil controller controller yang didefinisikan.

• View = nama controller-nya, sedangkan home

adalah nama function utama yang akan dipanggil.

Artinya secara default semua permintaan yang tidak menyertakan nama controllernya akan

diarahkan untuk memanggil controller View dengan function home.