Yii2-Series

PDO, PHP, WEBPROGRAMMING, PROGRAMMING, Yii2
View Comments

Pada tulisan ini saya akan membuat series mengenai pemrograman dengan Yii Framework. Series ini akan disusun untuk membuat sebuah program sederhana yang memanfaatkan fitur-fitur umum yang sangat mungkin digunakan di banyak kasus. Tulisan ini akan menggunakan Basic Template Yii2 (yang menurut saya penggunaannya sedikit lebih sulit daripada advance template Yii2).

Secara garis besar (dan mungkin akan bertambah sesuai keperluan yang mungkin terjadi) outline dari seri tulisan ini akan terdiri dari hal berikut.

  1. Prainstalasi
  2. Instalasi YiiFramework 2.0
  3. Login
  4. Login dengan Database pada Yii2
  5. Bekerja dengan Gii
  6. Module pada Yii2
  7. Layout dasar dan Manipulasinya pada Yii2
  8. Costum Asset dan Asset Bundle pada Yii2
  9. Alias pada Yii2
  10. Bekerja dengan Form
  11. Timestamp, Blameable, dan Sluggable Behavior pada Yii2
  12. Menggunakan Rich Text Input CkEditor dan Alternatifnya pada Yii2
  13. Gridview dan Listview
  14. SEO Friendly Url dengan slug
  15. Scenario pada Model Yii2
  16. Retrieve data pada Yii2
  17. Relasi Database pada Yii2
  18. Menggunakan Bootstrap4
  19. Widget Kartik dan Kartik Gridview
  20. Select2 dengan Kartik Ekstension
  21. Dependent Dropdown pada Yii2
  22. Bekerja dengan Modals
  23. Membuat Costum Template untuk Gii
  24. Mengupload File
  25. Mengupload File dengan Kartik Widget
  26. Gridview atau Datatables?
  27. Session dan Cookie pada Yii2
  28. Menggunakan AdminLTE pada Yii2
  29. Membuat Themes pada Yii2
  30. Menggunakan GoogleMaps API pada Yii2
  31. Menggunakan Socket.io pada Yii2
  32. Handling Error
  33. Bekerja dengan AuthClient
  34. Menggunakan Amazon S3 pada Yii2
  35. Mengirim Email dengan Swiftmailer pada Yii2
  36. Middleware pada Yii2
  37. Mengenal RBAC pada Yii2
  38. Implementasi RBAC pada Yii2
  39. Notifikasi Real Time dengan Socket.io pada Yii2

Anda dapat mengunduh dan memantau progress dari series ini lewat repositori Github belajararief-yii2series. Silahkan bintangi (star) untuk dapat lebih mudah memantau perkembangan repositori.

Requirement

Untuk memudahkan anda dalam memahami petunjuk ini, maka beberapa hal yang perlu diperhatikan diantaranya:

  1. Sistem Operasi yang saya gunakan adalah Windows 10 64bit dengan terminal menggunakan powershell terminal (beberapa command seperti cd dapat berbeda dengan command prompt biasa), namun saya akan berusaha sebisa mungkin mencontohkan perintah pada sistem operasi lain jika memunkinkan.
  2. Stack yang digunakan adalah Wamp Server (Apache 2.2, MySQL, PHP 7).
  3. Yii yang digunakan adalah Yii 2.0 dengan catatan jquery yang digunakan bukan jquery3. Beberapa perintah jquery akan berbeda pada jquery3, dan beberapa extensions yang saya gunakan sepertinya belum mendukung jquery3

Mengenal Gii

Gii adalah Koentji. Menurut saya, Gii mungkin adalah pembeda Yii dengan Framework lain. Gii adalah sebuah tool code generator berbasis Web dari Yii Framework. Gii merupakan salah satu fitur Yii framework untuk membuat model, class dan controller dari tabel-tabel yang ada pada database. Gii diimplementasikan sebagai module dalam membuat sebuah aplikasi Yii yang akan menghasilkan (salah satunya) CRUD (Create Read Update Delete) Operation dalam aplikasi. Bagi anda pengguna CakePHP ini mungkin terdengar familiar. CakePHP sendiri punya fitur Bake melalui CLI yang menghasilkan CRUD Operation berdasarkan tabel. Pembedanya adalah, Gii berbasis Web (bukan CLI) dan sangat mudah di ekstend.

Jika anda sudah terbiasa menggunakan Gii dan sudah mahir membuat template dan ekstend untuk Gii, maka pengembangan aplikasi akan menjadi lebih menyenangkan dan tentunya lebih agile. Pengembangan aplikasi akan lebih cepat dan kita sebagai programmer akan lebih berfokus pada menyusun algoritma dan logika aplikasi dibandingkan coding semuanya dari awal dan dari hal-hal kecil.

Enable Pretty Url

Sebelum kita memulai maka ada baiknya kita membuat Url pada aplikasi Yii2 kita menjadi lebih menarik. Dalam Yii2 sudah tersedia fitur route yang memungkinkan kita menggunakan url yang lebih enak di mata. Dibandingkan menggunakan ../index.php?site&... maka kita akan mengubah url menjadi seperti ini ../site/action.

Untuk mengenable pretty url, pastikan modul rewrite pada apache anda sudah di enable. Kemudian buka \app\config\web.php dan uncomment bagian pretty url sehingga menjadi seperti di bawah ini.

'components' => [
    // ...
    'urlManager' => [
        'class' => 'yii\web\UrlManager',
        // Hide index.php
        'showScriptName' => false,
        // Use pretty URLs
        'enablePrettyUrl' => true,
        'rules' => [
        ],
    ],
    // ...
],

Selanjutnya tambahkan file .htaccess pada \app\web\.htaccess dan ubah file .htacces tersebut menjadi seperti di bawah ini.

RewriteEngine on
# If a directory or a file exists, use it directly
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
# Otherwise forward it to index.php
RewriteRule . index.php

Selanjutnya url pada website anda akan berubah ditandai dengan perubahan url pada link-link di aplikasi.

Membuat Tabel Blog

Sebelum kita ke Gii, kita buat terlebih dahulu tabel yang akan kita buat CRUD operationnya. Dalam contoh ini kita akan membuat tabel Blog yang nantinya akan berisi tulisan blog. Pertama kita buat terlebih dahulu migration atas tabel tersebut.

./yii migrate/create create_blog

Kemudian isi file migration tersebut seperti di bawah ini.

....

   public function up()
    {
        $tableOptions = null;
        if ($this->db->driverName === 'mysql') {
            $tableOptions = 'CHARACTER SET utf8 COLLATE utf8_unicode_ci ENGINE=InnoDB';
        }

        $this->createTable('{{%blog}}', [
            'id' => $this->primaryKey(),
            'slug' => $this->string(2048)->notNull(),
            'title' => $this->string(512)->notNull(),
            'body' => $this->text()->notNull(),
            'created_at' => $this->integer(),
            'updated_at' => $this->integer(),
	    'created_by' => $this->integer(),
            'updated_by' => $this->integer(),
        ], $tableOptions);
    }

    public function down()
    {
        $this->dropTable('{{%blog}}');
    }

....

Setelah itu kita eksekusi file migration tadi dengan perintah berikut.

./yii migrate

Maka di database anda akan bertambah tabel dengan nama blog.

CRUD Operation dengan Gii

Setelah kita menkonfigurasi pretty url dan membuat tabel blog. Maka sekarang kita sudah bisa membuat CRUD Operation dengan Gii. Buka Gii pada blog anda melalui alamat http://localhost/basic/web/gii pada address bar anda. Halaman akan menampilkan Halaman Gii yang terdiri dari beberapa fitur. Fitur tersebut antara lain:

  1. Model Generator digunakan untuk mengenerate Model sebagai ActiveRecord Class. Gii juga dapat mendeteksi semua relasi dari tabel tersebut berdasarkan foreign key yang tersimpan pada database.
  2. CRUD Generator digunakan untuk membuat Crud Operation pada tabel. CRUD Generator secara default akan membuat Controller dan Views atas Model / Tabel yang menjadi target Crud Operation.
  3. Controller Generator digunakan untuk membuat Controller Plain yang berisi actionIndex dan Views untuk action index tersebut.
  4. Form Generator digunakan untuk membuat sebuah form dalam kondisi tertentu yang dapat tidak terikat pada tabel.
  5. Module Generator digunakan untuk membuat skeleton folder dan file yang dapat digunakan sebagai Module pada aplikasi Yii. Penjelasan mengenai modul pada Yii2 akan dijelaskan pada tulisan berikutnya (jika anda familiar dengan module pada CI dan CakePHP, module pada Yii2 memiliki fungsi yang sedikit banyak sama)
  6. Ekstension Generator digunakan untuk membuat skeleton folder dan file untuk membuat ekstensi pada Yii2. Dengan Ekstension ini maka ekstension yang anda buat akan lebih mudah dipahami dan tentunya membantu pengguna lain

Dalam tulisan ini kita akan menggunakan CRUD Generator. Langkah pertama adalah kita membuat Model terlebih dahulu dengan Model Generator. Klik Start pada Model Generator dan isi informasi nama tabel (blog) dan Class Name akan otomatis diisi, saya lebih menyarankan anda tidak mengubah Class Name karena sebuah aplikasi yang dikerjakan beberapa orang akan lebih mudah jika bersifat Convention over Configuration sehingga maintenance aplikasi akan lebih mudah.  Tekan tombol Preview kemudian tekan tombol generate maka Gii akan mengenerate model pada \app\models\Blog.php. Anda dapat pelajari struktur model Yii2 dari model yang digenerate ini, dan hasil generate Gii dapat dikatakan sebagai praktik yang baik dalam membuat model.

Selanjutnya apabila model sudah terbentuk anda dapat mengenarate Crud melalui menu CRUD Generator, isi informasi berikut.

  1. Model: app\models\Blog
  2. Search Model: app\models\BlogSearch
  3. Controller: app\controllers\BlogController
  4. View: @app/views/blog
  5. Pjax: Enable

Klik Preview kemudian generate Crud Generator. Maka Gii akan membuat Controller dan views baru berdasarkan konfigurasi yang anda buat. Setelah itu anda sudah bisa mengakses hasil dari CRUD Operation atas tabel blog melalui http://localhost/basic/web/blog pada address bar anda. Lebih detail mengenai Gii dapat anda lihat pada video preview di bawah.

Demikian tulisan yang dapat saya bagikan tentang Gii. Semoga bermanfaat dan Happy Coding!