mirror of
https://github.com/yiisoft/yii.git
synced 2026-03-06 16:16:53 +01:00
233 lines
9.4 KiB
Plaintext
233 lines
9.4 KiB
Plaintext
Membuat Aplikasi Pertama Yii
|
|
============================
|
|
|
|
Agar mendapatkan pengalaman pertama dengan Yii, kita akan melihat dalam bab ini bagaimana
|
|
untuk membuat aplikasi pertama Yii. Kita akan menggunakan piranti bertenaga `yiic`
|
|
yang dapat dipakai dalam mengotomatisasi pembuatan tugas-tugas tertentu. Demi kenyamanan,
|
|
kita beranggapan bahwa `YiiRoot` adalah direktori di mana Yii diinstalasi, dan `WebRoot`
|
|
adalah root dokumen pada server Web kita.
|
|
|
|
Jalankan `yiic` pada baris perintah seperti berikut:
|
|
|
|
~~~
|
|
% YiiRoot/framework/yiic webapp WebRoot/testdrive
|
|
~~~
|
|
|
|
> Note|Catatan: Saat menjalankan `yiic` pada Mac OS, Linux atau Unix, Anda harus mengubah
|
|
> perijinan file `yiic` agar bisa dijalankan.
|
|
> Alternatif lain, Anda bisa menjalankan piranti seperti berikut,
|
|
>
|
|
> ~~~
|
|
> % cd WebRoot/testdrive
|
|
> % php YiiRoot/framework/yiic.php webapp WebRoot/testdrive
|
|
> ~~~
|
|
|
|
Ini akan membuat kerangka aplikasi Yii di bawah direktori
|
|
`WebRoot/testdrive`. Aplikasi memiliki struktur direktori yang
|
|
diperlukan oleh umumnya aplikasi Yii.
|
|
|
|
Tanpa harus menulis satu baris kode pun, kita dapat menguji aplikasi pertama
|
|
Yii kita dengan mengakses URL berikut dalam Web browser:
|
|
|
|
~~~
|
|
http://hostname/testdrive/index.php
|
|
~~~
|
|
|
|
Seperti yang kita lihat, aplikasi memiliki empat halaman: halaman beranda, halaman tentang (about)
|
|
halaman kontak dan halaman masuk(login). Halaman kontak menampilkan sebuah form kontak
|
|
yang dapat diisi pengguna dan mengirim pertanyaan mereka ke webmaster, sedangkan
|
|
halaman masuk memungkinkan pengunjung diotentikasi sebelum mengakses isi khusus bagi yang sudah login.
|
|
|
|

|
|
|
|

|
|
|
|

|
|
|
|

|
|
|
|

|
|
|
|
|
|
Diagram berikut memperlihatkan struktur direktori pada aplikasi kita
|
|
Silahkan lihat [Konvensi](/doc/guide/basics.convention#directory) utuk keterangan
|
|
lebih rinci mengenai struktur ini.
|
|
|
|
~~~
|
|
testdrive/
|
|
index.php File skrip entri aplikasi Web
|
|
assets/ berisi file resource yang diterbitkan
|
|
css/ berisi file CSS
|
|
images/ berisi file gambar
|
|
themes/ berisi tema aplikasi
|
|
protected/ berisi file perlindungan aplikasi
|
|
yiic skrip baris perintah yiic
|
|
yiic.bat skrip baris perintah untuk Windows
|
|
commands/ berisi perintah 'yiic' yang dikustomisasi
|
|
shell/ berisi perintah 'yiic shell' yang dikustomisasi
|
|
components/ berisi komponen pengguna
|
|
MainMenu.php kelas widget 'MainMenu'
|
|
Identity.php kelas 'Identity' yang dipakai untuk otentikasi
|
|
views/ berisi file view untuk widget
|
|
mainMenu.php file view file untuk widget 'MainMenu'
|
|
config/ berisi file konfigurasi
|
|
console.php konfigurasi aplikasi konsol
|
|
main.php konfigurasi aplikasi Web
|
|
controllers/ berisi file kelas kontroler
|
|
SiteController.php standar kelas kontroler
|
|
extensions/ berisi extension pihak-ketiga
|
|
messages/ berisi terjemahan pesan
|
|
models/ berisi file kelas model
|
|
LoginForm.php model formulir untuk aksi 'login'
|
|
ContactForm.php model formulir untuk aksi 'contact'
|
|
runtime/ berisi file yang dibuat secara temporal
|
|
views/ berisi file kontroler tampilan dan tata letak
|
|
layouts/ berisi file tampilan tata letak
|
|
main.php standar tata letak untuk semua tampilan
|
|
site/ berisi file tampilan untuk kontroler 'site'
|
|
contact.php tampilan untuk aksi 'contact'
|
|
index.php tampilan untuk aksi 'index'
|
|
login.php tampilan untuk aksi 'login'
|
|
system/ berisi file tampilan sistem
|
|
~~~
|
|
|
|
Sambungan ke Database
|
|
---------------------
|
|
|
|
Umumnya aplikasi Web didukung oleh database. Aplikasi testdrive (pengujian) kita tidak
|
|
terkecuali. Untuk menggunakan database, pertama kita perlu memberitahu
|
|
aplikasi bagaimana untuk berhubungan dengannya. Ini dilakukan dengan mengubah file
|
|
konfigurasi aplikasi `WebRoot/testdrive/protected/config/main.php`, seperti
|
|
terlihat di bawah ini:
|
|
|
|
~~~
|
|
[php]
|
|
return array(
|
|
......
|
|
'components'=>array(
|
|
......
|
|
'db'=>array(
|
|
'connectionString'=>'sqlite:protected/data/source.db',
|
|
),
|
|
),
|
|
......
|
|
);
|
|
~~~
|
|
|
|
Dalam contoh di atas, kita menambah entri `db` ke `components`, yang memerintahkan
|
|
aplikasi untuk menyambung ke database SQLite
|
|
`WebRoot/testdrive/protected/data/source.db` saat diperlukan. Harap diingat bahwa
|
|
database SQLite sudah disertakan dalam aplikasi kerangka yang di-generate kita tadi.
|
|
Database tersebut berisi sebuah tabel bernama `tbl_user`:
|
|
|
|
~~~
|
|
[sql]
|
|
CREATE TABLE tbl_user (
|
|
id INTEGER NOT NULL PRIMARY KEY AUTOINCREMENT,
|
|
username VARCHAR(128) NOT NULL,
|
|
password VARCHAR(128) NOT NULL,
|
|
email VARCHAR(128) NOT NULL
|
|
);
|
|
~~~
|
|
|
|
Jika ingin mencoba database MySQL, anda harus menyertakan file skema MySQL
|
|
`WebRoot/testdrive/protected/data/schema.mysql.sql` untuk membuat database.
|
|
|
|
> Note|Catatan: Untuk menggunakan fitur database, kita harus mengaktifkan extension
|
|
PDO dan extension PDO driver-spesifik. Untuk aplikasi testdrive, kita perlu
|
|
mengaktifkan extension `php_pdo` dan `php_pdo_sqlite`
|
|
|
|
|
|
Mengimplementasikan Operasi CRUD
|
|
--------------------------------
|
|
|
|
Sekarang merupakan bagian yang menarik. Kita akan mengimplementasi operasi CRUD (create, read, update, delete) atau
|
|
membuat, membaca, meng-update dan menghapus pada tabel `tbl_user` yang baru saja dibuat. Operasi ini juga
|
|
merupakan aplikasi praktis yang umumnya diperlukan. Alih-alih menulis kode, kita akan menggunakan `Gii` -- sebuah generator kode yang powerful
|
|
|
|
> Info: Gii sudah tersedia semenjak versi 1.1.2. Sebelumnya, kita menggunakan `yiic` (yang baru saja disinggung) untuk melakukan hal yang sama. Untuk lebih detail silahkan merujuk ke [Mengimplementasi Operasi CRUD dengan yiic shell](/doc/guide/quickstart.first-app-yiic).
|
|
|
|
|
|
### Konfigurasi Gii
|
|
|
|
Untuk menggunakan Gii, kita pertama harus mengubah file `WebRoot/testdrive/protected/config/main.php`, yang juga dikenal sebagai file [konfigurasi aplikasi](/doc/guide/basics.application#application-configuration):
|
|
|
|
~~~
|
|
[php]
|
|
return array(
|
|
......
|
|
'import'=>array(
|
|
'application.models.*',
|
|
'application.components.*',
|
|
),
|
|
|
|
'modules'=>array(
|
|
'gii'=>array(
|
|
'class'=>'system.gii.GiiModule',
|
|
'password'=>'pilih password di sini',
|
|
),
|
|
),
|
|
);
|
|
~~~
|
|
|
|
Kemudian buka URL `http://hostname/testdrive/index.php?r=gii`. Kita akan diminta password, yang baru saja dimasukkan di konfigurasi aplikasi di atas.
|
|
|
|
### Menghasilkan User Model
|
|
|
|
Setelah login, klik ke link `Model Generator`. Menu ini akan membawa kita ke halaman penghasil model,
|
|
|
|

|
|
|
|
Dalam field `Table Name`, masukkan `tbl_user`. Di dalam field `Model Class`, masukkan `User`. Kemudian klik tombol `Preview` yang akan memunculkan file kode baru yang akan dihasilkan. Klik tombol `Generate`. Sebuah nama file bernama `User.php` akan dihasilkan di `protected/models`. Kelas model `User` ini akan memungkinkan kita untuk berkomunikasi dengan tabel `tbl_user` dalam gaya berorientasi objek, yang nanti akan dibahas lebih lanjut.
|
|
|
|
### Menghasilkan CRUD Code
|
|
|
|
Setelah membuat file kelas model, kita akan menghasilkan kode untuk mengimplementasi operasi CRUD tentang data user. Kita akan memilih `Crud Generator` di Gii, yang ditampilkan sebagai berikut,
|
|
|
|

|
|
|
|
Dalam field `Model Class`, masukkan `User`. Di dalam field `Controller ID`, masukkan `user` (dalam huruf kecil). Sekarang tekan tombol `Preview` diikuti tombol `Generate`. Kita telah menyelesaikan proses penghasilan kode CRUD.
|
|
|
|
### Mengakses halaman CRUD
|
|
|
|
Mari kita nikmati pekerjaan kita dengan melihatnya di URL berikut:
|
|
|
|
~~~
|
|
http://hostname/testdrive/index.php?r=user
|
|
~~~
|
|
|
|
Ini akan menampilkan sebuah daftar entri pengguna dalam tabel `User`.
|
|
|
|
Klik tombol `Create User`. Kita akan dibawa ke halaman login
|
|
jika kita belum login sebelumnya. Setelah masuk, kita melihat formulir
|
|
input yang mengijinkan kita untuk menambah entri pengguna baru. Lengkapi formulir dan
|
|
klik tombol `Create`. Lengkapi form dan klik tombol `Create`. Jika terjadi kesalahan input,
|
|
sebuah tampilan error yang bagus akan muncul dan mencegah kita menyimpan inputan kita.
|
|
Kembali ke halaman daftar user, kita seharusnya melihat sebuah user baru sudah muncul di daftar.
|
|
|
|
Ulangi langkah di atas untuk menambah lebih banyak pengguna. Harap diingat bahwa halaman daftar pengguna
|
|
akan dipaginasi secara otomatis jika terlalu banyak pengguna yang harus ditampilkan
|
|
pada satu halaman.
|
|
|
|
Jika kita login sebagai administrator menggunakan `admin/admin`, kita dapat melihat halaman
|
|
pengguna admin dengan URL berikut:
|
|
|
|
~~~
|
|
http://hostname/testdrive/index.php?r=user/admin
|
|
~~~
|
|
|
|
Ini akan memperlihatkan tabel entri user yang bagus. Kita dapat mengklik sel header
|
|
tabel guna mengurut sesuai kolom terkait. Kita dapat mengklik tombol pada setiap baris
|
|
untuk melihat, meng-update atau menghapus baris data bersangkutan.
|
|
Kita dapat membuka halaman-halaman berbeda. Kita juga dapat memfilter dan mencari
|
|
data yang diinginkan.
|
|
|
|
Semua fitur bagus ini disediakan tanpa harus menulis satu baris kode pun!
|
|
|
|

|
|
|
|

|
|
|
|
|
|
|
|
<div class="revision">$Id: quickstart.first-app.txt 2375 2010-08-30 12:19:23Z mdomba $</div> |