Anda di halaman 1dari 29

Daftar Isi

1. Dasar-Dasar Web Framework ............................................................................... 2


1.1. Pengenalan Framework CI ............................................................................. 2
1.2. Struktur folder Framework CI......................................................................... 3
1.3. File-file pada Framework CI............................................................................ 5
2. Install XAMPP ........................................................................................................ 6
3. Pemrograman Web Framework CI ..................................................................... 12
3.1. Komponen MVC ............................................................................................ 12
3.2. Konfigurasi Framework CI ........................................................................... 15
3.3. Dasar-Dasar CI .............................................................................................. 17
1. Attribut Method ............................................................................................. 17
2. Parsing Data menggunakan konsep MVC ................................................... 21
3. Session .......................................................................................................... 24

1 | Pemrograman Web 2 Nava Gia Ginasta, S.Tr.Kom., M.Kom


1. Dasar-Dasar Web Framework
1.1. Pengenalan Framework CI
Codeigniter adalah sebuah framework PHP yang dapat membantu mempercepat
developer dalam pengembangan aplikasi web berbasis PHP dibanding jika menulis kode
program dari awal (Menurut Hakim 2010:8). Ada banyak library dan helper yang berguna
di dalamnya dan tentunya akan mempermudah proses pengembangan perangkat lunak.
CI menggunakan konsep MVC (Model – View – Controller) yang memungkinkan
pemisahan layer application logic dan presentation. MVC merupakan konsep yang
memisahkan komponen utama menjadi tiga komponen yaitu Model, View dan Controller.

a. Model merupakan bagian penanganan yang berhubungan dengan manipulasi


database termasuk melakukan proses CRUD (Create Read Update Delete) yang
dengan bantuan controller yang merujuk ke model yang sesuai dan function yang
sesuai maka sebuah proses yang berkaitan dengan database sudah bisa dibuat.
b. Views merupakan bagian yang menangani masalah user interface. Tampilan dari
userinterface ini dipisahkan dari controller dan model untuk memudahkan
pengembang dalam membuat disain tampilan.Anda juga dapat membuat folder di
dalam folder views untuk mempermudah pengelompokan desain antarmuka yang
anda buat.
c. Controller berfungsi untuk menyimpan file-file controller yang digunakan untuk
mengatur alur proses aliran data atau fungsi yang dibuat dan merupakan kumpulan
instruksi yang menghubungkan antara View ke Model. Controller merupakan salah
satu bagian yang sangat berperan dalam website berbasiskan MVC. Tanpa controller,
view atau model tidak akan dapat berjalan dengan semestinya. Pada controller
terdapat satu class yang disesuaikan dengan nama file yang dibuat dan beberapa
fungsi yang disesuaikan dengan kebutuhan yang ada.

Keuntungan yang didapat ketika membuat aplikasi dengan menggunakan framework


yaitu sebagai berikut:
a. Menghemat waktu pengembangan
Dengan menggunakan struktur dan library yang telah disediakan oleh framework
maka kita tidak perlu lagi memikirkan hal tersebut, hanya tinggal fokus pada bisnis
proses yang akan kita kembangkan.

2 | Pemrograman Web 2 Nava Gia Ginasta, S.Tr.Kom., M.Kom


b. Re-use of Code
Dengan menggunakan framework maka struktur pemrograman kita akan memiliki
struktur yang baku, sehingga kode program yang sudah dibuat akan dapat
digunakan untuk aplikasi yang lain.
c. Bantuan komunitas
Banyak komunitas yang siap membantu dan juga berbagi ilmu sehingga dapat
meningkatkan kemampuan pemrograman kita
d. Kumpulan best practice
Framework merupakan kumpulan best practice sehingga kita dapat menguatkan
pemrograman kita.

Untuk melakukan pembuatan aplikasi bisnis ini maka kita harus mempersiapkan:
1. Framework CI, kita dapat mengunjungi https://codeigniter.com/ untuk mengunduh
versi terbarunya. Untuk diperhatikan ketika menggunakan CI versi 3+ maka PHP
yang digunakan haruslah PHP versi 5.6.+.
2. Persiapkan editor untuk melakukan pengkodean, kita dapat menggunakan Visual
Studio Code, Notepad++, SublimeText, dll.
3. Persiapkan database yang akan digunakan, sebagai contoh kita dapat
menggunakan XAMPP

1.2. Struktur folder Framework CI


Pada saat kali pertama kita menginstal framework codeigniter secara default
terdapat 3 (tiga) folder utama yaitu application, system, dan user_guide.
a. Application
Merupakan tempat di mana seluruh syntax project aplikasi kita simpan. Folder
application memiliki beberapa folder yang dapat membantu kita dalam men-develop
sebuah aplikasi. Diantaranya adalah sebagai berikut:
1. Folder Cache, merupakan folder yang digunakan untuk menyimpan semua
cache yang dibuat oleh cache library.
2. Folder Config, merupakan folder yang berisi file konfigurasi dari aplikasi yang
dibuat mulai dari database, router dan autoload aplikasi.
3. Folder Controllers, merupakan folder yang berisi file controller dari aplikasi yang
dibuat, digunakan sebagai penghubung antara models dan views.

3 | Pemrograman Web 2 Nava Gia Ginasta, S.Tr.Kom., M.Kom


4. Folder Core, merupakan folder yang digunakan untuk memperluas class inti
codeigniter.
5. Folder Helpers, merupakan folder yang digunakan untuk menyimpan helpers
core ci.
6. Folder Hooks, merupakan folder untuk menyimpan hooks yang digunakan untuk
mengubah alur fungsi dari core codeigniter.
7. Folder Language, merupakan folder yang digunakan untuk menyimpan seluruh
bahasa-bahasa yang akan digunakan.
8. Folder Libraries, merupakan folder yang digunakan untuk menyimpan seluruh
library.
9. Folder Logs, merupakan folder yang digunakan untuk menyimpan seluruh error
log apabila error log diaktifkan.
10. Folder Models, merupakan folder yang digunakan untuk menyimpan models
yang akan mendefinisikan tabel dari database yang dapat kita gunakan oleh
controller yang kita buat untuk mengakses database.
11. Folder Third_party, merupakan folder yang digunakan untuk menyimpan fungsi-
fungsi tambahan di codeigniter.
12. Folder Views, merupakan folder yang digunakan untuk menyimpan seluruh
tampilan-tampilan dari aplikasi yang dibuat atau sering disebut dengan user
interface.

b. System
Folder system biasanya berisi file, baik itu file aplikasi yang sedang dibuat maupun
core-framework. Diantaranya adalah sebagai berikut :
1. Folder Core, merupakan folder yang digunakan untuk memperluas class inti
codeigniter.
2. Folder Database, merupakan folder yang digunakan untuk menyimpan semua
database driver dan class yang akan digunakan.
3. Folder Fonts, merupakan folder yang digunakan untuk menyimpan font yang
digunakan image manipulation library.
4. Folder Helpers merupakan folder yang digunakan untuk menyimpan helper core
ci.
5. Folder Language, merupakan folder yang digunakan untuk menyimpan semua
bahasa core ci.

4 | Pemrograman Web 2 Nava Gia Ginasta, S.Tr.Kom., M.Kom


6. Folder Libraries, merupakan folder yang digunakan untuk menyimpan semua
library core ci

c. User_guide
Folder ini biasanya berisi userguide/ manual penggunaan Framework CI. berikut
folder-folder yang ada didalam folder user_guide.

1.3. File-file pada Framework CI


Setelah mengetahui fungsi ketiga directory tadi, maka selanjutnya kita
mengetahui file-file di codeigniter yang dapat gunakan untuk mengonfigurasi project
aplikasi. File-file konfigurasi tersebut disimpan secara rapi pada folder config tepatnya
pada folder application/ config. Berikut file-file konfigurasi yang ada di dalam folder
tersebut:
1. config.php, digunakan untuk membuat pengaturan dasar pada project aplikasi,
seperti base_url, index_page, cookie, proxy dan lain-lain
2. constant.php, digunakan untuk membuat sebuah constant baru.
3. database.php, digunakan untuk mengatur koneksi database pada project aplikasi.
4. doctypes.php, digunakan untuk tempat penyimpanan deklarasi dokumen Doctype.
5. foreign_chars.php, digunakan untuk tempat penyimpanan karakter-karakter asing
6. hooks.php, digunakan untuk mendefine "hooks" untuk meng extends CI.
7. memcached.php, digunakan untuk kita agar bisa mencache database, driver dan
lain-lain sehingga lebih efektif.
8. migration.php, digunakan untuk kita agar bisa melakukan database migration.
Secara default nya config ini dijadikan false.
9. mimes.php, digunakan untuk menyimpan array yang berisi tipe file untuk fungsi
upload.
10. profiler.php, digunakan untuk mengatur profiler yang berguna pada saat
debugging.
11. routes.php, digunakan untuk mengatur default controller dan override 404.
12. smileys.php, digunakan untuk menyimpan array yang berisi smiley (emoticon)
untuk membantu helperemoticon.
13. user_agents.php, digunakan untuk menyimpan data useragent, yang membantu
classuser agen untuk mengidentifikasi browser, platform, robot dan
datamobiledevice.

5 | Pemrograman Web 2 Nava Gia Ginasta, S.Tr.Kom., M.Kom


Pada konfigurasi sederhana biasanya developer atau programmer mengatur pengaturan
config, autoload, database dan routes.

2. Install XAMPP
Sebelum kita melakukan proses instalasi XAMPP, maka terlebih dahulu kita dapat
mengunduh software Bitnami for XAMPP pada laman web
https://www.apachefriends.org/download.html. Link tersebut akan secara otomatis
mengunduh file installer, tunggu sesaat sampai proses unduh selesai dan siap untuk
dilakukan proses instalasi dengan hasil seperti gambar di bawah ini.

Gambar 2.1 Tampilan Installer XAMPP

Klik dua kali pada aplikasi xampp yang telah diunduh dan akan tampil splash screen
bitnami, setelah itu akan ada peringatan error seperti pada gambar di bawah ini:

Gambar 2.2 Tampilan warning User Account Control

Error tersebut terkait dengan masalah hak akses, klik OK maka akan melakukan proses
awal instalasi Setup – XAMPP dengan tampilan seperti di bawah ini:

6 | Pemrograman Web 2 Nava Gia Ginasta, S.Tr.Kom., M.Kom


Gambar 2.3 Tampilan welcome installer xampp

Setelah itu maka akan tampil halaman pemilihan item apa saja yang akan kita install di
dalam web server xampp. Silahakn disesuaikan dengan kebutuhan kita. Pada kasus ini
kita pilih seluruhnya item-item yang akan diinstall dengan tampilan seperti gambar di
bawah ini :

Gambar 2.4 Tampilan pilih komponen installer

Selanjutnya pilih tombol Next untuk melanjutkan, dan kita akan diarahkan untuk
menentukan drive dan folder instalasi xampp. Jika secara default installer aplikasi maka
akan diarahkan ke drive C dengan folder nama folder xampp7 sesuai dengan gambar
dibawah ini:

7 | Pemrograman Web 2 Nava Gia Ginasta, S.Tr.Kom., M.Kom


Gambar 2.5 Tampilan memilih folder installer

Selanjutnya pilih Next dan akan tampil promosi bitnami menawarkan cara menginstall
CMS seperti pada gambar di bawah ini:

Gambar 2.6 Tampilan bitnami setup

Selanjutnya pilih Next dan proses instalasi akan berjalan untuk melakukan ekstrak file-file
xampp ke dalam hrad drive folder yang telah kita tentukan pada pembahasan
sebelumnya. Selanjutnya tunggu sesaat proses tersebut hingga selesai.

8 | Pemrograman Web 2 Nava Gia Ginasta, S.Tr.Kom., M.Kom


Gambar 2.7 Tampilan progress instalasi

Selanjutnya langkah terakhir dari proses instalasi Xampp adalah akan tampil form
Completing the XAMPP Setup Wizard. Lalu terdapat checkbox Do you want to start the
Control Panel now?, seperti pada gambar di bawah ini:

Gambar 2.8 Tampilan selesai proses instalasi

Biarkan ceklis tersebut, atau jika tidak ada ceklis maka berikan ceklis tersebut maka akan
secara otomatis XAMPP Control Panel akan berjalan lalu klik Finish. Sampai proses ini
instalasi XAMPP telah selesai. Lalu kita coba cek pada folder yang telah kita siapkan
sebelumnya pada proses instalasi. Karena kita memberikan ceklis pada proses akhir,
maka Xampp Control panel akan ditampilkan, namun untuk kali pertama dijalankan akan

9 | Pemrograman Web 2 Nava Gia Ginasta, S.Tr.Kom., M.Kom


diminta untuk menentukan bahasa yang akan kita gunakan, seperti pada gambar di
bawah ini:

Gambar 2.9 Tampilan pemilihan Bahasa

Setelah kita pilih OK maka selanjutnya akan tampil Xampp Control Panel seperti pada
gambar di bawah ini:

Gambar 2.10 Tampilan control panel xampp

Lalu kita pilih tombol Start pada Apache dan MySQL untuk menjalankan web server dan
database kita, dan akan tampil seperti pada gambar di bawah ini:

10 | Pemrograman Web 2 Nava Gia Ginasta, S.Tr.Kom., M.Kom


Gambar 2.11 Tampilan running module xampp

Untuk menguji jika semua sudah berjalan dengan baik, mari kita buka browser dan
arahkan ke alamat URL http://localhost atau http://127.0.0.1 , jika berhasil maka akan
tampil seperti pada gambar di bawah ini:

Gambar 2.12 Tampilan running localhost

11 | Pemrograman Web 2 Nava Gia Ginasta, S.Tr.Kom., M.Kom


3. Pemrograman Web Framework CI
3.1. Komponen MVC
Pada bab ini diharapkan mahasiswa dapat memahami secara detail tentang
pembuatan dan penggunaan komponen model, view, controller yang merupakan kunci
utama dalam menggunakan framework codeigniter. Pada pengertian codeigniter di atas
tadi di jelaskan bahwa codeigniter menggunakan metode MVC. Apa itu MVC? kita juga
harus mengetahui apa itu MVC sebelum masuk dan lebih jauh dalam belajar codeigniter.
MVC adalah teknik atau konsep yang memisahkan komponen utama menjadi tiga
komponen yaitu model, view dan controller.
a. Model
Model adalah kelas yang merepresentasikan atau memodelkan tipe data yang akan
digunakan oleh aplikasi. Model juga dapat didefinisakn sebagai bagian penanganan
yang berhubungan dengan pengolahan atau manipulasi database. seperti misalnya
mengambil data dari database, menginput dan pengolahan database lainnya. semua
intruksi atau fungsi yang berhubung dengan pengolahan database di letakkan di
dalam model. Sebagai contoh, jika ingin membuat aplikasi untuk menghitung luas
dan keliling lingkaran, maka dapat memodelkan objek lingkaran sebagai kelas model.
b. View
View merupakan bagian yang menangani halaman user interface atau halaman yang
muncul pada user(pada browser). tampilan dari user interface di kumpulkan pada view
untuk memisahkannya dengan controller dan model sehingga memudahkan web
designer dalam melakukan pengembangan tampilan halaman website.
c. Controller
Controller merupakan kumpulan intruksi aksi yang menghubungkan model dan
view, jadi user tidak akan berhubungan dengan model secara langsung, intinya data
yang tersimpan di database (model) di ambil oleh controller dan kemudian controller
pula yang menampilkan nya ke view. Jadi controller lah yang mengolah intruksi.

Dari penjelasan tentang model view dan controller di atas dapat di simpulkan bahwa
controller sebagai penghubung view dan model. misalnya pada aplikasi yang
menampilkan data dengan menggunakan metode konsep mvc, controller memanggil
intruksi pada model yang mengambil data pada database, kemudian controller yang
meneruskannya pada view untuk di tampilkan. jadi jelas sudah dan sangat mudah
dalam pengembangan aplikasi dengan cara mvc ini karena web designer atau front-

12 | Pemrograman Web 2 Nava Gia Ginasta, S.Tr.Kom., M.Kom


end developer tidak perlu lagi berhubungan dengan controller, dia hanya perlu
berhubungan dengan view untuk mendesign tampilann aplikasi, karena back-end
developer yang menangani bagian controller dan modelnya. Jadi pembagian tugas
pun menjadi mudah dan pengembangan aplikasi dapat di lakukan dengan cepat dan
terstruktur.

Pada pembahasan ini kita akan coba secara bertahap memulai membuat aplikasi bisnis
menggunakan framework CI. Untuk memulai membuat aplikasi menggunakan
CodeIgniter langkah yang harus kita lakukan adalah sebagai berikut:

1. Buat folder baru dan beri nama web2 pada folder C:\xampp7\htdocs\. Perlu
diperhatikan bahwa drive C ini sesuai dengan proses instalasi xampp pada
pembahasan di atas.
2. Ekstrak file CI dari hasil download https://codeigniter.com/download dan simpan pada
under root web server kita. Jika kita menggunakan XAMPP, maka secara default root
tersebut terletak pada C:\xampp7\htdocs\web2\. Hasil ekstrak akan membentuk
struktur file seperti di bawah ini:

Gambar 3.1 Struktur File CI

13 | Pemrograman Web 2 Nava Gia Ginasta, S.Tr.Kom., M.Kom


Gambar 3.2 Application Flowchart

3. Selanjutnya kita jalankan CI yang telah kita download pada browser dengan mengetikkan
http://localhost/web2/ dan akan tampil seperti gambar di bawah:

Gambar 3.3 Tampilan Welcome to CodeIgniter

Untuk diketahui sebelumnya bahwa proses menampilkan aplikasi pada bahasa program
PHP Native akan berbeda dengan PHP Framework, khususnya pada Framework
CodeIgniter. Jika dalam PHP Native yang akan ditampilkan adalah file dengan nama
index.php atau index.html, namun pada framework CodeIgniter yang akan ditampilkan
adalah sesuai dengan apa yang kita setting pada file routes.php di dalam folder
application/config/.

14 | Pemrograman Web 2 Nava Gia Ginasta, S.Tr.Kom., M.Kom


Proses untuk menampilkan “Welcome to CodeIgniter!” dapat dilihat dari proses seperti
pada gambar di bawah ini:

Folder: application Folder: config File: routes.php

Buka file routes.php

Script: $route['default_controller'] = ‘welcome';

Lakukan pencarian file Welcome.php pada folder


application/controllers

Mencari controller Welcome.php

Folder: application Folder: controllers File: Welcome.php

Buka file Welcome.php

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

Lakukan pencarian file welcome_message.php pada folder


application/views

Mencari controller welcome_message.php

Folder: application Folder: viewss File: welcome_message.php

Buka file welcome_message.php

<?php
defined('BASEPATH') OR exit('No direct script access allowed');
?><!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Welcome to CodeIgniter</title>

<style type="text/css">

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


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

body {
background-color: #fff;
margin: 40px;
font: 13px/20px normal Helvetica, Arial, sans-serif;
color: #4F5155;
}
..........................................................
...........................................................

Gambar 3.4 Alur Baca Program pada Framework CI

3.2. Konfigurasi Framework CI


Setelah mengetahui fungsi directory dan file-file pada framework CI, maka
selanjutnya kita mengkonfigurasi project aplikasi. File-file konfigurasi tersebut

15 | Pemrograman Web 2 Nava Gia Ginasta, S.Tr.Kom., M.Kom


disimpan secara rapi pada folder config tepatnya pada folder application/config.
Berikut file-file konfigurasi yang ada di dalam folder tersebut:

1. Ubah file config.php seperti dibawah ini:

<?php

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

/*
|--------------------------------------------------------------------------
| Base Site URL
|--------------------------------------------------------------------------
|
*/
$config['base_url'] = 'http://localhost/web2';

/*
|--------------------------------------------------------------------------
| Index File
|--------------------------------------------------------------------------
|
| Typically this will be your index.php file, unless you've renamed it to
| something else. If you are using mod_rewrite to remove the page set this
| variable so that it is blank.
|
*/
$config['index_page'] = 'index.php';

2. Ubah file autoload.php seperti dibawah ini:

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

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

Pada file autoload tersebut, akan dilakukan load pertama library dan helper yang
dibutuhkan, seperti library => database ataupun helper => url, form, html, file

3. Ubah file routes.php seperti dibawah ini:

$route['default_controller'] = 'latihan';

16 | Pemrograman Web 2 Nava Gia Ginasta, S.Tr.Kom., M.Kom


$route['404_override'] = '';
$route['translate_uri_dashes'] = FALSE;

3.3. Dasar-Dasar CI
1. Attribut Method
Attribut Method digunakan untuk menentukan bagaimana cara informasi
dari suatu form dikirim ke server. Kita dapat menggunakan salah satu dari
dua acara yaitu method POST atau GET.
a. Membuat Method POST
b. Buat file controller pada application/controllers dengan nama file
Latihan.php lalu buat seperti berikut :
<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');

class Latihan extends CI_Controller {

public function index()


{
//memuat view dengan nama V_latihan1
$this->load->view('v_latihan1');

}
public function method()
{
//mendeklarasikan method POST dengan variabel
$nilai1 = $this->input->post('nilai1');//mengambil nilai1 yang dimasukan
$nilai2 = $this->input->post('nilai2'); //mengambil nilai2 yang dimasukan
$operasi = $this->input->post('operasi'); //mengambil operasi

//membuat kondisi perhitungan


if($operasi=='+'){
$hitung = $nilai1 + $nilai2;
} elseif($operasi=='-'){
$hitung = $nilai1 - $nilai2;
} elseif($operasi=='*'){
$hitung = $nilai1 * $nilai2;
} elseif($operasi=='/'){
$hitung = $nilai1 / $nilai2;
}
echo 'Hasilnya adalah <b>'.$hitung.'</b>';

17 | Pemrograman Web 2 Nava Gia Ginasta, S.Tr.Kom., M.Kom


}
}

c. Buat file view pada application/views dengan nama file


v_latihan1.php lalu buat seperti berikut :
<html>

<head><title>Latihan1</title></head>
<body>
<h2>Latihan Atrribut method</h2>
<form action="<?php echo base_url().'index.php/latihan/method';?>" method="POST">
<table>
<tr>
<td>Nilai 1</td>
<td><input type="number" name="nilai1"></td>
</tr>
<tr>
<td></td>
<td><select name="operasi">
<option value="+">+</option>
<option value="-">-</option>
<option value="*">*</option>
<option value="/">/</option>
</select></td>
</tr>
<tr>
<td>Nilai 2</td>
<td><input type="number" name="nilai2"></td>
</tr>
<tr>
<td><input type="submit" name="hitung"></td>
</tr>
</table>
</form>
</body>
</html>

18 | Pemrograman Web 2 Nava Gia Ginasta, S.Tr.Kom., M.Kom


d. Selanjutnya panggil link pada browser Googlechrome/Mozilla/Internet
explorer http://localhost/web2/index.php/latihan, Lalu masukan
Nilai 1 = 10 dan Nilai 2 = 50 maka akan muncul seperti dibawah ini:

Setelah memasukan nilai 1 dan nilai 2 maka tekan button Hitung ,


maka hasilnya akan seperti gambar dibawah ini:

e. Membuat Method GET


f. Buka folder controllers pada application/controllers dengan nama
file Latihan.php lalu ubah seperti berikut :
$nilai1 = $this->input->post('nilai1');
$nilai2 = $this->input->post('nilai2');
$operasi = $this->input->post('operasi');
Menjadi :
$nilai1 = $this->input->get('nilai1');
$nilai2 = $this->input->get('nilai2');
$operasi = $this->input->get('operasi');

19 | Pemrograman Web 2 Nava Gia Ginasta, S.Tr.Kom., M.Kom


g. Buka folder views pada application/views dengan nama file
v_latihan1.php lalu ubah seperti berikut :
<form action="<?php echo base_url().'index.php/latihan/method';?>"
method="POST">
Menjadi :
<form action="<?php echo base_url().'index.php/latihan/method';?>"
method="GET">
h. Selanjutnya panggil kembali link pada browser
http://localhost/web2/index.php/latihan, Lalu masukan Nilai 1 = 10
dan Nilai 2 = 50 maka akan muncul seperti dibawah ini:

Setelah memasukan nilai 1 dan nilai 2 maka tekan button Hitung ,


maka hasilnya akan seperti gambar dibawah ini:

Perbedaanya ketika menggunakan method GET, maka pada link


ketika button hitung diklik menjadi:
http://localhost/web2/index.php/latihan/methodPOST?nilai1=10&
operasi=%2B&nilai2=50&hitung=Hitung

20 | Pemrograman Web 2 Nava Gia Ginasta, S.Tr.Kom., M.Kom


2. Parsing Data menggunakan konsep MVC
a. Buat file model pada application/models dengan nama file
M_latihan2.php lalu buat seperti berikut :
<?php if (!defined('BASEPATH')) exit('No direct script access allowed');

class M_latihan2 extends CI_Model{

//mendefinisikan function getDataPegawai() dimodel


function getDataPegawai() {
//penampungan data dengan array
$data = array(
array(
'nik' => 12345,
'nama' => 'Robert Rene Albert',
'jabatan' => 'Pelatih Kepala'
),
array(
'nik' => 313133,
'nama' => 'Yaya Sunarya',
'jabatan' => 'Pelatih Fisik'
),
array(
'nik' => 221131,
'nama' => 'Budiman',
'jabatan' => 'Assisten Pelatih'
)
);
return $data;
}

?>

b. Buat file controller pada application/controllers dengan nama file


Latihan2.php lalu buat seperti berikut :
<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');

class Latihan2 extends CI_Controller {

21 | Pemrograman Web 2 Nava Gia Ginasta, S.Tr.Kom., M.Kom


//consturct ini dapat juga berfungsi untuk memanggil pertama helper atau library yang akan diguna
kan
function __construct(){
parent::__construct();
$this->load->model('M_latihan2');
}

public function index()


{
//get data pegawai pada model
$data['list_pegawai'] = $this->M_latihan2->getDataPegawai();

//load view v_latihan2


$this->load->view('v_latihan2',$data);
}

c. Buat file view pada application/views dengan nama file


v_latihan2.php lalu buat seperti berikut :
<html>

<head><title>Latihan2</title></head>
<body>
<h2>Latihan MVC</h2>
<table border=1>
<tr>
<th>NO</th>
<th>NIK</th>
<th>NAMA</th>
<th>JABATAN</th>
</tr>
<?php
$no =1;
foreach($list_pegawai as $rowPegawai){
?>
<tr>
<td><?php echo $no; ?></td>
<td><?php echo $rowPegawai['nik']; ?></td>
<td><?php echo $rowPegawai['nama']; ?></td>
<td><?php echo $rowPegawai['jabatan']; ?></td>
</tr>
<?php
$no++;

22 | Pemrograman Web 2 Nava Gia Ginasta, S.Tr.Kom., M.Kom


} ?>
</table>
</body>
</html>
Penjelasan :
 Perulangan foreach merupakan perulangan khusus untuk
pembacaan nilai array. Seperti yang telah kita bahas pada tutorial
tentang tipe data array: Mengenal Tipe Data Array dan Cara
Penulisan Array dalam PHP, setiap array memiliki pasangan key
dan value. key adalah ‘posisi’ dari array, dan value adalah ‘isi’ dari
array.

 $list_pegawai adalah nama dari array yang telah didefenisikan


sebelumnya pada controller Latihan2.php.
 $rowPegawai adalah nama ‘variabel perantara’ yang berisi data
array pada perulangan tersebut. Anda bebas memberikan nama
untuk variabel perantara ini, walaupun pada umumnya banyak
programmer menggunakan $value, atau $val saja.

23 | Pemrograman Web 2 Nava Gia Ginasta, S.Tr.Kom., M.Kom


d. Selanjutnya panggil link pada browser Googlechrome/Mozilla/Internet
explorer http://localhost/web2/index.php/latihan2, maka akan
muncul seperti dibawah ini:

3. Session
Session digunakan untuk menyimpan data sementara. Pada sebuah
apliksi atau halaman web kita sering melihat bahwa saat saat login
dengan username dan password yang telah dimiliki muncul halaman
utama web yang menampilkan username. sebagai contoh login dengan
username robert dan password 123456 maka saat login berhasil maka
di menu navigasi akan muncul tulisan “robert” atau “selamat datang
robert”.
 Berikut contoh membuat session :
$this->session->set_userdata('nama_session', 'nilai_session');
sebagai contoh :
$this->session->set_userdata('username','robert');
untuk mengakses variable session yang telah dibuat sebelumnya, dapat
menggunakan kode :
$this->session->set_userdata('username');

 Berikut contoh menghapus session :


Untuk menghapus session yang telah dibuat, atau yang sering digunakan
ketika ingin logout pada aplikasi atau web, seperti kode dibawah ini:
$this->session->sess_destroy();

24 | Pemrograman Web 2 Nava Gia Ginasta, S.Tr.Kom., M.Kom


a. Buat file controller pada application/controllers dengan nama file
Latihan3.php lalu buat seperti berikut :
<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');

class Latihan3 extends CI_Controller {

function index()
{
//memuat view dengan nama V_latihan3
$this->load->view('v_latihan3');

function cek_login()
{
//mendeklarasikan method POST dengan variabel
$username = $this->input->post('username');
$password = $this->input->post('password');

//mengecek login dengan username=robert dan password=12345


if($username =='robert' && $password='123456'){

//membuat session username


$this->session->set_userdata('username',$username);

//jika username atau password benar maka akan masuk ke halaman home
redirect(base_url('/index.php/latihan3/home'));
} else {

//jika username atau password salah


echo 'Username atau Password SALAH!';
}

//halaman home
function home(){
//cek session jika masih aktif
if($this->session->userdata('username')) {
//redirect ke halaman home jika session masih aktif
$this->load->view('v_latihan3_home');
} else {
//redirect ke halaman index jika session telah dihapus

25 | Pemrograman Web 2 Nava Gia Ginasta, S.Tr.Kom., M.Kom


redirect(base_url('/index.php/latihan3'));
}
}

function logout()
{
//menghapus session yang telah dibuat
$this->session->sess_destroy();
//redirect ke halaman login
redirect(base_url('/index.php/latihan3/'));
}

b. Buat file view pada application/views dengan nama file


 v_latihan3.php lalu buat seperti berikut :
<html>

<head><title>Latihan3</title></head>
<body>
<h2>Latihan Session Login</h2>
<form action="<?php echo base_url().'index.php/latihan3/cek_login';?>" method="POST">
<table>
<tr>
<td>Username</td>
<td><input type="text" name="username"></td>
</tr>
<tr>
<td>Password</td>
<td><input type="password" name="password"></td>
</tr>
<tr>
<td><input type="submit" name="login" value="login"></td>
</tr>
</table>
</form>
</body>
</html>

26 | Pemrograman Web 2 Nava Gia Ginasta, S.Tr.Kom., M.Kom


 v_latihan3_home.php lalu buat seperti berikut :
<html>

<head><title>Latihan3</title></head>
<body>
<?php
//Menampilkan session username
echo 'Selamat datang <b>'.$this->session->userdata('username').'</b> di pemrograman web2';
//Logout atau keluar dari aplikasi / hapus session username
echo '<br><a href="'.base_url().'/index.php/latihan3/logout">Logout</a>';
?>
</body>
</html>

c. Selanjutnya panggil link pada browser


http://localhost/web2/index.php/latihan3 , Lalu masukan username =
robert dan password = 123456 maka akan muncul seperti dibawah
ini:

Lalu klik button login.

27 | Pemrograman Web 2 Nava Gia Ginasta, S.Tr.Kom., M.Kom


 jika username dan password sesuai maka akan muncul seperti
berikut :

 jika username dan password tidak sesuai maka akan muncul


seperti berikut :

28 | Pemrograman Web 2 Nava Gia Ginasta, S.Tr.Kom., M.Kom

Anda mungkin juga menyukai