LAPORAN PRAKTIKUM TEKNOLOGI FRAMEWORK PERTEMUAN KE 1

Transkripsi

1 LAPORAN PRAKTIKUM TEKNOLOGI FRAMEWORK PERTEMUAN KE 1 INSTALLASI FRAMEWORK YII DAN MENGGUNAKAN GENERATOR Disusun oleh BUJANG PUTRO WICAKSONO JURUSAN SISTEM INFORMASI SEKOLAH TINGGI MANAJEMEN INFORMATIKA & KOMPUTER AKAKOM YOGYAKARTA 2016

2 LAPORAN PRAKTIKUM TEKNOLOGI FRAMEWORK PERTEMUAN KE 1 INSTALLASI FRAMEWORK YII DAN MENGGUNAKAN GENERATOR A. MAKSUD DAN TUJUAN Dalam pelaksanaan praktikum Teknologi Framework pada pertemuan pertama yang membahas tentang Installasi Framework YII dan Menggunakan Generator memiliki maksud dan tujuan agar mahasiswa mampu melakukan instalasi Framework Yii, serta mampu melakukan setting generator. Selain hal itu mahasiswa juga bisa mengetahui cara kerja View, Controller, Model dan penggunaan Objek dalam Model. B. DASAR TEORI OOP atau Object Oriented Programming adalah teknik pemrograman berbasis object. Pemrograman dibagi dalam object-object kemudian di dalam object-object ini ada property dan method. Property ini lebih dikenal dengan variable yang bersifat public dan method ini merupakan function. Object-object ini bisa diperluas lagi dengan inheritance atau turunan. Object-object turunan ini biasa dipakai untuk membuat object yang merupakan modifikasi dari object lain. Dengan pengelompokan-pengelompokan ini maka programming akan terstruktur dengan baik dan mudah dimanage. Bahasa programming yang sudah mengimplementasikan OOP adalah C++ dan Java. Pemograman PHP akhir-akhir ini juga dikembangkan menjadi bahasa pemrograman berbasis OOP (Object Orieented Programming) dengan lahirnya framework-framework berbasis PHP. Yii adalah framework yang full OOP dimana dengan OOP ini, kita lebih baik dalam memanage code, dapat menglompokkan fungsi2 kedalam kelas-kelas, dapat modify program dengan lebih baik, program dapat lebih rapi dan lebih mudah dibaca

3 C. PEMBAHASAN Melakukan Pemeriksaan Framework Yii Gambar diatas adalah proses saat melakukan pemeriksaan Framework Yii, apakah pada PDO MySQL extension sudah bernilai Passed atau belum dengan cara mengetikkan pada URL. Menjalankan Generator Yiic melalui CMD Gambar diatas adalah tahap awal ketika akan melakukan Generator Yiic melalui CMD, dengan langkah awal yaitu masuk ke direktori framework dengan cara cd yiiframework lalu dilanjutkan dengan cd framework selanjutnya baru menjalankan yiic.

4 Menjalankan Generator Yiic melalui CMD (( Proses Generate )) Gambar diatas adalah proses Generator Yiic melalui CMD, dalam langkah tersebut melakukan pembuatan webapp dengan nama pert1 dengan perintah yiic webapp../pert1 dimana pembuatan webapp tersebut akan diletakkan di C:\xampp\htdocs\yiiframework\pert1. Ketika kita menjawab yes maka proses Generate akan mulai. Mengatur penggunaan Gii Generator Gambar diatas adalah proses penggunaan Gii Generator, dalam scrip diatas kita menghilangkan tanda komentar yaitu /*...*/ yang terdapat pada baris 23 dan 30. Selanjutnya kita melakukan pengubahan password pada baris 26.

5 Mencoba Gii Generator Gambar diatas adalah proses mencoba Gii Generator, dengan memanggil Maka setelah menjalankan URL tersebut akan diminta memasukkan Password yang telah diubah tadi, disini saya memasukkan password saya bujangpw lalu klik Enter. Menggunakan Controller Generator Gambar diatas adalah proses menggunakan Controller Generator, dimana kita melakukan pengisian Cotroller ID dengan hallo dan default dari Action Ids adalah index. Lalu klik tombol Generate maka sistem akan melakukan pembuatan direktori baru beserta file didalamnya yaitu./protected/controller/hallocontroller.php dan juga./protected/views/index.php

6 Melakukan pengecekan tampilan Gambar diatas adalah proses mengecekan tampilan dengan menjalankan hasil yang maka tampilan nya hanya akan berisi hallo/index. Melakukan pengujian, pengubahan pada HalloController.php & Index.php Didalam script disamping terdapat class HalloController memiliki extends ke file Controller. Selanjutnya melakukan pembuatan public function yang bernama actionindex() yang didalamnya menjalankan perintah render yang akan memanggil index. Script disamping adalah pembuatan view pepatah.php, yang berfungsi untuk menampilkan kalimat berupa Selamat datang di Kampus STMIK AKAKOM YK. Lalu untuk menampilkan id controller dengan perintah.$this- >id; dan menampilkan Nama Action dengan perintah.$this->action- >id;

7 Ketiga gambar diatas adalah proses pengujian, melihat, serta melakukan pengubahan pada HalloController.php & Index.php. Maka setelah itu bisa melakukan pengecekan tampilan dengan mengunjungi URL pada tampilannya adalah sebagai berikut : Menambahkan action dan view pada HalloController.php Gambar diatas adalah proses penambahan Action pada HalloController yang ditunjukkan oleh penambahan script pada baris 10 sampai dengan 14. public function actionpepatah() { $this->render('pepatah'); } Didalam script diatas terdapat public function yang bernama actionpepatah() yang didalamnya menjalankan perintah render yang akan memanggil pepatah.

8 Gambar diatas adalah proses pembuatan View pepatah.php, yang akan diletakkan di./protected/views/hallo/pepatah.php. Didalam View tersebut akan menampilkan kalimat dengan perintah echo... ; yaitu kalimay yang ditampilakn adalah Rajin Pangkal Pandai Sedikit Demi Sedikit Lama-lama Menjadi Bukit. Melakukan pengecekan tampilan Gambar diatas adalah tampilan saat mengunjungi Membuat Model Kata.php Gambar diatas adalah proses pembuatan Model dengan nama Kata.php, lalu file tersebut disimpan di./protected/models/kata.php.

9 Pada Script diatas terdapat class Kata yang memuat variabel public yaitu kata dan katakan, pada variabel katakan memiliki value Kata Bijak. Selanjutnya terdapat public function setkata yang didalmnya memuat parameter variabel kt yang menjalankan fungsi $this->kata = $kt setelah itu terdapat public function getkata yang menjalankan fungsi return $this->kata Membuat View katapepatah.php Gambar diatas adalah proses pembuatan file View katapepatah.php. Lalu file tersebut disimpan di :./protected/views/hallo/katapepatah.php Pada Script diatas terdapat variabel model yang memiliki perintah setkata yang memiliki value berupa kalimat Muda menabung tua beruntung. Setelah itu terdapat perintah echo... ; yang melakukan pemanggilan variabel model yang menjalankan perintah ->katakan dan perintah ->getkata(). Melakukan pengubahan dan penambahan pada HalloController.php

10 Gambar diatas adalah proses pengubahan serta penambahan script pada HalloController.php yang ditunjukkan pada baris 15 sampai dengan 19. Pada Script diatas terdapat public function actionkatapepatah() yang didalmnya memuat variabel model yang berfungsi membuat class baru yaitu Kata dan menjalankan variabel this yang melakukan render yang memuat katapepatah, lalu menjalnkan array, array tersebut memuat model yang menjalankan variabel model. Melakukan pengecekan tampilan Gambar diatas adalah tampilan saat mengunjungi

11 D. LATIHAN / TUGAS Membuat Model Membuat View

12 Membuat Controller Pengujian Tampilan E. KESIMPULAN Dalam pelaksanaan praktikum Teknologi Framework pada pertemuan pertama yang membahas tentang Installasi Framework YII dan Menggunakan Generator maka dapat diambil simpulan bahwa mahasiswa dapat melakukan instalasi Framework Yii, mampu setting generator, dan mengetahui cara kerja View, Controller, serta Model.

13 LAPORAN PRAKTIKUM TEKNOLOGI FRAMEWORK PERTEMUAN KE 2 MODEL MENGGUNAKAN C-FORM MODEL Disusun oleh BUJANG PUTRO WICAKSONO JURUSAN SISTEM INFORMASI SEKOLAH TINGGI MANAJEMEN INFORMATIKA & KOMPUTER AKAKOM YOGYAKARTA 2016

14 LAPORAN PRAKTIKUM TEKNOLOGI FRAMEWORK PERTEMUAN KE 2 MODEL MENGGUNAKAN C-FORM MODEL A. MAKSUD DAN TUJUAN Dalam pelaksanaan praktikum Teknologi Framework pada pertemuan kedua yang membahas tentang Model Menggunakan C-Form Model memiliki maksud dan tujuan agar mahasiswa mampu melakukan pembuatan web menggunakan Model- View-Controller pada framework Yii. B. DASAR TEORI MVC atau disebut Model-View-Controller adalah salah satu tipe arsitektur aplikasi. Yii menggunakan MVC struktur aplikasi yang menggunakan arsitektur MVC, akan dibagi menjadi tiga bagian. Bagian Model, yang mendefinisikan hubungan antar data dalam DB dan aturan yang harus diikuti saat menyimpan data ke DB. Hal ini juga memberi kita alat untuk membaca / menyimpan data dari / ke DB. Model adalah hal yang sangat sederhana dalam Yii, tidak harus menulis satu barispun kode, model dapat dibuat secara otomatis menggunakan command line. Setiap tabel di DB memiliki model tersendiri. Bagian View, yang digunakan hanya untuk menampilkan data kepada pengguna. Ia tidak menulis ke DB atau menghitung hal-hal sulit. View hanya menerima data dan menampilkannya menggunakan HTML, CSS, JS, dll. View tidak memiliki kecerdasan, hanya menerima data dari Controller dan menampilkannya. Ini adalah satu-satunya tempat di mana kita menggunakan HTML, CSS, JavaScript dll. Bagian Controller, yang memproses dan merubah data, menangani tindakan pengguna, memutuskan, menjumlah, berpikir dan memanggil model dan menampilkan. Controller dimulai (dan kodenya dijalankan) setiap kali anda memasukkan alamat di browser. Dalam kode, anda dapat membaca data dari POST, GET atau variabel SESSION, bekerja dengan DB, dll.

15 C. PEMBAHASAN Menjalankan Generator Yiic melalui CMD (( Proses Generator )) Gambar diatas adalah proses Generator Yiic melalui CMD, dalam langkah tersebut melakukan pembuatan webapp dengan nama pert2 dengan perintah yiic webapp../pert2 dimana pembuatan webapp tersebut akan diletakkan di C:\xampp\htdocs\yiiframework\framework\pertemuan2. Ketika kita menjawab yes maka proses Generate akan mulai. Melakukan Pengaturan Konfigurasi pada main.php

16 Gambar diatas adalah proses pengaturan konfigurasi pada file main.php yang terletak di./protected /config/main.php. dalam scrip diatas kita menghilangkan tanda komentar yaitu /*...*/. Selanjutnya kita melakukan pengubahan password pada baris 20. Melakukan pembuatan file Kotak.php Script diatas adalah pembuatan model Kotak.php, yang didalmnya mendefinisikan class yang memiliki extends ke CformModel, dimana didalam class tersebut juga mendefinisikan adanya variabel panjang dan lebar. Setelah itu terdapat perintah : public function rules() { return array( array('panjang,lebar', 'required'), array('panjang,lebar', 'numerical', 'integeronly'=>true)); } Script pada kotak diatas berfungsi untuk melakukan pembuatan function bernama rules yang memiliki nilai balikan (return) berupa array panjang dan lebar yang bersifat required dan numeric, dan hanya diperbolehkan nilai masukan yang bertipe Hanya Integer

17 public function attributelabels() { return array('panjang'=>'panjang Kotak', 'lebar'=>'lebar Kotak'); } Script pada kotak diatas berfungsi untuk melakukan pembuatan function bernama attributelabels yang memiliki nilai balikan (return) berupa array panjang yang memiliki nilai yang sama dengan Panjang Kotak, dan lebar yang memiliki nilai yang sama dengan Lebar Kotak. public function luas() { return $this->panjang*$this->lebar; } public function keliling(){ return 2*($this->panjang+$this->lebar); }} Script pada kotak diatas berfungsi untuk melakukan pembuatan function bernama luas yang memiliki nilai balikan (return) dimana hasil luas didapat dari variabel panjang dikalikan dengan lebar. Setelah itu terdapat juga function bernama kelililang yang memiliki nilai balikan (return) dimana hasil keliling didapat dari 2X variabel panjang ditambah dengan lebar. Melakukan pembuatan Model melalui Controller Generator

18 Gambar diatas adalah proses menggunakan Controller Generator, dimana kita melakukan pengisian Cotroller ID dengan Kotak dan default dari Action Ids adalah index. Lalu klik tombol Preview, klik lagi Generate maka sistem akan melakukan pembuatan direktori baru beserta file didalamnya yaitu controller/kotakcontroller.php dan juga views/index.php Mengubah / Mengedit pada script KotakController.php Gambar diatas adalah proses pengubahan pada script KotakController yang terdapat di protected\controllers\kotakcontroller.php. Pada file KotakController akan digunakan untuk memproses dan merubah data, menangani tindakan pengguna, memutuskan, menjumlah, berpikir dan memanggil model dan menampilkan. Controller dimulai (dan kodenya dijalankan) setiap kali anda memasukkan alamat di browser. Dalam kode tersebut dapat membaca data dari POST, GET atau variabel SESSION, atau bisa juga bekerja dengan DB.

19 Melakukan pembuatan View, menciptakan Form Kotak dengan Generator Gambar diatas adalah proses untuk menciptakan Form dengan menggunakan menggunakan Form Generator, dimana kita melakukan pengisian Model Class dengan Kotak dan View Name adalah _form, serta mengisikan Scenario dengan isiam kotak Lalu klik tombol Preview, maka akan terlihat hasilnya seperti gambar disebelah kanannya yang menunjukkan bahwa The Form has been generated Successfully Melakukan pembuatan file input.php yang terdapat pada View

20 Script diatas adalah pembuatan view input.php, yang didalmnya terdapat perintah sebagai berikut : <?php?> <?php?> $this->breadcrumbs = array ( 'Kotak'=>array('index'), 'Input Data', ); <h1> Input Kotak </h1> $this->renderpartial('_form', array('model'=>$model)); Breadcrumbs adalah sebuah navigasi pada web yang biasanya memberikan informasi kepada pengunjung web dimana posisinya sekarang berada yang memiliki nilai yang sama dengan array yang memuat Kotak yang memuat array index dan juga Input Data. Selanjutnya melakukan renderpartial yang digunakan untuk merender _form yang menjalankan array dan array tersebut memuat model yang diambilkan dari variabel model. Fungsi dari renderpartial() akan menampilkan view tanpa layout / template sama sekali, dan itulah yang selalu digunakan jika ingin menampilkan Ajax. Melakukan pengubahan / mengedit dapa file _form.php Gambar diatas adalah proses pengubahan pada script _form.php, yang dilakukan adalah mengaktifkan validasi input menggunakan Ajax. Langkah awal yang dilakukan adalah melakukan pengubahan pada script baris10, yaitu : id => kotak -_form-form, diganti menjadi id => kotak-form,

21 Selanjutnya melakukan validasi widget yang dilakukan seperti berikut ini : 'enableajaxvalidation'=>true, 'enableclientvalidation'=>true, 'clientoptions'=>array( 'validateontype'=>true, 'validateonchange'=>true,), Pada potongan script diatas baris pertama digunakan untuk mengaktifkan Validasi Ajax yang disetting bernilai True, lalu baris dua digunakan untuk mengaktifkan Validasi Client yang disetting bernilai True, selanjutnya baris tiga digunakan untuk mendefinisakn bahwa clientoption memuat array, dan didalam array tersebut melakukan setting validate pada Type yang di buat On, selanjutnya juga melakukan setting validate pada Change yang di buat On. Melakukan pembuatan file luas.php yang terdapat pada View Gambar diatas adalah proses pembuatan script luas.php, didalam script tersebut terdapat perintah sebagai berikut ini : <?php $model->panjang = $_GET["panjang"]; $model->lebar = $_GET["lebar"]; echo"panjang ".$model->panjang; echo " <br>"; echo"lebar ".$model->lebar; echo " <br>"; Pada potongan script diatas melakukan pendefinisian variabel yang terdapat pada model dengan nama panjang yang didapatkan dari method GET[ panjang ] selain itu juga terdapat variabel pada model dengan nama lebar yang didapatkan dari method GET[ lebar ]. Selanjutnya menampilkan Panjang yang didapat dari model untuk mendapatkan value panjang, setelah itu menampilkan Lebar yang didapat dari model untuk mendapatkan valu lebar.

22 echo"luas ".$model->luas(); echo " <br>"; echo"keliling ".$model->keliling();?> Pada potongan script diatas digunakan untuk menampilkan hasil keluaran berupa hasil Luas yang didapatkan dari pemanggilan method luas() yang didapatkan dari model, berikutnya menampilkan Keliling yang didapatkan dari pemanggilan method keliling() yang didapatkan dari model. Tampilan file index.php Gambar diatas adalah proses pembuatan script index.php, didalam script tersebut terdapat perintah sebagai berikut ini : <?php $this->breadcrumbs=array( 'Kotak', );?> <h1> <?php echo $this->id. '/'. $this->action->id;?> </h1> <p> You may change the content of this page by modifying the file <tt> <?php echo FILE ;?></tt>. </p> Breadcrumbs adalah sebuah navigasi pada web yang biasanya memberikan informasi kepada pengunjung web dimana posisinya sekarang berada yang memiliki nilai yang sama dengan array yang memuat Kotak. Selanjutnya pada potongan script diatas menampilkan id serta action id.

23 Tampilan ketika dijalankan Gambar diatas adalah hasil tampilan ketika kita selesai mengisi inputan pada Input Kotak, dimana inputan yang dilakukan adalah sebagai berikut : Pada panjang diberi inputan 5 Pada lebar diberi inputan 10 Sehingga hasil yang didapat untuk Luas yaitu 5 dikalikan 10 = 50, sedangkan untuk hasil kelilingnya yaitu 2x(5+10) maka hasilnya adalah 30

24 D. LATIHAN / TUGAS Latihan 1 BALOK Membuat Model Membuat View

25 Membuat Controller Melakukan Uji Tampilan

26 Latihan 2 LINGKARAN + TABUNG Membuat Model Membuat View

27 Membuat Controller Melakukan Uji Tampilan

28 E. KESIMPULAN Dalam pelaksanaan praktikum Teknologi Framework pada pertemuan kedua yang membahas tentang Model Menggunakan C-Form Model maka dapat diambil kesimpulan bahwa mahasiswa juga mengerti apa kegunaan Model-View-Controller, serta mahasiswa dapat melakukan pembuatan web menggunakan Model-View- Controller pada framework Yii.