18
Tutorial Code Igniter Oleh : Ahmad Baidawi Email : [email protected] Sumber : User guides Code Igniter SISTEM INFORMASI IT TELKOM / 116080002

Tutorial Code Igniter

Embed Size (px)

Citation preview

Page 1: Tutorial Code Igniter

Tutorial Code Igniter

Oleh : Ahmad BaidawiEmail : [email protected] : User guides Code Igniter

SISTEM INFORMASI IT TELKOM / 116080002

Page 2: Tutorial Code Igniter

Ahmad baidawi / [email protected]

Instalasi1 Pastikan Server Apache dan Mysql Sudah terpasang. Apabila belum

install applikasi XAMPP pada windows dan pastkan server sudah running.

Gambar 1. Control panel xampp.

2 Download CI di http://codeigniter.com/downloads/ kemudian download Code Igniter terbaru.

Gambar 2. Download Code Igniter

3 Unzip package yang sudah di downloadBuat folder baru di htdocs sebagai dirktori utama code igniter. Misalnya belajarCI

Gambar 3. Direktori Code Igniter

1

Page 3: Tutorial Code Igniter

Ahmad baidawi / [email protected]

4 Copy seluruh file yang tadi sudah di unzip kedalam direktori belajarCI

Gambar 4. isi Direktori Code Igniter

5 Atur konfigurasi apache agar direktori belajarCI menjadi parent dari direktori apache.

5.1 Edit file httpd.conf di direktori configurasi apache.

5.2 Ubaha konfigurasi pada bagian :DocumentRoot “C:/xampp/htdocs” diganti dengan DocumentRoot “C:/xampp/htdocs/belajarCI”<Directory “C:/xampp/htdocs”> diganti dengan<Directory “C:/xampp/htdocs/belajarCI”>Simpan file tersebut.

6 Buka control panel XAMPP kemudian restart kembali server apache dengan klik stop kemudian start kembali.

2

Page 4: Tutorial Code Igniter

Ahmad baidawi / [email protected]

Gambar 5. restart server apache dari cpanel xampp

7 Buka browser kemudian buka alamat “localhost”

Jika sudah seperti ini maka code igniter sudah berjalan pada sistem.

KONFIGURASIMulai dari langkah ini sampai berikutnya path yang digunakan berada di bawah direktori C:/xampp/htdocs/belajarCI/.

1 Membuat database

3

Page 5: Tutorial Code Igniter

Ahmad baidawi / [email protected]

1.1 Buka localhost/phpmyadmin pada browser1.2 Pada bagian Create new database di isi dengan nama database yang

akan kita gunakan. Kemudian klik tombol create.

Gambar 6. membuat database Mysql di PhpMyadmin

2 Buka file application/config/database.php kemudian isi parameter sesuai dengan gambar berikut ini.

Gambar 7. konfigurasi databasehostname diisi dengan alamat server database.username diisi dengan username database.database diisi dengan nama database yang sudah di buat sebelumnya.jika langkah ini sudah benar maka lanjut dalam pembuatan website menggunakan framework code igniter

3 Copy file .htaccess yang berada di application/.htaccess kedalam folder belajarCI/

4

Page 6: Tutorial Code Igniter

Ahmad baidawi / [email protected]

Edit file .htaccess dengan kode sebagai berikut:

Gambar 8. kode .htacess

Kemudian simpan file.STATIC PAGE1 Code igniter pada umumnya menggunakan url (alamat yang

ada pada browser) seperti:

Gambar 9. contoh URL pada Code IgniterSecara umum aturan pada Code Igniter seperti berikut :localhost/index.php/[controller-class]/[controller-method]/[argument]

sekema url pada code igniter dapat menjadi sangat kompleks namun saat ini hal ini saja yang perlu diketahui.

2 Buat file application/controllers/awal.phpcontroller ini digunakan untuk melakukan handler dari page yang akan kita buat

3 Masukkan kode program berikut.

1. <?php2. class Awal extends CI_Controller{3. public function tampil(){4. $data[“judul”] = “Tampilan Home”;5. $this->load->view(“template/header”,$data);

5

Page 7: Tutorial Code Igniter

Ahmad baidawi / [email protected]

6. $this->load->view(“konten/home”,$data);7. $this->load->view(“template/footer”,data);8. }9. }10. ?>

Penjelasan kode :line 2 membuat nama controller-class dengan nama Awal setiap kelas controller diawali huruf besar dan harus selalu melakukan extends terhadap class CI_Controller.Line 3 membuat controller-method dengan nama tampil.Line 4 merupakan contoh pengolahan proses yang di butuhkan, pada kasus ini mengisi array data ber-index judul dengan isi string “Tampilan Home”.Line 5-7 merupakan code untuk memanggil fungsi view dari kelas CI_Controller. Fungsi view memiliki dua parameter yaitu (“link_ke_view”,variabel_yang_dilempar), pada baris 5 “template/header” digunakan untuk memanggil file header.php di folder views. Sedangkan $data merupakan variable yang akan di lempar ke dalam file header.php.

4 Buat file baru pada folder views. Dalam masalah ini adalah header, home, footer sesuai dengan yang dideklarasikan pada class-controller sebelumnya.Buat folder di application/views yaitu template dan konten. Buat file di dalam folder template yaitu header.php dan footer.php dan di folder konten home.php.

5 Perhatikan kode HTML berikut:

6

Page 8: Tutorial Code Igniter

Ahmad baidawi / [email protected]

Gambar 10. kode HTML

Simpan dengan nama coba.htm letakkan file ini di Desktop kemudian buka dengan browser.

6 Buka file coba.htm dengan browser.

7

Page 9: Tutorial Code Igniter

Ahmad baidawi / [email protected]

Gambar 11. file coba.htm dijalankan di browser

7 Kali ini kode coba.htm akan kita pecah-pecah.Buka file application/views/template/header.php isikan dengan kode program dibawah ini :

Gambar 12. kode program header.phpKode diatas merupakan penggalan dari kode coba.htm namun sedikit di rubah pada baris ke 3 yaitu judul web diganti dengan kode PHP yaitu echo($judul). Code ini digunakan untuk menampilkan isi dari variable judul dimana variabel judul sebelumnya sudah di set di controller (controller

8

Page 10: Tutorial Code Igniter

Ahmad baidawi / [email protected]

awal.php line 4).

8 Buka file application/views/template/footer.php isikan dengan kode program dibawah ini :

Gambar 13. kode program footer.php

9 Buka file application/views/konten/home.php isikan dengan kode program dibawah ini :

10 Buka file application/config/routes.php tambahkan route map untuk controller awal.

Kode ini digunakan untuk memetakan secara default agar ketika user membuka website langsung di arahkan ke controller awal.

11 buka “localhost” pada browser maka tampilan akan seperti berikut ini.

9

Page 11: Tutorial Code Igniter

Ahmad baidawi / [email protected]

Gambar 14. Tampilan Static Page

Baca Data Dari Database1 Pengaturan model.

Sebelum melakukan akses data kedalam database pastikan pengaturan pada tahap konfigurasi poin 2 sudah benar.Dalam studi kasus kali ini akan membuat suatu tabel yang berisi data yang diambil dari database.buat file bacadata_model.php di dalam folder application/models/

2 Buka file /application/models/bacadata_model.php isikan kode sebagai berikut.

Gambar 15. kode bacadata_model.php

Penjelasan kode :- Baris 2merupakan kode untuk membuat class Bacadata_model. Nama

10

Page 12: Tutorial Code Igniter

Ahmad baidawi / [email protected]

class haruslah diawali dengan huruf besar dan class model harus selalu mengikut sertakan class CI_Model dengan melakukan extends terhadap kelas tersebut.

- Baris 3-5 merupakan fungsi yang wajib di ikut sertakan dalam pembuatan class model. Fungsi ini digunakan untuk koneksi dengan database.

3 Buat tabel pada database.Buka “localhost/phpmyadmin” pada browser. Kemudian pilih database yang sudah kita buat sebelumnya. (tahap konfigurasi no 1.2)

Gambar 16. pemilihan database pada PhpMyadmin

4 Pilih tab SQL

Kemudian pada kotak textbox Run SQL query/queries on database

Isikan query berikut :

11

Page 13: Tutorial Code Igniter

Ahmad baidawi / [email protected]

Kemudian klik go.

Queri diatas digunakan untuk membuat tabel berita dengan kolom id, judul_berita, link_berita dan beritanya.

5 Isi tabel berita dengan beberapa contoh data dengan cara buka tab SQL Kemudian pada kotak textbox Run SQL query/queries on database isikan query sebagai berikut :

Kemudian klik go.

6 Buka file /application/models/bacadata_model.php isikan kode

12

Page 14: Tutorial Code Igniter

Ahmad baidawi / [email protected]

sebagai berikut.

Fungsi ambil_berita() pada line 6 digunakan untuk memanggil isi dari tabel beritaCatatan : untuk metode query pada database akan dibahas pada materi berikutnya.

7 Buka file /application/controllers/awal.php isikan kode sebagai berikut.

Catatan :Fungsi __construct() wajib di ikut sertakan dalam controller yang akan mengakses file models yang sudah dibuat sebelumnya (bacadata_model.php). baris 5 di gunakan untuk memanggil model sesuai dengan nama class di model yang kita buat, namun di awali dengan huruf kecil. (pada models nama class Bacadata_model pada controller di tulis bacadata_model).Pada fungsi tampil() diberi kode tambahan yaitu pada baris ke 9 kode ini digunakan untuk memanggil fungsi yanga da di model yaitu fungsi

13

Page 15: Tutorial Code Igniter

Ahmad baidawi / [email protected]

ambil_berita()8 Buka file application/views/konten/home.php isikan dengan kode

program dibawah ini :

pada controller line 9, controller mengeset variabel berita yang berisi array dengan value yang di peroleh dari database yang kemudian di line 11 variabel ini di lempar ke halaman konten/home.php.pada line 10 file home.php kode foreach digunakan untuk mencacah isi data yang ada pada variabel berita kemudian di simpan di variabel kontenberita.Line 12, 13, 16 digunakan untuk mencetak isi dari database dimana array yang ada di dalam variabel ini sesuai dengan nama kolom yang ada di database.($kontenBerita[“link_berita”], link berita harus sesuai dengan kolom yang ada di tabel berita pada database yaitu id, judul_berita, link_berita, beritaya)

9 Buka “localhost” pada browser.

14

Page 16: Tutorial Code Igniter

Ahmad baidawi / [email protected]

10 Menambahkan halaman detailBuka file application/config/routes.phpTambahkan kode dibawah ini :

Kode di line 41 digunakan untuk memetakan url yang di inputkan yaitu “awal/detail_berita/” menuju ke controller “awal” dan method “detail_berita”

11

Update data ke Database1

15