MODUL WEB PROGRAMMING II

(1)

MODUL WEB

PROGRAMMING II

Berbasis Framework Dengan Teknik OOP

Penyusun : Sopian Aji M.Kom

STMIK Nusa Mandiri Jakarta

(2)

2 DAFTAR ISI

MODUL 1 : MENGENAL FRAMEWORK CODEIGNETER ... 1 MODUL 2 : INSTALASI SOFTWARE PENDUKUNG ... 4 MODUL 3 : KONFIGURASI ATAU SETTING FRAMEWORK CODEIGNITER ... 12 MODUL 4 : MENGENAL CRUD PADA FRAMEWORDK CODEIGNTER ... 17 MODUL 5 : MEMBUAT SESSION PADA FRAMEWORDK CODEIGNTER ... 26 MODUL 6 : MENGELOLA DATA BERITA ... 37

(3)

1 MODUL 1

MENGENAL FRAMEWORK CODEIGNETER ( Pertemuan 1 )

TUJUAN

1. Mahasiswa mengenal framework codeigniter TUGAS PENDAHULUAN

1. Mahasiswa dapat mengenal framework codeigniter

2. Mahasiswa dapat mengenal fungsi, kelebihan dan kekurangan CodeIgniter

DASAR TEORI A. Codeigniter

Sumber : https://www.codepolitan.com/tutorial-ngoding-kilat-codeigniter-rahasia- bongkar-harviacode-dan-auth-58baeb3db7f3c

Codeigniter merupakan framework PHP yang diklaim memiliki eksekusi tercepat dibandingkan dengan framework lainnya. Codeigniter bersifat open source dan menggunakan model basis MVC (Model View Controller), yang merupakan model konsep modern framework yang digunakan saat ini (Widodo, 2013)

Codeigniter adalah sebuah framework php yang bersifat open source dan menggunakan metode MVC (Model, View, Controller). codeigniter bersifat free alias tidak berbayar jika anda menggunakannya. framework codeigniter di buat dengan tujuan sama seperti framework lainnya yaitu untuk memudahkan developer atau programmer dalam membangun sebuah aplikasi berbasis web tanpa harus membuat nya dari awal.(Hadi, n.d.)

(4)

2 B. Framework

Framework sendiri adalah suatu kerangka kerja dalam aplikasl yang didalamnya memiliki fungsi-fungsi (bagian-bagian) program yang telah disusun, sehingga programmer tidak perlu membuat kode dari nol, karena framework telah menyediakan library yang diperlukan.(Widodo, 2013)

Framework adalah kumpulan intruksi-intruksi yang di kumpulkan dalam class dan function- function dengan fungsi masing-masing untuk memudahkan developer dalam pemanggilannya tanpa harus menuliskan syntax program yang sama berulang-ulang. hal ini memiliki kegunaan untuk menghemat waktu dan mencegah penulisan syntax secara berulang-ulang agar tercipta nya source code yang bersih dan terstruktur. (Hadi, n.d.)

C. Fungsi CodeIgniter

Fungsi CodeIgniter yaitu (Idcloudhost, 2017)

1. Mempercepat dan mempermudah kita dalam pembuatan website.

2. Menghasilkan struktur pemrograman yang sangat rapi, baik dari segi kode maupun struktur file phpnya.

3. Memberikan standar coding sehingga memudahkan kita atau orang lain untuk mempelajari kembali system aplikasi yang dibangun.

D. Kelebihan CodeIgniter

Kelebihan CodeIgniter yaitu (Idcloudhost, 2017)

1. Berukuran sangat kecil. File download nya hanya sekitar 2MB, itupun sudah includedokumentasinya yang sangat lengkap.

2. Dokumentasi yang bagus. Saat anda mendownloadnya, telah disertakan dengan dokumentasi yang berisi pengantar, tutorial, bagaimana panduan penggunaan, serta referensi dokumentasi untuk komponen-komponennya.

3. Kompitabilitas dengan Hosting. CodeIgniter mampu berjalan dengan baik pada hampirsemua platfom hosting. CodeIgniter juga mendukung database-database paling umum, termasuk MySQL.

4. Tidak ada aturan coding yang ketat. Terserah anda jika anda hanya ingin menggunakan Controller, tanpa View, atau tidak menggunakan Model, atau tidak salah satu keduanya.

Namun dengan menggunakan ketiga komponennya adalah pilihan lebih bijak.

5. Kinerja yang baik. Codeigniter sangat cepat bahkan mungkin bisa dibilang merupakan

(5)

3 framework yang paling cepat yang ada saat ini.

6. Sangat mudah diintegrasikan. CodeIgniter sangat mengerti tentang pengembangan berbagai library saat ini. Karenanya CodeIgniter memberikan kemudahan untuk diintegrasikan dengan library-library yang tersedia saat ini.

7. Sedikit Konfigurasi. Konfigurasi CodeIgniter terletak di folder aplication/config.

CodeIgniter tidak membutuhkan konfigurasi yang rumit, bahkan untuk mencoba menjalankannya, tanpa melakukan konfigurasi sedikitpun ia sudah bisa berjalan.

8. Mudah dipelajari. Disamping dokementasi yang lengkap, ia juga memiliki berbagai forum diskusi.

E. Kekurangan CodeIgniter

Kekurangan CodeIgniter yaitu (Idcloudhost, 2017)

1. CodeIgniter tidak ditujukan untuk pembuatan web dengan skala besar.

2. Library yang sangat terbatas. Hal ini dikarenakan sangat sulit mencari plugin tambahan yang terverifikasi secara resmi, karena pada situsnya CodeIgniter tidak menyediakan plugin-plugin tambahan untuk mendukung pengembangan aplikasi dengan CI.

3. Belum adanya editor khusus CodeIgniter, sehingga dalam melakukan create project dan modul-modulnya harus berpindah-pindah folder.

(6)

4 MODUL 2

INSTALASI SOFTWARE PENDUKUNG ( Pertemuan 2 )

TUJUAN

1. Mahasiswa mampu melakukan instalasi software pendukung dengan baik TUGAS PENDAHULUAN

1. Software pendukung apakah yang dibutuhkan untuk mengerjakan sebuat aplikasi website

2. Mahasiswa mampu secara mandiri melakukan instalasi Xampp dan Text Editor Atom

3. Mahasiswa Mampu menambahakan Packages pada text editor yang digunakan pada PC atau laptop masing-masing

DASAR TEORI

Berikut ini adalah penjelasan mengenai Xampp sebagai software pendukung yang kita gunakan (Habibi & Sandi, 2020) Xampp merupakan paket perangkat lunak (software) yang tersedia secara gratis sehingga bebas untuk digunakan tanpa perlu menggunakan licence dari pengembang software. XAMPP berfungsi sebagai server yang beridi sendiri (localhost) yang tediri dan Apache HTTP Server, MySQL database dan penerjemah Bahasa yang ditulis dengan Bahasa pemrograman PHP dan Ped, XAMPP saat ini dikembangkan oleh perusahaan apache friends yang biasanya digunakan untuk simulasi pengembangan website.

(7)

5 KEGIATAN PRAKTIKUM

Sebelum memulai praktek pembuatan website ada beberapa aplikasi pendukunga pada Sistem Operasi Windows yang harus kita siapakan, sebagai berikut:

A. Instal Xampp

1. Untuk memulai instal xampp, kita langsung kunjungin saja situs resminya https://www.apachefriends.org/download.html versi yang disarannya adalah versi 7 keatas.

2. Setelah kita berhasil mendownload master xampp lakukan instalasi, double klik master xampp maka akan melihat pesan dialog yang menanyakan apakah Anda yakin akan menginstalnya. Klik Yes untuk melanjutkan instalasi.

3. Klik tombol Next, untuk melanjutkan proses instalasi

(8)

6 4. Pada dialog ini Xampp menawarkan beberapa komponen dari XAMPP yang ingin dan tidak ingin kita instal. Namun jika kita ingin default dari Xampp mana klik Next untuk instal secara otomatis.

5. Tentukan lokasi Xampp yang kita inginkan, untuk default lokasi pada lokasi disk C kemudian Next untuk melanjutakan proses instalasi

6. Disini kita akan memilih apakah kita ingin menginstal Bitnami untuk XAMPP, dimana nantinya dapat kita gunakan untuk install WordPress, Drupal, dan Joomla secara

(9)

7 otomatis. Klik Next untuk pengaturan default dari Xampp

6. Pada langkah ini proses instalasi XAMPP akan mulai diprose. Silakan klik tombol Next, tunggu proses sampai selesai.

7. Setelah proses berhasil diinstal, akan muncul notifikasi secara otomatis untuk langsung menjalankan control panel. Silakan klik Finish

(10)

8 8. Buka aplikasi XAMPP kemudian klik tombol Start pada Apache dan MySQL untuk mematikan proses instal telah berhasil terinstal dengan baik. Jika berhasil dijalankan, Apache dan MySQL tombol Start menjadi Stop menandakan Apache dan MySQL telah aktif.

9. Sekarang buka browser yang ada pada PC/Laptop dan ketikkan http://localhost/phpmyadmin/ di address bar. Jika muncul tampilan seperti gambar di bawah ini, instalasi telah berhasil.

(11)

9 B. Instal Atom

1. Langkah awal untuk menginstal Text Editor Atom adalah mendapatan .exe Text Editor Atom terlebih dulu dengan cara mendownload file master .exe dengan langsung mengunjui situs resminya dari Text Editor Atom https://atom.io/

2. Setelah proses download selesai, untuk melanjutkan proses instal double klik hasil download .exe Atom Text Editor tersebut. Tunggu proses instal hingga selesai, jika proses instal berjalan dengan baik, maka secara otomatis Atom Text Editor terbuka secara otomatis. Namun jika gagal saat proses instalasi karena spesifikasi hardware atau software yang tidak mendukung bisa mengganti dengan text editor lainnya seperti Sublime, Visual Studio Code dan lainnya

(12)

10 3. Instal package pada menu bar File-Settings-Install pada search packages lakukan pencarian

packages sesuai dengan kebutuhan dan klik Instal untuk menginstal package

Adapun packages yang disarankan pada projek kali ini adalah sebagi berikut:

• Codeigneter

Codeigneter merupakan package untuk memudahkan kita pada saat menulis script pada codeigneter seperti pembuatan controllers, model dan lainnya

• Emmet

Emmet merupakan package untuk bahasa HTML atau CSS. Package emmet ini mempermudah dan mempercepat dalam menulis tag HTML atau CSS

• JavaScript Snippets

JavaScript Snippets mirip seperti Emmet, berfungsi untuk mempercepat dalam menulis kode program yakni JavaScript

• File-icons

File-icons merupakan package untuk mengubah tampilan file menjadi logo yang berbeda sesuai bahasa pemrograman yang dipakai. Tentu saja ini akan memudahkan kita untuk mencari sebuah file dan mempercantik tampilan projek yang kita kerjakan.

(13)

11

4. Pengaturan garis bantu pada menu bar File-Settings-Editor aktifkan show Indent Guide untuk memudahkan dalam merapihkan pada saat menulis script pada projek yang kita kerjakan

5. Pengaturan tampilan lembar kerja menu bar File-Settings-Themes pada bagian ini kita pada merubah-rubah tampilan sesuai dengan yang kita inginkan

Tugas

1. Instal aplikasi pendukung telah terinstal dengan baik pada PC atau laptop maisng- masing, seperti Xampp dengan versi diatas 7 dan Text Editor Atom atau Text Editor lainnya.

2. Setelah terinstal Text Edit pada PC atau laptop dilanjutkan untuk menginstal Packages khusunya pada Packages Codeigneter, Packages Emmet dan Packages JavaScript Snippets untuk memudahkan pengerjaan projek yang kita kerjakan

(14)

12 MODUL 3

KONFIGURASI ATAU SETTING FRAMEWORK CODEIGNITER ( Pertemuan 3)

TUJUAN

1. Membuat databases dan tabel

2. Mendaptakan framework codeigniter

3. Mahasiswa mampu melakukan konfigurasi atau setting framework codeigniter

TUGAS PENDAHULUAN

1. Mahasiswa mampu membuat databases dan tabel pada xampp 2. Bagaimana cara mendapatkan framework codeigniter

3. Bagaimana cara melakukan konfigurasi atau setting framework codeigniter

KEGIATAN PRAKTIKUM A. Membuat database dan Tabel

Sebelum kita merancang sebuah website atau latihan pembelajaran pada pembahasan ini, kita buat databases terlebih dulu, untuk pembuatan databases dan Tabel kali ini melalui menu console pada phpmyadmin dengan Langkah-langkah sebagai berikut:

1. Aktifkan apache dan mysql pada Xampo Control Panel

(15)

13 2. Buka browse ketikan http://localhost/phpmyadmin pada menu console ketikan script dibawah

ini untuk membuat databases dan Ctrl+Enter untuk menjalankan perintahnya create database dbportalci

3. Sedangkan untuk tabel ketikan script dibawah ini untuk membuat tabel dan Ctrl+Enter untuk menjalankan perintahnya

CREATE TABLE `admin` (

`kd_admin` varchar(15) NOT NULL,

`nama_admin` varchar(100) NOT NULL, PRIMARY KEY (`kd_admin`)

)

Jika kita lihat hasil dari script diatas didapat struktur tabel sebagai berikut

Name Type Keterangan

kd_admin Varchar (15) Primary Key nama_admin Varchar (100)

(16)

14 B. Konfigurasi atau Setting Framework Codeigniter

Setelah kita membuat databases dan table, berikutnya barulah kita masuk kepembahasan setting framework codeigniter, dengan Langkah-langkah sebagai berikut ini:

1. Sebelum kita lakukan setting framework codeigniter terlebih dulu kita siapkan framework codeigniter, untuk mendapatkan kita langsung saja kunjungi situs resmi dari framework codeigniter https://codeigniter.com/download

2. Download codeigniter versi Codeigniter 3 pada pembahasan materi ini, setelah kita berhasil mendownload framework codeigniter 3, kita extrak pada lokasi menempatkan xampp dengan lokasi c:\xampp\htdocs dan buat folder baru dengan nama belajarci, hasil extrak ubah namany Dengan nama projek portalci, pada hal ini penulis xampp berada pada lokasi disk C.

3. Untuk memastikan saja framework codeigniter yang kita download dan yang telah kita extrak pada lokasi c:\xampp\htdocs\belajarci projek tersebut tidak ada dokumen yang korup atau rusak maupun error sehingga siap kita gunakan untuk membangun sebuah aplikasi yang kita inginkan. Buka browse ketikan http://localhost/belajarci/portalci maka secara default akan tampil halaman welcome to codeigniter menandakan bahwa framework berjalan dengan baik

(17)

15 4. Buka text editor atom dan drag projek portalci kedalam text edit atom, untuk melakukan konfigurasi atau setting kita focus pada folder application\config kita akan buka file autoload.php pada file ini kita tambahkan database pada [‘libraries’] line 61 seperti gambar dibawah ini, pada CRUD karena masih sangat sederhana libraries yang kita gunakan baru memanggil databases

5. Masih pada file application\config\ autoload.php pada file autoload.php namun pada line 92 kita tambahkan array(‘url’) sehingga format url yang kita gunakan akan terbaca

6. Untuk setting pada file application\config\config.php pada file config.php line 26 ini kita ubah seperti gambar dibawah yaitu line 27-29 dengan tujuan pada saat membuka website pada lokasi lainnya secara otomastis terbaca tanpa harus mengubah-ubah lokasinya lagi. Misalnya kita tadi

(18)

16 menempatkan projek portalci pada folder belajarci, kemudian kita pindahkan ke folder lainnya secara otomatis tetap terbaca tanpa harus setting kembali pada file config.php dengan script sebagai berikut:

$config['base_url'] = ((isset($_SERVER['HTTPS']) && $_SERVER['HTTPS'] == "on") ?

"https" : "http");

$config['base_url'] .= "://" . $_SERVER['HTTP_HOST'];

$config['base_url'] .= str_replace(basename($_SERVER['SCRIPT_NAME']), "",

$_SERVER['SCRIPT_NAME']);

\

7. Untuk setting pada file application\config\database.php pada file database.php karena local kita focus di line 79 pada username = ‘root’ dan di line 81 pada database= ‘dbportalci’

8. Untuk setting pada file application\config\routes.php pada file routes.php yaitu pada line 52

‘default_controller’ berfungsi untuk memanggil control yang pertama kali dipanggil saat website dijalankan, secara default framework codeigniter akan memanggil welcome, kali ini untuk sementara kita biarkan secara default terlebih dulu.

(19)

17 MODUL 4

MENGENAL CRUD PADA FRAMEWORDK CODEIGNTER ( Pertemuan 4, 5)

TUJUAN

1. Mengenal CRUD dasar framework codeigniter 2. Penerapan MVC dengan Teknik OOP

1. Bagaimana Mahasiswa mampu menguasai CRUD dengan baik 2. Mahasiswa mampu menerapkan MVC dengan Teknik OOP

KEGIATAN PRAKTIKUM

1. Pada pembuatan script yang pertama kali kita buat adalah control terlebih dulu, bagaiaman mana cara membuat control masuk ke lokasi folder application\controllers klik kanan pilih New File beri nama control Admin.php dengan diawalin huruf dengan menggunakan huruf kapital, diakhir enter pada keybord untuk membuat file

2. Untuk membantu script control karen kita telah instal package codeigniter kita bisa memanggil package dengan mengetikan cic maka secara otomatis package codeigniter akan mengarahkan script pada package codeigniter yang biasa digunakan dalam pembuatan aplikasi framework codeigniter dan pilih cicontroller dengan menekan tombol enter untuk membuat control

(20)

18 3. Kita telah membuat control sampai ini kita ubah nama Classname dan function kita sesuaikan dengan kebutuhan. Jangan lupa untuk menyimpan file ctrl+s jika melalui keybord atau melalui menu bar file-save.

4. Kemudian kita lengkapi script control Admin, untuk penjelasan script telah diberi penjelasan pada komentar script, dengan ditandai // atau /* */

<?php

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

class Admin extends CI_Controller{

/*

$view berfungsi untuk membaca file view seperti read.php, create.php dan edit.php dengan lokasi folder views/backend/v_admin/

*/

private $view = "backend/v_admin/";

//memanggil control Admin/index dalam keadaan refresh private $redirect = "Admin";

public function __construct() {

parent::__construct();

(21)

19 //control Admin menghubungkan model M_admin

$this->load->model('M_admin');

}

function index(){

//memanggil model M_admin dengan function GetAll $read = $this->M_admin->GetAll();

$data = array(

//'read' variabel yang akan dipanggil pada view read.php 'read'=> $read

);

/*

dengan $this->view artinya memanggil private $view="backend/v_admin/"

dilanjutkan dengan 'read' untuk memanggil read.php */

$this->load->view($this->view.'read', $data);

}

public function create(){

//untuk create tidak memangil model, langsung ke view dengan data baru $data = array(

'create' => '' );

$this->load->view($this->view.'create', $data);

}

public function save(){

$data = array(

'kd_admin'=> $this->input->post('kd_admin'), 'nama_admin'=> $this->input->post('nama_admin') );

$this->M_admin->save($data);

//dengan $this->redirect artinya memanggil private $redirect = "Admin"

redirect($this->redirect,'refresh');

}

public function edit(){

/*

segment 1 adalah control, segment 2 adalah function, segment 2 adalah PK, data yang akan ditambilkan hanya yang dipilih saja sesuai PK yang dipilih */

$kd = $this->uri->segment(3);

$data = array(

//'edit' variabel yang akan dipanggil pada view edit.php 'edit' => $this->M_admin->edit($kd)

);

$this->load->view($this->view.'edit', $data);

}

(22)

20 public function update(){

$data = array(

/*

'nama_admin' =nama yang diambil dari fild pada tabel

$this->input->post('nama_admin') =nama yang diambil dari form */

'nama_admin'=> $this->input->post('nama_admin') );

$this->M_admin->update($kd,$data);

}

public function delete(){

$data = array(

//data akan dihapus sesuai uri->segment(3) yang dipilih 'kd_admin' => $kd

);

$this->M_admin->delete($data);

} }

5. Setelah kita membuat control selanjutnya kita akan membuat model, dimana pada control Admin membutuhkan model dengan nama M_admin. Untuk membuat model pada application\models klik kanan pilih New File kita bernama M_admin.php dan tekan Enter pada Keyborad sehingga tampil seperti gambar dibawah ini. Sama seperti pada control untuk memudahkan script pembutakan model dengan mengetikan cim kemudian pilih cimodel tekan Enter pada Keyborad

6. Ganti Classname dan Function sesuai dengan kebutuhan, berikut script model yang

(23)

21 digukanan pada M_admin dengan menambahakan komentar sebagai penjelasan script sebagai berikut:

<?php

class M_admin extends CI_Model{

//$table sebagai tabel yang digunakan, dengan pemanggilannya $this->table private $table = 'admin';

//$pk atau Primary Key yang digunakan, dengan pemanggilannya $this->pk private $pk = 'kd_admin';

public function GetAll(){

$this->db->order_by($this->pk, 'desc');

return $this->db->get($this->table);

}

public function save($data){

return $this->db->insert($this->table, $data);

}

public function edit($kd){

$this->db->where($this->pk, $kd);

return $this->db->get($this->table)->row_array();

}

public function update($kd,$data){

return $this->db->update($this->table, $data);

}

public function delete($data){

$this->db->where($data);

return $this->db->delete($this->table);

} }

7. Berikutnya baru kita masuk dibagian view, pada modul ini pembahasan projek kita focus pada bagian backend maka dari itu pada folder view kita buat lagi folder backend sebagai view pada bagian administrator. Setelah kita membuat folder backend didalam folder, kita kembali membuat folder yakni v_admin yang berarti bahwa view dari control dari Admin yakni view dari file read.php, create.php dan edit.php

8. Pada view pertama yang kita buat tentu saja read.php karena sebagai view index dari control admin dengan kita telah membuat read.php kita bisa memanggil halaman

(24)

22 lainnya seperti view dari create.php, edit.php dan aksi dari delete. Berikut ini adalah script dari view read.php yang berfungsi untuk menampilkan seluruh record pada tabel admin. Klik kanan pada folder v_admin pilih New File

<a href="<?php echo site_url('Admin/create') ?>"><button type="button"

name="button" title="untuk menambah data">Tambah</button></a>

<tr>

</tr>

<?php $no=1;

//$read yang diambil dari control function index foreach ($read->result_array() as $row) { ?>

<tr>

<td>

<a href="<?php echo site_url('Admin/edit/'.$row['kd_admin'])?>"

title="tombol utk merubah data">Ubah</a> |

<a href="<?php echo site_url('Admin/delete/'.$row['kd_admin'])?>"

onclick="javascript: return confirm('Yakin Mau dihapus <?php echo

$row['nama_admin'];?>')">Hapus</a>

</td>

</tr>

<?php $no++;

} ?>

</table>

9. Sampai pada view read.php ini kita dapat melihat hasil dari control admin, yakni kita kembali pada setting framework codeigniter untuk memanggil control admin application\config\routes.php kita ganti default_controller sebelumnya memanggil welcome menjadi Admin

(25)

23 10. Buka browse ketikan http://localhost/belajarci/portalci maka secara default control Admin yang akan dijalankan, untuk data tidak terlihat karena kita belum mengisikan record pada tabel admin

11. Disinilah kita akan menambahkan data melalui file create.php dimana view dari control admin pada function create yang berfungsi untuk menambah record pada tabel admin.

Klik kanan pada folder v_admin pilih New File dan beri nama create.php

<form class="" action="<?php echo site_url ('Admin/save') ?>" method="post">

<label>Kode Admin</label><br>

<label>Nama Admin</label><br>

<button type="submit" name="button">Simpan</button>

<a href="<?php echo site_url('Admin') ?>"><button type="button"

name="button">Batal</button></a>

</form>

(26)

24 12. Sehingga saat kita mengisikan data pada form create.php dan menyimpannya akan

redirect ke control admin

13. View terakhir yaitu view edit.php yakni view data control Admin dengan function edit yang berfungsi untuk mengubah data pada tabel admin. Klik kanan pada folder v_admin pilih New File dan beri nama edit.php. Jika kita perhatikan pada text dengan nama kd_admin terdapat 2(dua) text, yang membedakaan adalah disable dan hidden. Disable yang artinya text tidak dapat di isi atau diubah datanya, tp dengan disable tentu saja text ini tidak dapat dikirim melalui form. Sebagai pengganti data yang bisa dikirim adalah yang text hidden sehingga text dapat dikirim melalui form.

<form class="" action="<?php echo site_url('Admin/update/'.$edit['kd_admin'])

?>" method="post">

<input type="text" name="kd_admin" disabled value="<?php echo

$edit['kd_admin'] ?>"><p></p>

<input type="text" name="kd_admin" hidden value="<?php echo

$edit['kd_admin'] ?>"><p></p>

<label>Nama Admin</label><br>

<input type="text" name="nama_admin" value="<?php echo

$edit['nama_admin'] ?>"><p></p>

<button type="submit" name="button">Perbaharui</button>

<a href="<?php echo site_url('Admin') ?>"><button type="button"

name="button">Batal</button></a>

</form>

(27)

25 Tugas

1. Sebagai pengembangan pada CRUD pada control Admin, dengan menabahkan lebih detail field pada tabel admin, tentu saja hal ini akan mempengarui view pada read, create dan edit. Dengan struktur tabel admin sebagai berikut:

kd_admin Varchar (15) Primary Key nama_admin Varchar (100)

email_admin Varchar (100) hp_admin Varchar (13)

pswd_admin Varchar (100) Enkripsi MD5

2. Isi record dengan data nama kelompok mahasiswa

(28)

26 MODUL 5

MEMBUAT SESSION PADA FRAMEWORDK CODEIGNTER ( Pertemuan 6)

TUJUAN

1. Mengenal CRUD dasar framework codeigniter 2. Penerapan MVC dengan Teknik OOP

1. Bagaimana Mahasiswa mampu menguasai CRUD dengan baik 2. Mahasiswa mampu menerapkan MVC dengan Teknik OOP KEGIATAN PRAKTIKUM

Session adalah sebuah variable yang disimpan pada server bersifat sementara pada akhirnya menjadi data sementara dengan tujuan dari segi keamanan sebuah aplikasi dan data terssebut akan hancur dengan mengakhiri data tersebut. Dengan kata lainnya session adalah validasi login atau hak akses untuk sebuah keamanan yakni ketika kita berhasil login pada aplikasi dan ketika kita logout dari aplikasi tersebut. Pada framework codeigniter untuk session telah disediakan yakni pada library session, sehingga memudahkan kita tinggal memanggilnya saja dengan demikian memudahkan kita dalam penulisan script session. Berikut ini kita terapkan session pada projek dengan Langkah-langkah sebagai berikut:

1. Kembali kita setting framework codeigniter pada application\config\autoload.php line 61 kita tambahakan 'session' dan 'template'. 'session' berfungsi untuk mengaktifkan session pada libraries. Selain kita menambahakan session penulis langsung membahas bersamaan dengan 'template' berfungsi untuk halaman utama untuk mempercantik tampilan website, namun kali ini template disini dibuat sangat sederhana hanya dalam bentuk tombol-tombol saja untuk memanggil halaman lainnya, dengan catatan setelah kita memahami pembahasan mengenai template css atau bootstrap tentu saja file ini bisa langsung kita digunakan sebagai template pada halaman website kita yakni dengan menempatkan file sesuai dengan pembahasan pada modul ini dan memberi nama file css atau bootstrap dengan nama yang sama yakni template.php

(29)

27 2. Tambahkan file Template.php pada lokasi application\libraries dengan dengan script

sebagai berikut:

<?php

class Template {

var $template_data = array();

function set ($name,$value){

$this->template_data[$name] = $value;

}

function load($template = '', $view = '', $view_data = array(), $return = FALSE){

$this->CI =& get_instance();

$this->set('contents', $this->CI->load->view($view, $view_data, TRUE));

return $this->CI->load->view($template,$this->template_data, $return);

} } ?>

(30)

28 3. Dengan views class Template dengan nama file template.php pada lokasi

application\views\backend\template.php

<head>

<title>portalci</title>

</head>

<body>

<a href="<?php echo site_url('Home') ?>">Beranda</a> | <a href="<?php echo site_url('Admin') ?>">Data Admin</a> |

<a href="<?php echo site_url('Kategori') ?>">Data Kategori</a> |

<a href="<?php echo site_url('Berita') ?>">Data Berita</a> |

<a href="<?php echo site_url('Auth/logout') ?>">Keluar</a>

<hr>

<?php echo $judul; echo '<small>'; echo' >> '; echo $sub; echo '</small>'; ?>

<p></p>

<?php echo $contents ?>

</body>

</html>

(31)

29 4. Masih pada autoload.php yakni pada application\config\autoload.php line 92 dengan menambahkan islogin_helper.php berfungsi untuk memanggil function dengan pemberian nilai atau algorima lainnya pada islogin_helper.php

5. Kita tambahkan islogin_helper.php pada lokasi folder application\helpers dengan dengan script sebagai berikut:

<?php

//-->session

function IsAdmin(){

$ci =& get_instance();

//session akan aktif jika session bernilai 1 if($ci->session->userdata('IsAdmin')<>1){

redirect('auth','refresh');

} }

//-->Endsession ?>

(32)

30 6. Berikutnya kita buat control Auth dengan tujuan memvalidasi data ketika akan memasuki halaman utama administrator secara default akan menampilkan view login, control Auth lokasi file pada application\controllers\Auth.php

<?php

class Auth extends CI_Controller { private $redirect = "admin";

public function __construct(){

//Load model

$this->load->model('M_auth');

}

public function index(){

$this->session->sess_destroy();

$data = array(

'login' => '' );

$this->load->view('backend/login', $data);

}

public function login(){

$kd = $this->input->post('kd_admin');

$pwd = md5($this->input->post('pswd_admin'));

$data = $this->M_auth->CekLogin('admin','kd_admin',$kd);

//jika login

if($data['pswd_admin'] == $pwd AND $data['kd_admin'] == $kd){

$array = array(

'kd_admin' => $data['kd_admin'],

'nama_admin' => $data['nama_admin'],

'IsAdmin' => 1

(33)

31

);

$this->session->set_userdata($array);

redirect('Home','refresh');

}else{

echo "<script>alert('Username atau Password salah!');</script>";

redirect('Auth','refresh');

}

public function logout() {

//data session akan di hancurkan

$this->session->sess_destroy();

redirect('Auth','refresh');

} }

7. Membuat model dari control Auth dengan nama M_auth.php pada lokasi file application\models\M_auth.php

<?php

class M_auth extends CI_Model {

public function CekLogin($table,$pk,$kd){

$this->db->where($pk, $kd);

return $this->db->get($table)->row_array();

} }

(34)

32 8. Dengan view control Auth dengan nama file login.php pada lokasi file

application\views\backend\login.php

<label>Password</label><br>

</form>

9. Kali ini kita bisa melihat hasil dari control Auth, jangan lupa pada setting framework codeigniter pada bagian default_controller ganti pada control Auth

(35)

33 10. Buka browse ketikan http://localhost/belajarci/portalci maka secara default akan memanggil control Auth dengan view login.php sehingga untuk masuk pada halaman utama atau halaman berikutnya ditahan untuk melakukan validasi login terlebih dulu

11. Lakukan login dengan memasukkan kode admin dan passoword (Enkripsi MD5), jika berhasil login maka secara default memanggil control Home, maka akan tampil Page Not Found seperti gambar dibawah, hal ini karena control Home belum tersedia.

12. Pada langkah ini kita buat control Home, script control Home jika kita perhatikan pada line 15 IsAdmin() yang artinya pada file home.php yakni control Admin telah mengaktifkan session, sehingga jika control ini dipanggil kita harus mempunyai nilai session atau telah berhasil login melalui validasi control Auth yakni validasi login.

Demikian juga script saat pemanggilan view pada line 27 telah memanggil libraries template dengan demikain saat kita akan memanggil view seperti read.php , create.php dan edit.php views pemanggilan harus melalui libraries template, maka script pemanggilan view pada control Admin pada pembahasan sebelumnya diganti seperti script pemanggilan view pada control Home

(36)

34

<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');

class Home extends CI_Controller { private $view = "backend/v_home/";

private $redirect = "Home";

public function __construct(){

//mengaktifkan session dengan demikian halaman ini jika dipanggil kini membutuhkan session

IsAdmin();

}

$data = array(

'judul' => "BERANDA", 'sub' => "Halaman Beranda"

);

/*

$this->template memanggil libraries template,

load('backend/template' artinya memanggil file template.php, $this->view.'read' memanggil file read.php

catatan: setelah kita mengetahui untuk view kali ini script ada penambahan template,

maka CRUD Admin pembalajaran sebelumnya mengikuti script seperti pada control Home */

$this->template->load('backend/template',$this->view.'read', $data);

} }

(37)

35 13. Pada control Home kali ini, control Home tidak memanggil model yakni langsung

memanggil view dengan script sebagai berikut

<head>

</head>

<body>

<h2>Halaman Beranda</h2>

</body>

</html>

14. Untuk view control Home dengan nama file read.php dengan lokasi folder application\views\backend\v_home\read.php script view read.php sebagai berikut

<head>

</head>

<body>

<h2>Halaman Beranda</h2>

</body>

</html>

(38)

36 15. Kali ini refresh browser pada langkah nomor 11 maka control Home bisa kita panggil

dengan tampilan sebagai berikut

Tugas

1. Tambahkan tabel kategori pada databases dbportalci dengan struktur tabel sebagai berikut:

id_kategori Int (4) PK (Auto_Increment) nama_kategori Varchar (30)

2. Buat Contol, Model dan View untuk pengelolaah data pada tabel kategori

(39)

37 MODUL 6

MENGELOLA DATA BERITA ( Pertemuan 7, 8)

TUJUAN

1. Teknik memanggil model lebih dari satu 2. Mengenal function gambar

1. Mahasiswa mampu melakukan join dengan tabel satu dengan tabel lainnya 2. Mahasiswa mampu memanfaatkan function gambar

3. Mahasiswa mampu mengelola gambar KEGIATAN PRAKTIKUM

1. Tambahkan tabel berita pada databases dbportalci dengan struktur tabel sebagai berikut:

id_berita Int (11) PK (Auto_Increment)

kd_admin Varchar (15)

id_kategori Int (4)

st_berita Varcahr(6)

tgl_berita Date

jam_berita Time

judul_berita Varchar (100)

isi_berita Text

img_berita Varcahr(100)

2. Membuat Control Berita pada lokasi application\controllers dengan nama file Berita.php script sebagai berikut

<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');

class Berita extends CI_Controller { private $view = "backend/v_berita/";

private $redirect = "berita";

(40)

38 public function __construct(){

//Load model

$this->load->model('M_berita');

$this->load->model('M_kategori');

IsAdmin();

}

if ($this->input->get('search')) {

$q = $this->M_berita->search($this->input->get('search'));

} else{

$q = $this->M_berita->GetAll();

}

$data = array(

'judul' => "DATA BERITA", 'sub' => "Lihat Berita", 'read'=> $q

);

$this->template->load('backend/template',$this->view.'read', $data);

}

public function create(){

$data = array(

'judul' => "DATA BERITA", 'sub' => "Tambah Berita",

'kategori' => $this->M_kategori->GetAll(), 'create'=>''

);

$this->template->load('backend/template',$this->view.'create', $data);

}

public function save(){

//img_berita

$name_imgberita = $_FILES['img_berita']['name'];

$type_imgberita = $_FILES['img_berita']['type'];

$tmp_imgberita = $_FILES['img_berita']['tmp_name'];

//upload img

if (!empty($tmp_imgberita)){

if ($type_imgberita != "image/jpeg" AND $type_imgberita !=

"image/jpg" AND $type_imgberita != "image/png"){

echo "<script>alert('Format yang digunakan jpeg|jpg|png');</script>";

} else{

$img_berita =

(41)

39 UploadImg($_FILES['img_berita'],'./assets/img_berita/','berita',500);

$data = array(

'judul_berita'=> $this->input->post('judul_berita'), 'id_kategori'=> $this->input->post('id_kategori'), 'st_berita'=> 'Blokir',

'isi_berita'=> $this->input->post('isi_berita'), 'tgl_berita'=> date('Y-m-d'),

'jam_berita'=> date('H:i:s'),

'kd_admin' => $this->session->userdata('kd_admin'), 'img_berita'=> $img_berita

);

$this->M_berita->save($data);

} } }

public function edit(){

$data = array(

'judul' => "DATA BERITA", 'sub' => "Ubah Berita",

'kategori' => $this->M_kategori->GetAll(), 'edit' => $this->M_berita->edit($kd)

);

$this->template->load('backend/template',$this->view.'edit', $data);

}

public function update(){

//img_berita

$name_imgberita = $_FILES['img_berita']['name'];

$type_imgberita = $_FILES['img_berita']['type'];

$tmp_imgberita = $_FILES['img_berita']['tmp_name'];

//upload img

if (!empty($tmp_imgberita)){

if ($type_imgberita != "image/jpeg" AND $type_imgberita !=

"image/jpg" AND $type_imgberita != "image/png"){

echo "<script>alert('Format yang digunakan jpeg|jpg|png');</script>";

} else{

$img_berita =

UploadImg($_FILES['img_berita'],'./assets/img_berita/','berita',500);

$data = array(

'judul_berita'=> $this->input-

>post('judul_berita'),

'id_kategori'=> $this->input-

(42)

40

>post('id_kategori'),

'isi_berita'=> $this->input->post('isi_berita'), 'tgl_berita'=> $this->input->post('tgl_berita'), 'jam_berita'=> $this->input-

>post('jam_berita'),

'kd_admin' => $this->session-

>userdata('kd_admin'),

'img_berita' => $img_berita

);

} }

else{

$data = array(

'judul_berita'=> $this->input->post('judul_berita'), 'id_kategori'=> $this->input->post('id_kategori'), 'isi_berita'=> $this->input->post('isi_berita'), 'tgl_berita'=> $this->input->post('tgl_berita'), 'jam_berita'=> $this->input->post('jam_berita'), 'kd_admin' => $this->session-

>userdata('kd_admin'), );

}

$this->M_berita->update($kd,$data);

}

public function status(){

$data = array(

'st_berita' => $this->uri->segment(4) );

$this->M_berita->update($kd,$data);

}

public function delete(){

$data = array(

'id_berita' => $kd );

$this->M_berita->delete($data);

} }

(43)

41 3. Membuat Model M_berita pada control Berita pada lokasi application\models dengan

nama file M_berita.php script sebagai berikut

<?php

class M_berita extends CI_Model { private $table = 'berita';

private $pk = 'id_berita';

public function GetAll(){

$this->db->order_by ('tgl_berita', 'desc');

$this->db->order_by ('jam_berita', 'desc');

$this->db->join('admin','berita.kd_admin=admin.kd_admin');

$this->db->join('kategori','berita.id_kategori=kategori.id_kategori');

}

public function save($data){

return $this->db->insert($this->table, $data);

}

public function edit($kd){

return $this->db->get($this->table)->row_array();

}

public function update($kd,$data){

}

public function delete($data){

$this->db->where($data);

return $this->db->delete($this->table);

}

public function status($kd,$data){

}

public function search($data){

$this->db->like($this->pk, $data);

$this->db->or_like('judul_berita', $data);

$this->db->or_like('nama_kategori', $data);

(44)

42 }

}

4. Tambahkan function pada file islogin_helper.php pada lokasi application\helpers dengan script sebagai berikut

//-->format_img

function UploadImg($file,$dst,$style,$size){

$date= date('YmdHis').'_'.$style;

//Penjabaran File

$filename = $file['name'];

$filetype = $file['type'];

$filetmp = $file['tmp_name'];

$fileupload = $dst.$filename;

//upload ukuran sebenarnya

move_uploaded_file($filetmp, $fileupload);

//Identifikasi Gambar

if ($filetype == 'image/jpeg' || $filetype == 'image/jpg') {

$src = imagecreatefromjpeg($fileupload);

}elseif ($filetype == 'image/png') {

$src = imagecreatefrompng($fileupload);

}

$wsrc = imageSX($src);

$hsrc = imageSY($src);

//Set Ukuran Gambar

$wdst = $size;

$hdst = ($wdst / $wsrc) * $hsrc;

//Proses Perubahan Ukuran

$filecreate = imagecreatetruecolor($wdst, $hdst);

imagecopyresampled($filecreate, $src, 0, 0, 0, 0, $wdst,

$hdst, $wsrc, $hsrc);

//Nama Acak

$x = explode(".", $filename);

$name = $x[0];

$extension = $x[1];

$filename = $date.'.'.$extension;

//Reupload

if ($filetype == 'image/jpeg' || $filetype == 'image/jpg') { imagejpeg($filecreate,$dst.$filename);

}elseif ($filetype == 'image/png') { imagepng($filecreate,$dst.$filename);

}

//Hapus Foto Lama unlink($fileupload);

return $filename;

}

(45)

43 //-->Endformat_img

5. Membuat view read pada control Berita pada lokasi

application\views\backend\v_berita dengan nama file read.php script sebagai berikut

<a href="<?php echo site_url('berita/create'); ?>" title="Tambah Data"> <button type="button">Tambah</button> </a>

<tr>

<th>Kategori</th>

<th>Tanggal</th>

<th>Status</th>

<th>Judul</th>

<th>Author</th>

</tr>

<?php

$no=1;

foreach ($read->result_array() as $row) {

?>

<tr>

<td><?php echo $row['tgl_berita'];echo' ';echo

$row['jam_berita'] ?></td>

<td>

<?php

if($row['st_berita']=='Publik'){

?>

<a href="<?php echo

site_url('berita/status/'.$row['id_berita']).'/'.'Blokir'; ?>" title="Ubah status ke Blok">

<button class="">Blokir</button></a>

<?php

}elseif($row['st_berita']=='Blokir'){

?>

<a href="<?php echo

site_url('berita/status/'.$row['id_berita']).'/'.'Publik'; ?>" title="Ubah status ke Publik">

<button class="">Publik</button></a>

<?php }

?>

(46)

44

<a href="<?php echo site_url('berita/edit/'.$row['id_berita'])

?>" title="Ubah">

<a href="<?php echo

site_url('berita/delete/'.$row['id_berita']) ?>" title="Delete" onclick="javascript:

return confirm('Yakin Mau dihapus <?php echo $row['judul_berita'];?>')">

<button class="">Hapus</button></a>

</td>

</tr>

<?php

$no++;

}

?>

</table>

6. Membuat view create pada control Berita pada lokasi

application\views\backend\v_berita dengan nama file create.php script sebagai berikut

<form method="post" action="<?php echo site_url('berita/save') ?>"

enctype="multipart/form-data">

<label>Judul Berita</label><br>

<label>Kategori</label><br>

<option value=0 selected>- Pilih kategori -</option>

<?php

foreach ($kategori->result_array() as $r) { ?>

<option value="<?php echo $r['id_kategori'] ?>"><?php echo

$r['nama_kategori']; ?></option>

<?php } ?>

</select><p></p>

<label>Isi Berita</label><br>

<textarea name="isi_berita" class="" id="" placeholder="isi Berita"

rows="20" cols="80" required></textarea><p></p>

<label>Foto Berita</label><br>

(47)

45 <button class="" type="submit">Simpan </button>

<a href="<?php echo site_url('berita') ?>"><button class=""

type="button">Batal</button></a>

</form>

7. Membuat view edit pada control Berita pada lokasi application\views\backend\v_berita dengan nama file edit.php script sebagai berikut

<form method="post" action="<?php echo

site_url('berita/update/'.$edit['id_berita']) ?>" enctype="multipart/form-data">

<label>Judul Berita</label><br>

<input type="text" name="judul_berita" class="" placeholder="Masukan Judul Berita" value="<?php echo $edit['judul_berita'] ?>" required

oninvalid="this.setCustomValidity('Judul Berita Harus Di Isi')"

oninput="setCustomValidity('')"><p></p>

<label>Tanggal</label><br>

<input type="date" name="tgl_berita" class="" value="<?php echo

$edit['tgl_berita'] ?>" required oninvalid="this.setCustomValidity('Judul Berita Harus Di Isi')" oninput="setCustomValidity('')"><p></p>

<input type="time" name="jam_berita" class="" value="<?php echo

$edit['jam_berita'] ?>" required oninvalid="this.setCustomValidity('Judul Berita Harus Di Isi')" oninput="setCustomValidity('')"><p></p>

<label>kategori</label><br>

<option value="<?php echo $edit['id_kategori'] ?>"><?php echo

$edit['nama_kategori'] ?></option>

<?php

foreach ($kategori->result_array() as $r) { ?>

<option value="<?php echo $r['id_kategori'] ?>"><?php echo

$r['nama_kategori']; ?></option>

<?php } ?>

</select><p></p>

<label>Isi Berita</label><br>

<textarea name="isi_berita" class="" id="" placeholder="isi Berita" rows="20"

cols="80" required><?php echo $edit['isi_berita'] ?></textarea>

<p></p>

<img src="<?php echo base_url('assets/img_berita/'.$edit['img_berita']) ?>"

(48)

46 width="400" height="300"><br>

<label>Ganti Foto</label><br>

<button class="" type="submit">Perbaharui</button>

<a href="<?php echo site_url('admin') ?>"><button class=""

type="button">Batal</button></a>

</form>

(49)

47

DAFTAR PUSTAKA

Habibi, R., & Sandi, K. (2020). Aplikasi bank sampah istimewa menggunakan framework PHP Codeigniter dan DBMS MySQL. Kreatif.

Hadi, D. A. (n.d.). Codeigniter Part 1 : Pengertian dan Cara Menggunakan CodeIgniter.

https://www.malasngoding.com/pengertian-dan-cara-menggunakan-codeigniter/

Idcloudhost. (2017). Mengetahui Fungsi, Kelebihan dan Kekurangan Framework

CodeIgniter. Https://Idcloudhost.Com/. https://idcloudhost.com/panduan/mengetahui- fungsi-kelebihan-dan-kekurangan-codeigniter/

Widodo, I. W. (2013). Membangun Web Super Cepat dengan CodeIgniter GroceryCRUD dan TankAuth.