CodeIgniter adalah salah satu framework php yang tangguh dan popular yang awalnya
CodeIgniter 2.0
Devid Haryalesmana Wahid
Basic Introduction
devid.wahid@gmail.com
Devid Haryalesmana Wahid (http://masdevid.com)
CodeIgniter 2.0
Dasar-dasar Framework CodeIgniter
TUJUAN PRAKTIKUM
1.
2.
3.
4.
Memahami konsep Model-View-Controller (MVC)
Memahami konsep dasar Routing
Mampu membuat validasi form
Mampu membuat koneksi dan manipulasi database menggunakan Active Record
Dasar Teori
Framework
Framework adalah sekumpulan fungsi, class, dan aturan-aturan. Berbeda dengan library
yang sifatnya untuk tujuan tertentu saja, framework bersifat menyeluruh mengatur bagaimana
kita membangun aplikasi. Framework memungkinkan kita membangun aplikasi dengan lebih
cepat karena sebagai developer kita akan lebih memfokuskan pada pokok permasalahan
sedangkan hal-hal penunjang lainnya seperti koneksi database, form validation, GUI, dan
security; umumnya telah disediakan oleh framework.
CodeIgniter
CodeIgniter adalah salah satu framework php yang tangguh dan popular yang awalnya
ditulis oleh Rick Ellis, pendiri dan CEO EllisLab.com, perusahaan yang mengembangkan
codeigniter. Saat ini, codeigniter dikembangkan oleh komunitas dan disebarkan ke seluruh dunia
dengan lisensi bebas. CodeIgniter tergolong framework dengan ukuran kecil dan cukup mudah
di kuasai. CI juga datang dengan manual yang tergolong lengkap. CodeIgniter adalah sebuah
framework PHP. Framework itu sendiri adalah suatu kerangka kerja yang berupa sekumpulan
folder yang memuat file-file php yang menyediakan class libraries, helpers, plugins dan lainnya .
Framework menyediakan konfigurasi dan teknik coding tertentu.
1
Devid Haryalesmana Wahid (http://masdevid.com)
Konsep Model-View-Controller
Konsep Model-View-Controller (MVC) adalah konsep pemisahan antara logika
pemrograman dengan tampilan dan database. Manfaat konsep ini adalah, membuat logika
pemrograman lebih sederhana dan mudah dipahami, karena sudah dipisah dengan code untuk
tampilan dan membuat programmer dapat bekerja secara terpisah dengan designer. Programmer mengerjakan logika pemrogramannya, sedangkan designer berkutat dengan design dan
tampilan.
Merupakan code struktur data. Model berisi fungsi di dalam pengolahan data-
Model:
base. Script SQL masuk di sini.
Merupakan code untuk menampilkan tampilan suta program. Tampilan dapat be-
View:
rupa web page, header, footer dan apa saja yang berjenis tampilan.
Controller:
Merupakan code untuk logic, algoritma dan sebagai penghubung antara model,
view, dan sumber lain yang di perlukan untuk mengolah HTTP request dan generate web page.
CI menerapkan pola MVC yang flexible, karena model dapat tidak di gunakan. Anda dapat
hanya menggunakan Controller dan View saja dalam menggunakan CI tanpa Model. Jika anda
tidak memerlukan pemisahan di dalam struktur data dan database atau menganggap penggunaan model hanya menambah kompleks aplikasi dengan keuntungan yang kurang sebanding,
maka anda dapat tidak menggunakan model.
Download CodeIgniter di http://ellislab.com/codeigniter/download
Download WAMP Server di http://www.wampserver.com/en/
2
Devid Haryalesmana Wahid (http://masdevid.com)
Latihan
Dalam praktikum ini, anda akan membuat aplikasi dasar web berita. Anda akan
belajar menulis kode untuk menampilkan halaman web statis. Kemudian, anda akan
membuat kolom berita yang diambil dari database. Terakhir, anda akan membuat form
untuk membuat berita baru ke dalam database.
Instalasi
Install WAMP Server terlebih dahulu.
Ekstrak CodeIgniter_2.1.3.zip ke dalam root direktori (C:/wamp/www/)
Rename folder CodeIgniter_2.1.3 menjadi folder webberita
Pada browser akses alamat localhost/webberita; Jika instalasi berhasil maka anda
akan mendapatkan tampilan halaman welcome seperti gambar 1.
Gambar 1: Halaman Welcome CodeIgniter
Struktur Folder CodeIgniter
Perhatikan gambar disamping, ini adalah struktur folder
CodeIgniter. Dalam membuat aplikasi web berita ini nanti anda
akan berfokus pada folder ini saja:
Config
Controllers
Models
Views
Untuk text editornya anda dapat menggunakan notepad,
notepad++, atau
menggunakan
IDE
seperti Aptana,
Dreamweaver, PHPStorm. Dalam modul praktikum ini penulis
menggunakan IDE PHPStorm 5.0.
3
Devid Haryalesmana Wahid (http://masdevid.com)
Membuat Halaman Web Statis
Hal pertama yang akan anda lakukan adalah membuat Controller untuk menangani
halaman statis web. Controller adalah sebuah class yang didalamnya terdapat method
berupa sekumpulan function.
Sebelum membuat controller, anda perlu memahami skema URL CodeIgniter seperti
berikut ini:
Jadi ketika anda memanggil URL http://webberita/berita/terbaru/10 maka dapat
kita ketahui bahwa URL akan memanggil controller “berita” dengan function “terbaru”
dan argument “10”.
Buat file pages.php pada direktori application/controllers/ , dengan kode seperti
berikut:
Disini anda telah membuat sebuah class bernama “Pages” yang telah mewarisi method,
variable, dan function class CI_Controller. Controller adalah pusat setiap request yang
akan dilayani pada aplikasi web anda. Seperti pada class php pada umumnya, anda
akan menggunakan $this untuk memuat libraries, views, helpers, dan instruksiinstruksi umum yang digunakan framework.
Setelah anda membuat method “view” pada class “pages”, sekarang buat template
untuk header dan footer halaman.
Buat file header.php pada direktori application/views/templates/ , dengan kode
seperti berikut:
Lalu, buat file footer.php pada direktori application/views/templates , dengan
kode seperti berikut:
4
Devid Haryalesmana Wahid (http://masdevid.com)
Setelah anda membuat template header dan footer, buatlah file home.php dan
about.php pada direktori application/views/pages/. Pada home.php, tuliskan apa
yang anda suka seperti “Apa kabar dunia?”. Dan pada about.php tuliskan biodata anda
seperti nama, nomor induk mahasiswa, dan alamat email.
Menambahkan logika program pada Controller
Untuk dapat memuat halaman “home” dan “about”, pertama-tama anda membuat logika
untuk memeriksa apakah halaman tersebut benar-benar ada, jika tidak maka tampilkan
halaman error.
Disini anda dapat mengakses halaman home dan about anda lengkap dengan header
dan footernya. Berikut link untuk mengakses halaman tersebut,
http://localhost/webberita/index.php/pages/view/home
Sedangkan untuk mengakses halaman about, berikut linknya:
http://localhost/webberita/index.php/pages/view/about
Mengatur Routing Halaman
Anda dapat membuat aturan routing custom untuk memetakan halaman anda pada
controller dan method manapun.
Buka file application/config/routes.php, lalu ubah kode didalamnya seperti kode
berikut:
5
Devid Haryalesmana Wahid (http://masdevid.com)
Manfaat dari routing ini, untuk memberitahu system bahwa default controllernya adalah
“pages/view” dan pada aturan route kedua, setiap request apapun akan dilewatkan pada
method view di class pages. Sehingga, sekarang anda dapat mengakses halaman home
dan about menggunakan URL berikut:
http://localhost/webberita/index.php/home
http://localhost/webberita/index.php/about
Lebih singkat bukan? Disini nama controller dan methodnya menjadi tidak mudah
diketahui. ;)
6
Devid Haryalesmana Wahid (http://masdevid.com)
Membuat Halaman Berita
Disini kita akan membuat halaman berita yang nantinya berita yang ditampilkan akan
diambil dari database.
Membuat Model
Pertama-tama kita buat database “berita” dan atur konfigurasi databasenya dengan
cara, buka application/config/database.php
$db['default']['hostname'] = "localhost";
$db['default']['username'] = "root";
$db['default']['password'] = "";
$db['default']['database'] = "berita";
Kemudian buat tabel dengan mengeksekusi query berikut ini:
Lalu kita dapat memulai membuat Model untuk mengakses informasi dari database.
Buat file news_model.php pada direktori application/models/, dan tuliskan kode
berikut ini:
Lalu tambahkan method get_news, seperti berikut ini:
7
Devid Haryalesmana Wahid (http://masdevid.com)
Menampilkan Berita
Sekarang query untuk mengambil informasi berita dari database telah dibuat, sekarang
membuat controller dan view-nya untuk menampilkan berita tersebut.
Pertama buat controller baru bernama news.php pada direktori
application/controllers/, tuliskan kode berikut:
Sekarang data telah diterima oleh controller melalui model, tapi ini belum bisa
menampilkan apa-apa. Data perlu dilewatkan ke view untuk nantinya dirender menjadi
sebuah tampilan halaman web dinamis.
Modifikasi pada method index() seperti kode berikut:
Disini data dari database diset kedalam variable $data[‘news’], bersamaan dengan
judul halaman yang diset kedalam variable $data[‘title’] yang kemudian data
dilewatkan ke view menggunakan parameter $data.
Buat index.php pada direktori application/views/news/, dan tulis kode berikut:
8
Devid Haryalesmana Wahid (http://masdevid.com)
Disini tiap item berita akan ditampilkan, tapi tampilan individual berita belum. Untuk
membuat tampilan individual berita, buka kembali controller news dan modifikasi
method view() yang dibuat sebelumnya menjadi seperti berikut ini:
Lalu buat lagi view untuk tampilan individual berita pada direktori
application/views/news/ dengan nama file view.php, lalu tulis kode berikut:
Langkah terakhir untuk latihan menampilkan berita ini adalah menambahkan aturan
baru pada Routing halaman. Buka kembali application/config/routes.php dan
modifikasi kodenya seperti berikut:
Coba akses http://localhost/webberita/index.php/news untuk melihat hasilnya.
9
Devid Haryalesmana Wahid (http://masdevid.com)
Membuat Berita Baru
Pada latihan sebelumnya anda sudah membuat halaman untuk menampilkan berita tapi
belum ada berita yang dapat ditampilkan karena belum ada data di database. Oleh karena
itu sekarang anda akan mulai membuat halaman untuk membuat berita baru.
Membuat Form
Untuk memasukkan data baru ke dalam database, anda perlu membuat form dimana
user dapat memasukkan berita baru. Buat view create.php pada direktori
application/views/news/ dan tulis kode berikut:
Kemudian buka kembali controller news.php dan tambahkan method berikut:
10
Devid Haryalesmana Wahid (http://masdevid.com)
Kemudian buat success.php pada direktori application/views/news/ dan tuliskan
kode berikut :
News added! or
Kemudian buka kembali model news_model.php dan tambahkan method berikut:
Kemudian anda tambahkan lagi aturan routing baru untuk menambahkan berita. Buka
kembali application/config/routes.php dan modifikasi kodenya seperti berikut:
Coba akses http://localhost/webberita/index.php/news/create dan tambahkan berita
baru.
Selanjutnya anda dapat mengeksplorasi Library, Helper, dan Class bawaan
CodeIgniter secara offline pada http://localhost/[namasitus]/user_guide
Dokumentasi CI sangat bagus dan detail berikut tutorialnya, jika ada pertanyaan
silahkan kirim email ke devid.wahid@gmail.com
11
Devid Haryalesmana Wahid
Basic Introduction
devid.wahid@gmail.com
Devid Haryalesmana Wahid (http://masdevid.com)
CodeIgniter 2.0
Dasar-dasar Framework CodeIgniter
TUJUAN PRAKTIKUM
1.
2.
3.
4.
Memahami konsep Model-View-Controller (MVC)
Memahami konsep dasar Routing
Mampu membuat validasi form
Mampu membuat koneksi dan manipulasi database menggunakan Active Record
Dasar Teori
Framework
Framework adalah sekumpulan fungsi, class, dan aturan-aturan. Berbeda dengan library
yang sifatnya untuk tujuan tertentu saja, framework bersifat menyeluruh mengatur bagaimana
kita membangun aplikasi. Framework memungkinkan kita membangun aplikasi dengan lebih
cepat karena sebagai developer kita akan lebih memfokuskan pada pokok permasalahan
sedangkan hal-hal penunjang lainnya seperti koneksi database, form validation, GUI, dan
security; umumnya telah disediakan oleh framework.
CodeIgniter
CodeIgniter adalah salah satu framework php yang tangguh dan popular yang awalnya
ditulis oleh Rick Ellis, pendiri dan CEO EllisLab.com, perusahaan yang mengembangkan
codeigniter. Saat ini, codeigniter dikembangkan oleh komunitas dan disebarkan ke seluruh dunia
dengan lisensi bebas. CodeIgniter tergolong framework dengan ukuran kecil dan cukup mudah
di kuasai. CI juga datang dengan manual yang tergolong lengkap. CodeIgniter adalah sebuah
framework PHP. Framework itu sendiri adalah suatu kerangka kerja yang berupa sekumpulan
folder yang memuat file-file php yang menyediakan class libraries, helpers, plugins dan lainnya .
Framework menyediakan konfigurasi dan teknik coding tertentu.
1
Devid Haryalesmana Wahid (http://masdevid.com)
Konsep Model-View-Controller
Konsep Model-View-Controller (MVC) adalah konsep pemisahan antara logika
pemrograman dengan tampilan dan database. Manfaat konsep ini adalah, membuat logika
pemrograman lebih sederhana dan mudah dipahami, karena sudah dipisah dengan code untuk
tampilan dan membuat programmer dapat bekerja secara terpisah dengan designer. Programmer mengerjakan logika pemrogramannya, sedangkan designer berkutat dengan design dan
tampilan.
Merupakan code struktur data. Model berisi fungsi di dalam pengolahan data-
Model:
base. Script SQL masuk di sini.
Merupakan code untuk menampilkan tampilan suta program. Tampilan dapat be-
View:
rupa web page, header, footer dan apa saja yang berjenis tampilan.
Controller:
Merupakan code untuk logic, algoritma dan sebagai penghubung antara model,
view, dan sumber lain yang di perlukan untuk mengolah HTTP request dan generate web page.
CI menerapkan pola MVC yang flexible, karena model dapat tidak di gunakan. Anda dapat
hanya menggunakan Controller dan View saja dalam menggunakan CI tanpa Model. Jika anda
tidak memerlukan pemisahan di dalam struktur data dan database atau menganggap penggunaan model hanya menambah kompleks aplikasi dengan keuntungan yang kurang sebanding,
maka anda dapat tidak menggunakan model.
Download CodeIgniter di http://ellislab.com/codeigniter/download
Download WAMP Server di http://www.wampserver.com/en/
2
Devid Haryalesmana Wahid (http://masdevid.com)
Latihan
Dalam praktikum ini, anda akan membuat aplikasi dasar web berita. Anda akan
belajar menulis kode untuk menampilkan halaman web statis. Kemudian, anda akan
membuat kolom berita yang diambil dari database. Terakhir, anda akan membuat form
untuk membuat berita baru ke dalam database.
Instalasi
Install WAMP Server terlebih dahulu.
Ekstrak CodeIgniter_2.1.3.zip ke dalam root direktori (C:/wamp/www/)
Rename folder CodeIgniter_2.1.3 menjadi folder webberita
Pada browser akses alamat localhost/webberita; Jika instalasi berhasil maka anda
akan mendapatkan tampilan halaman welcome seperti gambar 1.
Gambar 1: Halaman Welcome CodeIgniter
Struktur Folder CodeIgniter
Perhatikan gambar disamping, ini adalah struktur folder
CodeIgniter. Dalam membuat aplikasi web berita ini nanti anda
akan berfokus pada folder ini saja:
Config
Controllers
Models
Views
Untuk text editornya anda dapat menggunakan notepad,
notepad++, atau
menggunakan
IDE
seperti Aptana,
Dreamweaver, PHPStorm. Dalam modul praktikum ini penulis
menggunakan IDE PHPStorm 5.0.
3
Devid Haryalesmana Wahid (http://masdevid.com)
Membuat Halaman Web Statis
Hal pertama yang akan anda lakukan adalah membuat Controller untuk menangani
halaman statis web. Controller adalah sebuah class yang didalamnya terdapat method
berupa sekumpulan function.
Sebelum membuat controller, anda perlu memahami skema URL CodeIgniter seperti
berikut ini:
Jadi ketika anda memanggil URL http://webberita/berita/terbaru/10 maka dapat
kita ketahui bahwa URL akan memanggil controller “berita” dengan function “terbaru”
dan argument “10”.
Buat file pages.php pada direktori application/controllers/ , dengan kode seperti
berikut:
Disini anda telah membuat sebuah class bernama “Pages” yang telah mewarisi method,
variable, dan function class CI_Controller. Controller adalah pusat setiap request yang
akan dilayani pada aplikasi web anda. Seperti pada class php pada umumnya, anda
akan menggunakan $this untuk memuat libraries, views, helpers, dan instruksiinstruksi umum yang digunakan framework.
Setelah anda membuat method “view” pada class “pages”, sekarang buat template
untuk header dan footer halaman.
Buat file header.php pada direktori application/views/templates/ , dengan kode
seperti berikut:
Lalu, buat file footer.php pada direktori application/views/templates , dengan
kode seperti berikut:
4
Devid Haryalesmana Wahid (http://masdevid.com)
Setelah anda membuat template header dan footer, buatlah file home.php dan
about.php pada direktori application/views/pages/. Pada home.php, tuliskan apa
yang anda suka seperti “Apa kabar dunia?”. Dan pada about.php tuliskan biodata anda
seperti nama, nomor induk mahasiswa, dan alamat email.
Menambahkan logika program pada Controller
Untuk dapat memuat halaman “home” dan “about”, pertama-tama anda membuat logika
untuk memeriksa apakah halaman tersebut benar-benar ada, jika tidak maka tampilkan
halaman error.
Disini anda dapat mengakses halaman home dan about anda lengkap dengan header
dan footernya. Berikut link untuk mengakses halaman tersebut,
http://localhost/webberita/index.php/pages/view/home
Sedangkan untuk mengakses halaman about, berikut linknya:
http://localhost/webberita/index.php/pages/view/about
Mengatur Routing Halaman
Anda dapat membuat aturan routing custom untuk memetakan halaman anda pada
controller dan method manapun.
Buka file application/config/routes.php, lalu ubah kode didalamnya seperti kode
berikut:
5
Devid Haryalesmana Wahid (http://masdevid.com)
Manfaat dari routing ini, untuk memberitahu system bahwa default controllernya adalah
“pages/view” dan pada aturan route kedua, setiap request apapun akan dilewatkan pada
method view di class pages. Sehingga, sekarang anda dapat mengakses halaman home
dan about menggunakan URL berikut:
http://localhost/webberita/index.php/home
http://localhost/webberita/index.php/about
Lebih singkat bukan? Disini nama controller dan methodnya menjadi tidak mudah
diketahui. ;)
6
Devid Haryalesmana Wahid (http://masdevid.com)
Membuat Halaman Berita
Disini kita akan membuat halaman berita yang nantinya berita yang ditampilkan akan
diambil dari database.
Membuat Model
Pertama-tama kita buat database “berita” dan atur konfigurasi databasenya dengan
cara, buka application/config/database.php
$db['default']['hostname'] = "localhost";
$db['default']['username'] = "root";
$db['default']['password'] = "";
$db['default']['database'] = "berita";
Kemudian buat tabel dengan mengeksekusi query berikut ini:
Lalu kita dapat memulai membuat Model untuk mengakses informasi dari database.
Buat file news_model.php pada direktori application/models/, dan tuliskan kode
berikut ini:
Lalu tambahkan method get_news, seperti berikut ini:
7
Devid Haryalesmana Wahid (http://masdevid.com)
Menampilkan Berita
Sekarang query untuk mengambil informasi berita dari database telah dibuat, sekarang
membuat controller dan view-nya untuk menampilkan berita tersebut.
Pertama buat controller baru bernama news.php pada direktori
application/controllers/, tuliskan kode berikut:
Sekarang data telah diterima oleh controller melalui model, tapi ini belum bisa
menampilkan apa-apa. Data perlu dilewatkan ke view untuk nantinya dirender menjadi
sebuah tampilan halaman web dinamis.
Modifikasi pada method index() seperti kode berikut:
Disini data dari database diset kedalam variable $data[‘news’], bersamaan dengan
judul halaman yang diset kedalam variable $data[‘title’] yang kemudian data
dilewatkan ke view menggunakan parameter $data.
Buat index.php pada direktori application/views/news/, dan tulis kode berikut:
8
Devid Haryalesmana Wahid (http://masdevid.com)
Disini tiap item berita akan ditampilkan, tapi tampilan individual berita belum. Untuk
membuat tampilan individual berita, buka kembali controller news dan modifikasi
method view() yang dibuat sebelumnya menjadi seperti berikut ini:
Lalu buat lagi view untuk tampilan individual berita pada direktori
application/views/news/ dengan nama file view.php, lalu tulis kode berikut:
Langkah terakhir untuk latihan menampilkan berita ini adalah menambahkan aturan
baru pada Routing halaman. Buka kembali application/config/routes.php dan
modifikasi kodenya seperti berikut:
Coba akses http://localhost/webberita/index.php/news untuk melihat hasilnya.
9
Devid Haryalesmana Wahid (http://masdevid.com)
Membuat Berita Baru
Pada latihan sebelumnya anda sudah membuat halaman untuk menampilkan berita tapi
belum ada berita yang dapat ditampilkan karena belum ada data di database. Oleh karena
itu sekarang anda akan mulai membuat halaman untuk membuat berita baru.
Membuat Form
Untuk memasukkan data baru ke dalam database, anda perlu membuat form dimana
user dapat memasukkan berita baru. Buat view create.php pada direktori
application/views/news/ dan tulis kode berikut:
Kemudian buka kembali controller news.php dan tambahkan method berikut:
10
Devid Haryalesmana Wahid (http://masdevid.com)
Kemudian buat success.php pada direktori application/views/news/ dan tuliskan
kode berikut :
News added! or
Kemudian buka kembali model news_model.php dan tambahkan method berikut:
Kemudian anda tambahkan lagi aturan routing baru untuk menambahkan berita. Buka
kembali application/config/routes.php dan modifikasi kodenya seperti berikut:
Coba akses http://localhost/webberita/index.php/news/create dan tambahkan berita
baru.
Selanjutnya anda dapat mengeksplorasi Library, Helper, dan Class bawaan
CodeIgniter secara offline pada http://localhost/[namasitus]/user_guide
Dokumentasi CI sangat bagus dan detail berikut tutorialnya, jika ada pertanyaan
silahkan kirim email ke devid.wahid@gmail.com
11