Menjadi Pembangun CakePHP Bazet

Menjadi Pembangun CakePHP ~ Azril Nazli Alias ( azril.nazli@gmail.
com )
Menjadi Pembangun CakePHP

Penulis : Azril Nazli Alias
Kerjaya : Trainer PHP/MySQL, CakePHP, Linux System Administration, E

Commerce / Marketing, Freelance Web Developer
Pengalaman Programming : Sejak 1998
Email : azril.nazli@gmail.com
Facebook : http://facebook.com/azrilnazli
Tarikh : 1 January 2010
Versi: 0.06
Membina Aplikasi Blog menggunakan CakePHP 1.2.5 di dalam Persekitaran Windows

Menjadi Pembangun CakePHP ~ Azril Nazli Alias ( azril.nazli@gmail.com )
Menjadi Pembangun Laman Web Open Source
Pembangunan laman web ialah satu kerja yang memerlukan anda tahu banyak
teknologi dan juga berbagai bahasa aturcara. Membangunkan laman web ialah satu
kerjaya yang menyeronokkan dan juga memberi pendapatan lumayan disebabkan
oleh permintaan tinggi dari sektor swasta dan juga awam tetapi dengan syarat anda
perlulah kemaskini pengetahuan dengan teknologi terkini.
Tugas-tugas am pembangun laman web adalah seperti berikut
1. Memahami kehendak pelanggan dan membantu mereka membuat URS

( User Requirement Spec )
2. Memastikan server mengikuti spec untuk development dan juga production
3. Membina skema pengkalan data ( database schema )
4. Memastikan kod-kod dibackup dan mempunyai sistem versioning .
5. Mencari bugs di dalam sistem
6. Membuat Unit Test terhadap sistem
7. Memilih bahasa aturcara yang sesuai
( PHP,Ruby,Java,Perl,Coldfusion,ASP )
8. Memilih perisian pengkalan data yang sesuai ( MySQL,
Oracle,PostgreSQL )
9. Memilih sistem operasi yang sesuai ( Linux, Windows, FreeBSD )
10.Membina kod asas HTML dan membantu Pereka Laman Web ( Web
Designer )
11.Menentukan sistem navigasi dan kepuasan pengguna. ( User Experience &
Usability )
12.Berupaya menyelesaikan masalah dalam masa yang singkat
13.Memastikan sistem boleh dikemaskini dikemudian hari
14.Membina dokumentasi lengkap untuk manual pembangun ( API
Documentation )
15.Memastikan keselamatan laman web di peringkat tertinggi

Jelas di sini, tugas seorang pembangun laman web merangkumi banyak aspek.
Tidak terhad kepada aturcara semata-mata, seorang pembangun perlu mengetahui
selok belok server, pengetahuan asas tentang rangkaian dan juga web design.
Cabaran utama pembangun laman web semakin hari ialah untuk deliver hasil kerja
mereka dalam masa yang singkat dan mudah untuk diubahsuai mengikut kehendak
pelanggan. Contohnya jika pelanggan tiba-tiba ingin menambah feature seperti
search engine dan ianya perlu disiapkan dalam masa 1 jam.
Buku ini akan mengubah cara anda membina laman web. Secara tradisionalnya,
pembangun laman web yang menggunakan PHP dan MySQL akan membuat
sistem tanpa menggunakan framework. Memang benar, kelajuan aturcara anda
memang laju disebabkan anda tidak perlu mengikut undang-undang dalam
membina laman web. Anda boleh letak fail secara sesuka hati anda, membuat
panggilan database di setiap fail, malah anda tidak perlu risau dengan struktur
sistem anda. Tetapi, ianya akan menjadi masalah yang besar jika sistem anda perlu
dinaik taraf di kemudian hari dan ianya sudah tentu memerlukan ramai
pengaturcara untuk memahami cara anda membuat sistem. Lebih teruk lagi jika
sistem anda perlu dimigrate ke pengkalan data Oracle dari MySQL dan bayangkan
anda ada beribu-ribu fail yang memerlukan perubahan dan di ketika itu anda
mungkin rasa menyesal dan ingin berubah ke kerjaya yang tidak memeningkan
kepala anda.
Membina laman web menggunakan framework akan menjimatkan masa anda

dalam jangka masa yang panjang dan buku ini akan membuatkan anda gembira
dengan tugas sebagai pembina laman web.
Bagaimana untuk menjadikan elemen kegembiraan wujud di dalam dunia

aturcara ?

Memperkenalkan CakePHP Framework
CakePHP ialah satu framework yang cukup terkenal disamping Code Igniter,
Symfony Framework dan juga Zend Framework. Saya telah mencuba kesemua
framework di atas dan memilih CakePHP kerana sebab-sebab berikut:
1. Convention over Configuration ( sila google term ini )

2. Terdapat 5 juta result dari hasil carian Google berkaitan ‘CakePHP’
3. Terdapat lebih kurang14,000 ahli yang aktif di CakePHP Google Group
4. Boleh generate code secara automatik menggunakan command line
5. Mempunyai berbagai Helpers seperti Form,HTML,Ajax,Javascript,XML
dan banyak lagi
6. Menggunakan SEF URL ( Search Engine Friendly )
7. Struktur yang hampir sama dengan Ruby On Rails
Oh ya, saya lupa bercerita tentang Ruby On Rails atau RoR. Ianya mula popular
sekitar tahun 2006 disebabkan menggunakan konsep MVC ( Model View
Controller ) dan tujuan utama menggunakan RoR ialah untuk membuatkan
pembangun laman web gembira semasa membina sistem. ( sila google Ruby On
Rails )
Secara teknikalnya, CakePHP ialah
“ CakePHP is a rapid development framework for PHP which uses commonly

known design patterns like ActiveRecord, Association Data Mapping, Front
Controller and MVC. The primary goal is to provide a structured framework that
enables PHP users at all levels to rapidly develop robust web applications, without
any loss to flexibility. “

Pengetahuan Asas
Buku ini ditujukan kepada semua orang dengan syarat anda mempunyai minat
untuk menjadi pembangun laman web. Ya, buku di tujukan untuk semua peringkat
masyarakat di luar sana dengan pengetahuan asas menggunakan komputer dan
internet. Sepantas harimau kumbang berlari, dia perlu belajar berjalan dahulu
sebelum belajar berlari. Tapi sebaiknya jika ada mempunyai asas-asas berikut
- PHP dan SQL programming

- HTML, CSS dan Javascript scripting
- Apache dan MySQL system administration
Apa yang kita bina ?
Bayangkan membuat sesuatu yang mengembirakan contohnya buat blog. Blog

ialah satu medium di mana anda boleh mengasah bakat anda sebagai pembangun
laman web. Jadi kita akan membina sistem blog yang mempunyai elemen-elemen
seperti berikut :
1. Senarai posting anda

2. Komen untuk setiap post
3. Sistem login untuk admin , editor dan pelawat
4. Search engine
5. Sistem rating untuk post dan juga komen
6. Statistik pelawat dan juga posting yang popular
7. Sistem tag & kategori untuk setiap post
8. Sistem RSS ( Really Simple Syndication )
9. Dwi bahasa ( Bahasa Inggeris dan Melayu )
10.Sistem penunjuk status pemilik blog ala Twitter
Teknologi yang terlibat
Sekarang adalah zaman Web 2.0 dan skill-skill baru yang akan dipelajari adalah
seperti berikut
1. HTML
2. CSS
3. Javascript

4. AJAX
5. PHP
6. Object Oriented Programming
7. SQL
8. SVN
Untuk mengetahui apa maksud akronim di atas, sila Google setiap perkataan dan
cuba cari maksudnya.
Perisian yang perlu anda download

Saya adalah pengguna sistem operasi Linux sejak tahun 1998 dan sehingga kini
kesemua hasil kerja saya adalah menggunakan Linux sepenuhnya. Tetapi di dalam,
buku ini saya akan menggunakan platform Windows ( Windows Vista Home ).
Jadi perisian yang saya senaraikan di bawah adalah untuk platform Windows
sahaja.
# Kategori Nama URL

1 Developmen XAMPP Lite http://www.apachefriends.org
t Server
2 Text Editor Crimson Text Editor http://www.crimsoneditor.com
3 Version Tortoise SVN http://tortoisesvn.net

Control
4 Ajax ScriptAculoUs http://script.aculo.us

Framework
5 Ajax Prototype http://www.prototypejs.org

Framework
6 PHP CakePHP 1.2.5 Stable http://www.cakephp.org

Framework
7 Browser Mozilla Firefox http://getmozilla.com
8 Browser Firebug for Mozilla http://getfirebug.com
Debugger
Sila download kesemua fail di atas dan simpan di dalam satu folder.

Apa itu XAMPP ?
XAMPP ialah koleksi perisian asas untuk membolehkan saya menjalankan Apache
web server dan juga MySQL database server di dalam persekitaran sistem operasi
Windows. Secara amnya, Apache web server akan menggunakan port 80 di dalam
komputer kita dan MySQL akan menggunakan port 3306. Untuk memastikan web
server kepunyaan saya berjaya di install, saya cuma perlu buka alamat web
http://localhost:80 atau secara singkatnya http://localhost dan web server akan
memaparkan website. Disamping itu, XAMPP datang sekali dengan bahasa
perisian PHP yang akan digunakan oleh framework CakePHP di dalam projek blog
ini nanti.
Install XAMPP
Saya menggunakan XAMPP versi lite. Untuk install, sila ikuti cara-caranya di
http://www.apachefriends.org/en/xampp-windows.html . Untuk PATH
installation, saya gunakan c:\xampp. Setelah anda install xampp, klik ikon XAMPP
di Desktop anda dan jangan tick running sebagai service. Cuma start 2 service
sahaja, iaitu Apache dan MySQL. Klik menu start dan jika Windows Vista tanya
soalan untuk block/unblock service berikut, pilih unblock. Setelah anda berjaya
running 2 service itu ( Apache & MySQL ), gunakan Mozilla Firefox dan buka
alamat http://localhost atau http://127.0.0.1. Anda akan nampak XAMPP default
page seperti gambar rajah di bawah.

Pastikan perkataan ‘Running’ dipaparkan disebelah Apache dan MySql
Muka hadapan jika anda membuka alamat http://localhost atau http://127.0.0.1 di

browser Mozilla Firefox anda.

Pengenalan kepada CakePHP Framework
URL : http://www.cakephp.org
CakePHP ialah satu framework yang menggunakan PHP sebagai bahasa aturcara
sokongan. Ia mengambil inspirasi Rapid Application Development yang
diperkenalkan older framework Ruby On Rails. CakePHP boleh dijalankan di
dalam persekitaran Windows, Linux,Freebsd dan Mac OS.
CakePHP menggunakan konsep MVC dalam pembinaan laman web. MVC

bermaksud Model, View dan Controller
Apa itu Model ?
Model ialah gateway untuk akses data. Data boleh berbagai bentuk seperti fail
CSV, database, LDAP. Contoh fail untuk Post Model ialah
/app/models/model.php

Apa itu Controller ?
Sesudah data dipanggil dari sumber, tugas Controller ialah untuk memanipulasi
data sebelum di hantar ke View. Di dalam Controller, saya boleh panggil data dari
berbagai sumber seperti User,Post,Comment dan kemudiannya digabungkan untuk
di hantar ke View. Contoh fail untuk Post Controller ialah
/app/controllers/posts_controller.php
Apa itu View ?
View ialah tempat data dipersembahkan kepada client. Persembahan data boleh
berbagai bentuk seperti HTML,JSON,Javascript,XML malah text sahaja. View
ialah tempat di mana CakePHP berinteraksi dengan pengguna. Setiap action akan
mempunyai viewnya sendiri, contohnya Add Action, ianya merujuk kepada satu
method untuk Post Controller bernama Add dan akan mempunyai satu fail View
bernama /app/views/posts/add.ctp. Extension .ctp bermaksud Cake Template.

Struktur direktori Projek CakePHP
Contoh Struktur folder projek bernama Engineering di dalam CakePHP. CakePHP

mempunyai struktur direktorinya sendiri.
Engineering/ ~ mewakili nama projek
Engineering/app/ ~ folder aplikasi utama untuk projek Engineering
Engineering/app/config/ ~ menyimpan fail konfigurasi untuk sistem seperti

database, setting dsb
Engineering/app/controllers/ ~ menyimpan fail-fail Controller
Engineering/app/locale/ ~ menyimpan fail terjemahan i18ln

Engineering/app/models/ ~ menyimpan fail-fail Model
Engineering/app/plugins/ ~ menyimpan fail-fail untuk Plugin
Engineering/app/tests/ ~ menyimpan fail-fail untuk Unit Test
Engineering/app/tmp ~ folder sementara. Perlu writable
Engineering/app/vendors/ ~ folder untuk menyimpan 3r party vendor script.

Contohnya phpThumb, Zend library ,Pear library
Engineering/app/views/ ~ folder untuk menyimpan views untuk setiap action

dalam controller. Setiap views akan disimpan dalam foldernya sendiri contohnya
views/posts akan menyimpan semua fail view untuk model posts.
Engineering/app/webroot ~ folder untuk public dan menyimpan fail-fail untuk

image,css dan javascript.
Engineering/cake ~ folder untuk libray core CakePHP.
Install CakePHP di dalam XAMPP
Sebelum itu, baik saya terangkan bagaimana struktur direktori sistem blog ini.
Sepertimana yang kita tahu, XAMPP akan diinstall di c:\xampp dan directory
c:\xampp\htdocs akan menyimpan kesemua fail-fail yang boleh diakses melalui
web server. Jika PC anda mempunyai alamat 10.0.0.1 dan anda berada di dalam
rangkaian, rakan anda boleh mengakses fail-fail dan direktory menerusi alamat
http://10.0.0.1 dengan syarat Apache web server sedang berjalan.
Jadi di dalam kes ini, saya akan download CakePHP 1.2.5 stable ( .zip ) dan extract
sebagai folder c:\xampp\htdocs\cake_projects\

Klik Download 1.2.5 Stable
Pilih cake_1.2.5.zip

Save file dan extract ke Desktop

Extrak fail tersebut ke folder folder cake_1.2.5/ di dalam Desktop
Masuk ke dalam folder cake_1.2.5/ dan akan jumpa satu folder bernama
cake_1.2.5/ . Rename folder tersebut menjadi cake_projects. Copy/cut folder
tersebut ke dalam folder c:\xampp\htdocs
Contoh struktur direktori di dalam folder c:\xampp\htdocs\cake_projects\

Konfigurasi CakePHP
Untuk memastikan anda berjaya install CakePHP dengan jayanya, sila buka alamat
http://localhost/cake_projects/ menggunakan Mozilla Firefox, dan anda akan dapat
melihat page seperti berikut :
Jelas di sini anda perlu membetulkan 2 perkara iaitu :
1. Betulkan nilai Security.salt di dalam fail

c:\xampp\htdocs\cake_projects\app\config\core.php ( line 151 ) kepada nilai
lain ( asalkan bukan default )
2. Bina database bernama blog_development dan rename fail bernama
c:\xampp\htdocs\cake_projects\config\database.php.default kepada
database.php di dalam folder yang sama. Masukkan nilai yang betul untuk
username,password dan nama database di dalam fail database.php.

Ubah nilai Security.salt kepada nilai ‘projek_blog_cakephp_2010’
Buat database bernama blog_development
MySQL database adalah pilihan utama di dalam projek ini. Untuk memanipulasi
pengkalan data MySQL, saya akan gunakan perisian PHPMyAdmin yang telah
datang sekali dengan XAMPP. Untuk akses ke PHPMyAdmin, sila ke alamat
berikut
http://localhost/phpMyAdmin dan anda akan dapat paparan panel PHPMyAdmin.

Sila cari fungsi untuk create database dan masukkan nilai ‘blog_development’
Klik create setelah memasukkan nilai blog_development.
Kini , untuk membolehkan CakePHP berhubung dengan MySQL database,

settingnya adalah seperti berikut
- Username : root
- Password : < tiada password >
- Host : localhost

Dengan menggunakan Crimson Editor, edit fail database.php yang terletak di

c:\xampp\htdocs\cake_projects\app\config\database.php dan ubah nilai seperti di
atas. Save fail tersebut sebagai database.php dan buka alamat
http://localhost/cakephp_projects/
Kemudian, sila refresh browser anda di alamat http://localhost/cake_projects, dan

sepatutnya anda akan mendapat 4 baris hijau seperti di atas.
Maksud baris hijau mengikut urutan
1. Baris pertama berkisar berkenaan temporary folder. CakePHP memerlukan

satu folder tmp/ yang terletak di /app/tmp . Pastikan folder ini writable dan
jika membuat dalam Linux, pastikan anda set kan permission chmod 777
2. Baris ke 2 bercerita tentang CacheEngine. Cakephp menyokong perisian
caching untuk melajukan sistem. FileEngine digunakan secara default.
Antara perisian cache engine yang disokong ialah APC, MemCache dan
XCache

3. Baris ke 3 pula memberitahu anda fail konfigurasi /app/config/database.php

telah wujud dan boleh digunakan
4. Baris ke 4 pula memberitahu CakePHP berjaya membuat connection ke
database menggunakan setting di dalam fail /app/config/database.php
CAKE Bake Command Line Interface
Antara satu kelebihan CakePHP, ia mempunyai CLI ( command line interface )

yang akan membantu pembangun laman web dengan menggunakan MS-DOS
command line.
Seterusnya, cipta satu fail bernama cake.bat ( windows batch file) di lokasi
c:\xampp\htdocs\cake_projects\cake.bat . Sila tulis kod seperti di bawah.
Contoh kandungan kod fail cake.bat
Save fail tersebut dan kemudian buka terminal MS-DOS anda dan pergi ke folder
c:\xampp\htdocs\cake_projects\
Arahan : cd c:\xampp\htdocs\cake_projects
Sekarang, anda sudah boleh menggunakan cake CLI . Cuba taip arahan: cake dan
tekan [ENTER].

Paparan seperti di atas akan muncul. Saya ingin membina satu projek bernama
blog dan ianya akan disimpan dalam folder c:\xampp\htdocs\cake_projects\blog .
Sistem ini akan diakses melalui alamat http://localhost/cake_projects/blog
Jadi untuk membina projek bernama blog arahan berikut akan dilaksanakan
arahan: cake bake project
Kemudian paparan seperti di bawah akan ditunjukkan dan anda perlu isi lokasi
projek blog anda

Saya memberi nilai c:\xampp\htdocs\cake_projects\blog dan tekan [ENTER]
Seterusnya anda akan ditanya 2 soalan. Sila tekan Y untuke kedua-dua soalan dan
cake CLI akan membina projek blog anda dan output seperti di bawah akan

dipaparkan

Paparan selepas cake CLI berjaya bina projek blog
Kemudian cake CLI akan bertanya soalan tentang konfigurasi database. Kita akan
menggunakan objek default untuk menyimpan setting database. Sila ikut
konfigurasi seperti di atas. Tekan y jika anda bersetuju dengan konfigurasi yang
disediakan.

Paparan setelah berjaya membuat konfigurasi database untuk projek blog dengan
menggunakan cake CLI.
Menguji sistem blog
Sila buka alamat http://localhost/cake_projects/blog, dan anda akan dapat papar

seperti di bawah,

Ringkasan Bab 1
Dalam buku anda akan membina berbagai-bagai projek, tidak terhad hanya
membina blog sahaja. Contohnya anda membina sistem bernama Event, untuk
mengaksesnya hanya perlu membina projek di folder
c:\xampp\htdocs\cake_projects\ dan http://localhost/cake_projects/event
Folder c:\xampp\htdocs\cake_projects\ akan menjadi placeholder untuk berbagai-

bagai jenis projek yang saya akan tulis dalam buku ini.
Bab 2 : Membina sistem Posting
Jika anda melihat sistem blog seperti di blogspot atau wordpress, elemen utama
yang anda nampak ialah tajuk , isi, komen dan tarikh blog dicipta.
Gambar di atas adalah contoh tipikal satu posting blog.
Tugas pertama kita ialah membina satu sistem di mana kita boleh:

1. Baca posting secara detail

2. Edit posting
3. Senaraikan semua posting
4. Padam posting
5. Search posting
Struktur table posts
Sistem Blog yang akan dibina, akan menggunakan database table bernama posts
yang akan dibina di dalam database blog_development. Table posts ini akan
mempunyai kolum seperti berikut:
Nama Jenis Fungsi

id Integer, Menyimpan no rujukan setiap posting
auto_increment
Title Varchar Menyimpan tajuk posting
Summary Text Menyimpan summary setiap posting
Content Text Menyimpan kandungan posting
Created Datetime Menyimpan tarikh posting dibina
Updated Datetime Menyimpan tarikh akhir ubahsuai
posting
Is_publishe Integer Flag yang akan menentukan blog boleh
d dipaparkan kepada pembaca.
Untuk membina table posts seperti di atas, saya akan menggunakan Cake Schema.
Buka editor Crimson Editor anda dan taip kod seperti di bawah

Save fail tersebut sebagai blog.php di dalam folder /blog/config/sql/
Seterusnya, jalankan arahan berikut menggunakan cake CLI di dalam MS-DOS.

Kita akan gunakan dry mode untuk memastikan kod SQL yang dihasilkan
memenuhi kehendak sistem blog. Flag --dry akan menyebabkan CakePHP tidak
melaksanakan arahan untuk membina table posts di dalam database
blog_development.
Arahan : cake –app blog schema run create blog -dry
Sila pilih Y

Contoh SQL script yang dijana oleh arahan cake CLI. Untuk veteran SQL, anda
sudah tentu dapat membaca maksud kod SQL di atas. Jika dilaksanakan, satu table
bernama posts dengan field id,title,summary,content,updated,created dan
is_publish akan dibina di dalam database blog_development.
Tetapi command di atas tidak akan membina table bernama posts di dalam
database blog_development, anda perlu laksanakan arahan yang sama tetapi tanpa
flag --dry. Setelah anda berpuashati dengans struktur table posts, sila laksanakan
arahan berikut.
Arahan: cake –app blog schema run create blog

Arahan cake schema akan membina table bernama posts di dalam table
blog_development secara automatik.
Sekarang cuba anda buka perisian PHPMyAdmin di

http://localhost/phpMyAdmin. Pilih database blog_development di menu sebelah
kiri dan paparan berikut akan terpapar.
Dengan mengunakan cake schema, saya dapat membina table secara automatik
tanpa perlu menaip arahan SQL di dalam perisian phpMyAdmin.
Seterusnya, kita akan membina antaramuka sementara untuk table posts. Ianya
akan dibina juga menggunakan cake bake cli. Antaramuka ini akan membolehkan
saya menguji sistem blog yang asas dengan feature seperti
- Masukkan post
- Senaraikan post
- Kemaskini post
- Padam post
Arahan cake –app blog bermaksud, saya menggunakan cakephp akan

menggunakan projek folder blog di dalam c:\xampp\htdocs\cake_projects. Flag –
app akan memberitahu kepada CakePHP supaya menggunakan folder/projek blog.
Saya akan membina Model dan Controller untuk table posts.

CakePHP Model
Model di dalam CakePHP adalah sumber data, dalam kes ini table posts akan
diwakili oleh model bernama Post. Segala operasi untuk mengeluarkan dan
memasukkan data ke dalam table posts akan dilakukan oleh model bernama Post.
Untuk itu saya perlu bina model bernama Post sebagai /blog/models/post.php
Save fail di atas sebagai post.php di dalam folder

c:\xampp\htdocs\cake_projects\blog\models. Sperti penerangan saya di atas, Model
ialah kawasan di mana CakePHP bercakap dengan database MySQL. Dalam kes
ini, Post merujuk kepada Model. Untuk membina model, struktur berikut perlu
dipatuhi
1. Nama model mesti dimulakan dengan huruf besar seperti Post, User,
Location
2. Nama model mesti singular ( tanpa penambahan s ) dan bukannya plural
seperti Posts,Users
3. Nama model mesti dalam format CamelCase. Yakni dimulakan dengan
huruf besar dan diikuti dengan huruf kecil
4. Jika anda ingin menggunakan 2 patah perkataan sebagai mode, gunakan
CamelCase. Contohnya anda mempunyai table bernama user_settings, dan
ingin membina model untuk table tersebut. Nama model yang perlu anda
guna ialah UserSetting
5. Nama fail untuk Model mesti sama dengan nama model yang ditakrifkan di
dalam kod. Nama fail mestilah berhuruf kecil dan jika mempunyai 2
perkataan, mestilah dijarakkan dengan menggunakan underscore. Contohnya
nama fail untuk model UserSetting mestilah berbentuk user_setting.php
UserSetting ~ user_setting.php

Post ~ post.php
Location ~ location.php
6. Fail model perlu disimpan di dalam folder /blog/models/*
CakePHP Controller
Controller dalam CakePHP berfungsi untuk menerima data dari Post Model dan
data akan dimanipulasi di Controller sebelum di hantar ke View. Fungsi Scaffold
digunakan untuk melihat struktur table posts dengan menggunakan interface yang
digenerate oleh CakePHP. Untuk membina Post Controller, fail bernama
posts_controller.php perlu dicipta dan diletakkan di dalam folder /blog/controllers.
Save fail di atas sebagai posts_controller.php di dalam folder

c:\xampp\htdocs\cake_projects\blog\controllers.
Untuk membuat controller, proses di bawah perlu dipatuhi.
1. Controller akan menggunakan nama plural dari model. Jika kita

menggunakan model Post, controller akan menggunakan nama Posts dan
diakhiri dengan ayat ‘Controller’.
2. Jika anda hendak membuat Controller untuk Model UserSetting, failnya
akan bernama user_settings_controller.php
3. Nama Class mestilah dalam bentuk CamelCased dan disambung dengan
ayat ’Controller’. Contohnya UserSettingsController extends AppController
4. Fail Controller mesti disimpan di dalam folder /blog/controllers/
Seterusnya saya ingin menguji fungsi Scaffold. Oleh itu saya akan buka alamat
http://localhost/cake_projects/blog/posts
Paparan seperi di bawah akan ditunjukkan.

Seterusnya saya akan mencuba mengisi table posts dengan menggunakan interface
CRUD yang disediakan. Hasilnya seperti berikut.
Field id,created dan updated akan dimasukkan secara automatik oleh CakePHP.
Dengan menggunakan scaffold, kesemua fungsi seperti add,edit,delete akan
tersedia secara automatik.

Jika anda telah sampai peringkat ini, tahniah kerana berjaya mencipta sistem
lengkap CRUD pertama anda.
Maksud CRUD ?
C – Create ~ untuk cipta post
R – Read ~ untuk membaca post
U – Update ~ untuk kemaskini post
D – Delete ~ untuk padam post
Apa itu Scaffold ?
Scaffold ialah satu fungsi di mana CakePHP akan membina interface untuk operasi
CRUD yang menggunakan table posts sebagai sumber data. Kegunaan Scaffold
ialah untuk melihat struktur table yang dibina menepati kehendak sistem.
Ciri-ciri Sistem Blog : versi 1
Seterusnya kita akan membuat aplikasi kita yang pertama dengan ciri-ciri berikut
1. Sistem perlu mempunyai index dan view untuk senaraikan Posting dan
untuk paparkan Posting mengikut id
2. Perlu mempunyai mekanisma CRUD untuk admin
3. Setiap Posting perlu disenaraikan di hadapan , contohnya alamat
http://localhost/cake_projects/blog perlu memaparkan Posting terkini.
4. Posting di muka hadapan mesti menyenaraikan Posting terakhir dahulu
5. Hanya tajuk,tarikh dan ringkasan Posting sahaja di paparkan
6. Mesti ada link untuk membaca Posting yang lengkap.
7. Perlu ada link navigasi yang ringkas untuk panduan pembaca blog
8. Hanya paparkan Posting yang disahkan sahaja ( is_published = 1 )
9. Hanya paparkan 10 Posting dan selebihnya boleh disenaraikan
menggunakan Pagination.

10.Blog perlu menggunakan Search Engine Friendly URL untuk memudahkan

user memahami tajuk blog dia mereka terjumpa link di dalam hasil carian.
Kehendak : Sistem perlu mempunyai index dan view untuk senaraikan Posting dan
untuk paparkan Posting mengikut id
Untuk memenuhi kehendak di atas, saya akan membina 2 action bernama index
dan view di dalam Post Controller ).
Action index tugasnya ialah:
- Senaraikan posting mengikut format blog dan disusun mengikut tarikh. Blog
yang terakhir akan dipaparkan dahulu
- Hanya senaraikan Tajuk, Ringkasan,Tarikh sahaja
- Mempunyai Pautan untuk membaca blog dengan lengkap
- Mempunyai navigasi untuk membantu pembaca menggunakan blog
Tugasan : Senaraikan posting mengikut format blog dan disusun mengikut tarikh.
Blog yang terakhir akan dipaparkan dahulu.
 Pastikan anda telah menambah sekurang-kurangnya 10 posting

menggunakan Post Scaffold sebelum meneruskan langkah di bawah.
Penyelesaian : Untuk menyenaraikan posting, saya akan menggunakan action

index dan boleh diakses melalui http://localhost/cake_projects/posts/index . Untuk
itu saya akan menambah function index() di dalam Posts Controller dan akan
membina index.ctp di dalam folder /blog/views/posts.index.ctp . Untuk memanggil
data dari table posts, saya akan membuat function bernama getLatestPost() dalam
fail Post Model.

Bina Method getLatestPost() dalam Post Model
Pertama, saya akan bina function getLatestPost() di dalam fail

/blog/model/post.php
Function atau dikenali sebagai method getLatestPost() akan mendapatkan kesemua

data dari table posts menggunakan arahan $this->find(‘all’). Jika saya Cuma ingin
mendapatkan satu data sahaja, arahan $this->find(‘first’) boleh digunakan. Untuk
rujukan lanjut mengenai arahan $this->find, sila rujuk laman web :
http://book.cakephp.org/view/449/find
Seterusnya hasil carian akan dihantar menggunakan arahan return.

Bina method ( action ) index di dalam Post Controller
Tambah method index() dari baris 12 hingga ke 16. Variable $posts akan mendapat
data dari arahan $this->Post->getLatestPost(). $this->Post merujuk kepada model
Post, yakni sumber data yang digunakan untuk mendapatkan maklumat dari table
posts. Method getLatestPost() pula merujuk kepada method yang kita bina sebelum
ini di dalam fail /blog/models/post.php.
Memperkenalkan debug();
Di dalam programming, jadikan amalan untuk melihat struktur data dahulu

sebelum dipersembahkan ke dalam View. Untuk itu, saya akan menggunakan
fungsi debug() seperi di baris 15. Dalam kes ini variable $posts mempunyai data,
dan saya akan gunakan debug($posts); untuk melihat data yang terkandung di
dalamnya.
Untuk melihat hasilnya, sila ke alamat

http://localhost/cake_projects/blog/posts/index

Hasilnya adalah seperti di dalam screenshot di atas. Data disusun dalam bentuk
Array() yang ditentukan oleh CakePHP. Setiap gugusan data dikumpulkan
mengikut model, dalam kes ini Post. Jika saya ingin mengeluarkan title blog dari
variable $posts, saya akan melakukan arahan berikut
Echo $posts[0[‘Post’][‘title’]; /
Tetapi, saya akan menggunakan Foreach Loop untuk menyenaraikan kesemua data
posts. Contoh :
<?php Foreach( $posts as $key=> $value ): ?>
…kesemua data akan dipaparkan di sini menggunakan variable $key atau $value
<?php EndForeach; ?>
Apa itu $key=> $value ?
Ok, bayangkan anda ingin mengumpulkan data seperti nama pelara dalam kelas di
dalam satu variable $nama, apa yang anda perlu buat ialah

<?php
$nama[] = ‘Ahmad’;
$nama[] = ‘Raju’;
$nama[] = ‘Ah Chong’;
?>
$nama ialah key,

Ahmad,Raju dan Ah Chong ialah value
Untuk mengeluarkan data di atas, anda perlu menggunakan Foreach Loop
<?php
Foreach($nama as $key=>$value):
Echo $key . ‘ = ’ . $value . ‘<br />’;
Endforeach;
?>
Dan hasilnya seperti berikut
nama = Ahmad
nama = Raju
nama = Ah Chong

Daftar nilai ke View index.ctp
Berbalik semula ke sistem senarai blog, saya perlu daftarkan nilai variable $posts
dahulu di dalam index action sebelum ianya boleh digunakan di dalam View
index.ctp
Hanya perlu tambah kod di bari 18. Arahan $this->set(compact(‘posts’)); akan

megambil nilai $posts dan terus boleh digunakan di dalam View.
Rujukan cuntuk compact() : http://php.net/manual/en/function.compact.php
Post Views
Views adalah tempat dimana persembahan data dilakukan, folder bernama posts
perlu dibina di dalam folder /blog/views/ . Kemudian saya akan save fail bernama
index.ctp di /blog/views/posts/index.ctp . Nama folder biasanya adalah plural
kepada nama model. Contohnya jika model Post, nama folder ialah views. Jika
nama model UserSetting, nama folder view ialah user_settings

Contoh bagaimana saya cipta folder posts di dalam folder

c:\xampp\htdocs\cake_projects\blog\views\ menggunakan MD-DOS. Anda boleh
menciptanya guna Windows Explorer
Seterusnya buka fail baru di dalam Crimson Editor dan tulis kod seperti di bawah:
Save fail ini sebagai index.ctp di dalam folder /blog/views/posts/index.ctp . Fail

View mesti diakhiri dengan extension .ctp ( Cake Template ) dan pastikan nama
fail sama dengan nama method yang digunakan dalam Post Controller. Dalam kes
ini, index(), maka nama view untuk action index() ialah index.ctp.

Untuk melihat hasilnya, sila buka alamat http://localhost/cake_projects/blog, dan

papar berikut akan muncul.
Jika anda perhatikan, di bawah page tersebut, debug arahan SQL dipaparkan. Ada
beberapa perkara lagi yang perlu dibetulkan dengan paparan index di atas.
- Susunan blog sepatutnya diterbalikkan dengan Posting terakhir akan

dipaparkan dahulu
- Link untuk membaca kandungan blog
- Panel navigation untuk memudahkan pembaca pergi ke index semua setelah
membaca blog.

CSS Untuk Navigation
Sila cipta fail bernama /blog/webroot/css/blog.css
CSS untuk DOM id navigation. Kod di atas ialah kod CSS ( Cascading Style
Sheets ) yang digunakan untuk mengawal warna,saiz,kedudukan panel navigasi
blog kita nanti.
Seterusnya, CakePHP perlu diberitahu untuk memanggil fail ini.
Memperkenalkan LAYOUTS
Di dalam folder /blog/views/layout, ada terdapat satu fail bernama default.ctp. Fail
ini berfungsi sebagai placeholder untuk keseluruhan projek blog saya ini. Jika saya
melakukan perubahan di fail default.ctp, ianya akan diapply ke seluruh projek.

Tambah kod di line 38, dan save fail tersebut.
Seterusnya saya ingin menambah panel navigasi di dalam View index.
Tambah kod baris 1 hinga 4 di dalam fail /blog/views/posts/index.ctp dan save.

Refresh kembali action index anda, dan anda akan dapat paparan seperti di bawah
Perhatikan panel navigasi yang terletak di atas header My Blog Listing.

Betulkan Susunan Posting
Buka fail /blog/models/post.php dan letak kod di bawah:
Tambah kod seperti di baris ke 11 dan save fail post.php. Cuba refresh semula
action index() dan kedudukan susunan akan berubah.
Title website adalah satu elemen penting dalam pembinaan blog, kerana jika
pembaca ingin Bookmark page disukai, Browser akan mengambil nilai tag title.
Contoh
<html>
<head>
<title>Senarai Posting</title>
</head>
Tag title di atas akan dibaca oleh browser dan juga search engine. Jadi adalah
penting untuk saya ubahsuai layout default.ctp seperti di bawah :

Sila ubah fail /blog/views/layouts/default.ctp dan ubahsuai kod di baris 30
Ubah fail /blog/controllers/posts_controller.php. Tambah kod di baris 14. Save fail

tersebut dah refresh action index anda. Cuba bookmark page tersebut dengan tekan
CTRL + D di Mozilla.
Secara automatik satu popup akan terbuka dan nilai Page Title berjaya dibawa
sebagai title.

Membina action view ( untuk melihat kandungan lengkap blog )
Kehendak : Di dalam action index, hanya senarai ringkasan blog sahaja yang
dipaparkan. Bagaimana jika pembaca blog anda ingin membaca blog anda dengan
lebih lengkap ?
Penyelesaian : Bina satu action bernama view dan hanya menerima 1 argumen
sahaja, iaitu nilai $id. HTML link yang dijana di dalam index perlu membawa nilai
$id supaya CakePHP dapat retrieve data berdasarkan nilai $id yang diberi. Nilai
$id mesti dibawa menggunakan method http get. Contoh :
http://localhost/cake_projects/posts/view/13
Nilai 13 di atas adalah nilai $id yang dibawa menggunakan method http get.
Langkah 1 : Bina method getPost() di dalam Model Post
Baris 18 hingga 21

Langkah 2: Bina action view() dalam Post Controller
Baris 24 hingga 34
Tambah function view() di bawah function index() dan sebelum penutup class.
Save action view di dalam fail /blog/controllers/posts_controller.php.

Langkah 3 : Tambah View view.ctp untuk action view di dalam folder

/blog/views/posts/
Save fail ini sebagai view.ctp di dalam folder /blog/views/posts/
Langkah 4 : Ubahsuai view index.ctp untuk tambah link

Baris 17 hingga 23
Tambah kod dari baris 17 hingga 23 di dalam fail /blog/views/posts/index.ctp.
Langkap 5 : Uji sistem blog anda
Buka alamat http://localhost/cake_projects/blog/posts/ , paparan adalah seperti

berikut
Perhatikan saya berjaya membuat link Read di sebelah kanan setiap Post. Jika saya
klik link tersebut, paparan berikut akan ditunjukkan,

Blog boleh dibaca dengan sepenuhnya. Perhatikan juga link navigation di atas dan
juga back link di bawah. Dengan design sebegini, pembaca blog saya boleh
menggunakan sistem navigasi untuk kemudahan mereka membaca blog.
Apa yang berlaku jika tidak passing $id ?
Jika anda perhatikan kod untuk action view() dalam Post Controller,
Saya membuat checking untuk mengesan kehadiran nilai $id. Jika $id tidak wujud,
arahan redirect() akan dilaksanakan ke action index() dan disertakan dengan mesej.
Jika saya memasukkan alamat http://localhost/cake_projects/blog/posts/view ,

sistem akan redirect ke index dan memberi mesej ‘Invalid ID’.

Bagaimana pula jika pembaca menghantar $id yang tidak wujud di dalam
database ?. Untuk mengesan data yang tidak wujud, saya akan membuat code
seperti di bawah
Baris 28 hingga 34
Data yang tidak wujud akan memberikan nilai empty kepada variable $post. Jadi
saya Cuma perku periksa samaada nilai $post adalah empty, jika benar, redirect ke
index dan beri mesej ‘Post not exist’ kepada pembaca. Senario ini biasanya berlaku
jika search engine capture data yang lama dan pemilik blog telah padam daripada
database.

Pagination
Bagaimana jika Posting anda sudah terlalu banyak ? Gunakan Pagination Helper
untuk memudahkan pembaca blog membaca posting-posting lama anda. Saya akan
membuat blog pagination dengan 10 posting setiap page.
*Buka alamat http://localhost/cake_projects/blog/posts/add untuk tambah data
Ubahsuai index action di dalam Post Controller seperti berikut
Baris 19 hingga 22
Perhatikan saya ‘matikan’ baris 17 untuk memberi laluan kepada Pagination

Helper. Baris ke 20 ialah untuk memberi nilai jumlah post yang perlu dipaparkan.

Seterusnya, ubah fail view index
Salin kod di atas ke dalam fail View index di /blog/views/posts/index.ctp. Salin di

bahagian bawah fail tersebut.
Buka alamat http://localhost/cake_projects/blog/posts, dan blog anda kini sudah

mempunyai pagination di bahagian bawah.
Rujukan lanjut mengenai Pagination :

http://book.cakephp.org/view/164/Pagination

Helper Time dan Text
CakePHP mempunyai berbagai-bagai helper yang boleh kita guna untuk membantu
membuat coding dengan cepat dan kemas. Contohnya, saya ingin
- mengubah tarikh ~Time Helper

- membuat autolink supaya URL dalam post ~ Text Helper
- keluarkan tempoh masa blog di hantar ~ Time Helper
Buka fail Post Controller anda, /blog/controllers/posts_controller.php, dan tambah

kod Helpers seperti berikut. Saya akan menggunakan 2 Helpers, Text dan Time
Baris 10
Nilai var $helpers mesti dimulai dengan huruf besar dan diletakkan di dalam
format array();. Seterusnya ubahsuai fail Index View di /blog/views/posts/index.ctp
dan ubahsuai kod seperti di bawah :
Ba
ris 12,13 dah 15

Save fail tersebut dan buka alamat http://localhost/cake_projects/blog/posts/index,

dan perhatikan perubahan.
Action untuk Add,Edit dan Delete
Setakat ini, saya telah membuat 2 action, iaitu Index dan juga View. Untuk Add
( Tambah ) Post, saya akan gunakan admin routing dengan beranggapan hanya
admin sahaya yang boleh melakukan operasi add,edit dan juga delete. Jadi, untuk
manage blog, saya akan menggunakan URL seperti berikut :
http://localhost/cake_projects/blog/admin/posts/index ~ Index
http://localhost/cake_projects/blog/admin/posts/add ~ Add
http://localhost/cake_projects/blog/admin/posts/edit/12 ~ Edit
http://localhost/cake_projects/blog/admin/posts/delete/12 ~ Delete
Untuk membolehkan saya menggunakan admin routing, saya perlu mengubahsuai

fail /blog/config/core.php dan enablekan admin routing seperti berikut :
Baris 67
Save fail tersebut, dan edit semua fail Post Controller di

/blog/controllers/posts_controller.php dan tambah kod berikut :

Seterusnya, bina fail View untuk action admin_index() di dalam sebagai

/blog/views/posts/admin_index.ctp
Mari kita cuba admin routing. Buka alamat

http://localhost/cake_projects/blog/admin/posts/index. Paparan seperti berikut akan
keluar.
Seterusnya, kita akan bina sistem index untuk menyenaraikan kesemua posting
blog kita. Kembali semua ke action admin_index()
Ubahsuai admin_index() action di dalam Post Controller seperti kod di atas. Untuk
limit anda boleh letak nilai selain dari 2 contohnya 10.

Elements
Element di dalam CakePHP ialah satu fail yang diguna berulangkali. Dalam kes
ini, kod HTML/PHP untuk Pagination akan digunakan banyak kali di dalam
sistem. Oleh itu saya akan mencipta satu fail bernama paging.ctp di dalam folder
/blog/views/elements/ .
Save sebagai /blog/views/elements/paging.ctp
Untuk memanggil fail paging.ctp di dalam admin_index.ctp, saya akan buat kod
seperti di bawah
<?php echo $this->element(‘paging’); ?>
CakePHP akan secara automatik mencari fail bernama paging.ctp di dalam folder
tersebut. Seterusnya, ubahsuai fail admin_index.ctp seperti kod di bawah :

Baris 1 – 35. Save sebagai /blog/views/admin_index.ctp.

Seterusnya, cuba buka alamat http://localhost/cake_projects/blog/admin/posts
Sekarang, anda telah mempunyai antara muka admin index. Antara muka ini khas
untuk admin mengawal Posting blog anda seperti tambah,edit dan juga padam
Post. Jika anda perhatikan, link untuk Edit dan Delete, mempunyai flag admin =>
true. Kod ini bermaksud untuk mengarahkan CakePHP supaya menghasilkan link
seperti
http://localhost/cake_projects/blog/admin/posts/edit/1
http://localhost/cake_projects/blog/admin/posts/delete/1
Manakala link untuk view pula, berbentuk seperti :
http://localhost/cake_projects/blog/posts/view/1
Dengan cara ini, saya boleh membuat pemeriksaan, hanya usergroup admin sahaja
yang boleh mengakses fungsi tambah,padam dan edit di dalam sistem.

Tugasan : Sila tambah navigation dengan menggunakan BreadCrumb dari Hml

Helper.
Action Add
Untuk menambah Posting ke dalam sistem, saya perlukan satu action yang akan
menerima data dari HTML Form dan akan melakukan proses validation sebelum
data boleh dimasukkan ke dalam database dan memberi mesej error jika ada
masalah. Saya akan bina skeleton untuk action dan view untuk add
Salin kod di atas ke /blog/views/posts/admin_add.ctp
Tambah kod di atas di baris akhir fail /blog/views/posts/admin_index.ctp

Seterusnya ubah Post Controller anda dan tambah kod berikut di dalam action
admin_add()
Save Post Controller.
Cuba buka alamat http://localhost/cake_projects/blog/admin/posts, anda akan

nampak link Add New Post di sebelah bawah kanan, klik link tersebut, dan
paparan berikut akan keluar.

http://localhost/cake_projects/blog/admin/posts/add . Cuba isi data seperti di atas

dan klik button Submit.
Anda akan dipaparkan nilai yang dihantar oleh action Add dengan menggunakan
fungsi debug($this->data) di dalam action Add()
Form Data di dalam CakePHP di hantar dalam bentuk Array(), dan Model akan
menjadi kepala setiap array. Dalam kes di atas, yang menentukan Post adalah
kepala array ialah di dalam kod cipta form header, $form->create(‘Post’). Data
yang terdapat di dalam array pula disusun mengikut pasangan key dan value, Nilai
key adalah berdasarkan nama table field sepertimana yang terdapat di dalam
database. Data yang dihantar oleh Form, disimpan di dalam satu array value
bernama $this->data. Jadi, saya boleh anggap variable $this->data ialah satu
array() yang sepatutnya penuh dengan data. Dan saya boleh membuat checking
dengan kod if(!empty($this->data)) untuk memastikan variable $this->data
dipenuhi dengan nilai yang sepatutnya.

Form Helper
Rujukan : http://book.cakephp.org/view/182/Form
CakePHP secara automatik dapat mengesan jenis Form Field yang dikeluarkan
berdasarkan jenis field di dalam table. ( Convention over Configuration )
Tetapi ada ketikanya anda ingin membina Form dengan setting anda sendiri seperti
Ingin bina form header dengan method = get dan action ke /users/info
Akan hasilkan kod Form Header seperti
Untuk jenis-jenis Form Field pula, anda boleh melihat di sini ,

http://book.cakephp.org/view/204/Form-Element-Specific-Methods
Sila cuba setiap Form Helper method yang disediakan oleh CakePHP. Contoh di
bawah ialah saya ingin membina dropdown menu menggunakan data yang saya
bina sendiri.

Kod di atas akan hasilkan HTML kod seperti berikut:
Hasilnya di dalam Mozilla,
Save data ke dalam database
Untuk save data yang dihantar dari CakePHP Form Helper, arahan berikut akan
dilaksanakan jika controller berjaya detect kehadiran variable $this->data ,
contohnya

$this->Post->create(); // initiate ada record baru
$this->Post->save( $this->data ); // save ke dalam table posts
Post Model akan digunakan untuk melakukan operasi ini dan ianya akan di panggil
di dalam Post Controller. Kod $this->Post bermaksud, menggunakan objek Post
Model. Seterusnya, saya akan mengubah admin_add() action supaya data berjaya
disimpan di dalam database.
Baris 65 - 70
Ubahsuai action admin_add() untuk menambah fungsi save. Jika berjaya save, bagi
mesej ‘Post successfully added’ dan redirect ke action index(). Seterusnya cuba
anda klik link Add New Post di index ( di dalam Mozilla ) dan tambah data dengan
klik submit.

Contoh paparan jika anda berjaya hantar new Posting. Dengan hanya beberapa step
sahaja, anda sudah berjaya membuat sistem untuk menambah data ke dalam
database.
Form Validation
Rujukan : http://book.cakephp.org/view/125/Data-Validation
Form Validation ialah satu mekanisme di mana saya perlu menapis dahulu input
dari user sebelum data di simpan di dalam database. Untuk membuat form
validation di dalam sistem blog, saya perlu meletakkan rules di dalam fail
/blog/models/post.php .
Buat masa ini saya hanya mempunyai 1 rule sahaja untuk setiap field di dalam
table posts, iaitu data untuk title,summary dan content tidak boleh kosong
( empty ).

Baris 13 - 18
Ubahsuai /blog/models/post.php dan letak kod di atas.

Skrg, cuba anda hantar Post tanpa mengisi apa-apa nilai di dalam form field.
CakePHP akan memaparkan error untuk setiap field.
Edit Post
Seterusnya, saya akan membuat mekanisme untuk edit Post. Secara amnya,
pemilik blog akan buka paparan admin_index() dan akan klik link Edit di sebelah
kanan setiap row untuk Post. Link Edit tersebut sepatutnya membawa nilai $id
seperti di bawah
http://localhost/cake_projects/blog/posts/edit/12

Link di atas bermaksud, saya ingin edit Post yang menggunakan $id = 12. Action
admin_edit() perlu menerima nilai $id tersebut supaya boleh digunakan di dalam
action untuk manipulasi data Post = 12.
Pastikan link Edit di admin_index() adalah seperti kod di bawah :
Nilai $id telah diassign semasa di dalam Foreach Loop. Setkan ‘admin’ => ‘true’
untuk memberitahu CakePHP anda berada dalam mode Admin.
Kemudian, edit Post Controller anda dan tambah action admin_edit() seperti
berikut

Penerangan
Barus 79 hingga 87 adalah kod untuk kemaskinikan data di dalam table posts.
Form data akan dihantar menggunakan variable $this->data dan di dalamnnya
terkandung nilai id Post yang ingin dikemaskini. Arahan $this->Post->save($this-
>data) akan kemaskinikan data yang dihantar terus ke dalam table posts.
Baris 91 pula ialah kod yang mengeluarkan data Post berdasarkan nilai $id yang
diberi. $this->Post->read(null,$id) akan mengambil nilai Post berdasarkan $id di
dalam table posts, dan akan diberi kepada variable $this->data. Seterusnya Form
Helper akan menggunakan niali di dalam variable $this->data untuk keluarkan data
di dalam Edit Form.
Akhir sekali, cipta fail baru bernama /blog/views/posts/admin_edit.ctp dan tambah

kod seperti berikut :
Kod fail admin_edit.ctp hampir sama dengan admin_add.ctp, cuba ada

penambahan kod di baris no 9. Kod $form->input(‘id’) adalah penting kerana ia
adalah key untuk memberitahu untuk update rekod berdasarkan nilai ID di dalam

database. Seterusnya, cuba anda edit mana-mana Post di dalam senarai index, dan
anda akan dipaparkan dengan interface seperti berikut :
Cuba ubahsuai data di dalam form tersebut dan klik submit.

Mesej ‘Post successfully updated’ akan dipaparkan. Seterusnya, action

admin_delete(). Tambah kod untuk admin_delete() seperti kod di bawah di dalam
Post Controller,
Kod baris 101, $this->Post->del($id) adalah arahan untuk memadam rekod di

dalam database. Selebihnya hanya fungsi checking sahaja. Save Post Controller,
dan cuba Delete Post.
Jika saya klik link Delete, Confirmation Popup akan keluar.

Contoh kod Delete di dalam admin_index.ctp.
Latihan :
1. Buat action dan controller untuk admin_view di dalam Post Controller
Ubah Default Route ke Blog index
Secara default,CakePHP akan routekan hompeage anda (

http://localhost/cake_projects/blog ) ke controller : Pages dan action : Display

seperti paparan di bawah.

Saya ingin mengubah default page ke Controller : posts Action : index. Untuk itu
saya akan mengubah fail Route, /blog/config/routes.php
Ubah baris 36.

Kemudian buka alamat http://localhost/cake_projects/blog dan Posts Index akan

menjadi default page.
Sistem Administration
Buat masa ini ,untuk akses ke sistem Admin, saya akan menggunakan alamat
http://localhost/cake_projects/blog/admin/posts.

Alhamdulillah, kita berjaya tamatkan tutorial peringkat pertama. Dalam tutorial

seterusnya, kita akan buat modul-modul berikut
1. Blog Authentication ( Admin perlu login dahulu sebelum boleh akses modul
Admin )
2. Search Engine untuk carian Post
3. Tingkatkan sekuriti Form menggunakan Sanitize
4. Update status menggunakan Ajax
5. Sistem Komen.
6. User registration & User management
7. Sistem Attachment untuk gambar-gambar
8. Gabungkan TinyMCE HTML Editor
9. Sistem RSS ( Really Simple Syndication )
Azril Nazli Alias

azril.nazli@gmail.com
- CakePHP
- Ruby On Rails
- LAMP

Helpers untuk SideBar
Sidebar ialah kawasan di mana saya boleh meletakkan berbagai-bagai elemen

seperti :
- Menu untuk pembaca

- Menu untuk admin
- Senarai Posting terkini
- Senarai Komen terkini
Jadi untuk itu, saya akan membuat Helpers bernama Sidebar. Untuk memastikan
Helper Sidebar sentiasa dipanggil, saya akan membuat satu master controller yang
di panggil AppController. Fail ini membolehkan arahan dilakukan secara global.
Contohnya jika anda ingin membuat statistik pelawat, anda boleh meletakkan kod
tersebut di AppController tanpa mengulangnya di setiap Controller yang ada dalam
sistem anda. AppController ini telah dibina secara default oleh CakePHP dan
lokasinya terletak di /blog/app_controller.php.
Saya cuma ingin mendapatkan 10 posting terakhir sahaja. Jadi fungsi $this->Post-
>getLatestPost() di dalam Post Model perlu diubah supaya menerima variable
$limit. Variable $limit ini yang menentukan jumlah data yang akan ditarik dari
database.
Buka fail /blog/models/post.php dan ubahsuai method getLatestPost() seperti

berikut :

Kali ini saya telah mengubahsuai panggilan $this->find dengan meletak argumen
$options. Variable $options ialah array yang menyimpan settings supaya CakePHP
boleh mencipta script SQL yang sesuai untuk memanggil hanya 10 data sahaja dari
table posts dan Cuma field id,title dan created sahaja yang direturn.
Kod di atas akan menghasilkan script SQL seperti berikut :

SELECT `Post`.`id`, `Post`.`title`, `Post`.`created` FROM `posts` AS `Post` WHERE 1 = 1 ORDER BY
`Post`.`id` DESC LIMIT 10
Sekarang, $this->Post->getLatestPost() telah diubahsuai dan saya ingin aplikasi

blog saya sentiasa mendapatkan 10 posting terakhir di keseluruhan sistem. Untuk
itu saya akan ubahsuai AppController di /blog/app_controller.php dan tambah
kod berikut :
beforeRender() ialah satu ciri CakePHP yang amat penting. Saya memanggil
fungsi beforeRender() selepas logik di dalam Controller di jalankan dan sebelum
CakePHP memaparkan View. Di antara fasa tersebut, saya menyuruh
AppController untuk dapatkan 10 Posting terakhir dan didaftarkan ke dalam View
menggunakan variable $latest_posts. Dengan cara ini, saya boleh menggunakan
variable $latest_posts untuk di gunakan di dalam Helper Sidebar.

Seterusnya, saya akan mencipta Helpers bernama Sidebar di

/blog/views/helpers/sidebar.php
Fungsi $sidebar->getLatestPost() akan memaparkan 10 Posting terakhir di dalam

sidebar aplikasi blog kita nanti. Untuk membina Helper :
1. Nama Helper perlu dalam singular seperti TimeHelper, GenerateXmlHelper

dan diikuti dengan ayat Helper dalam bentuk CamelCased
2. Lokasi untuk menyimpan Helper ialah di dalam folder /blog/views/helpers/
3. Helper perlu dipanggil di dalam Controller barulah ia boleh digunakan di
dalam View. Contohnya var $helpers = array(‘Sidebar’, ‘Time’, ‘Ajax’)
4. Kebiasaannya, Helper adalah pembantu kita di dalam View untuk
menghasilkan kod yang kompleks.
Seterusnya, saya perlu panggil Helper Sidebar di dalam AppController. Dan

disebabkan saya perlu menggunakan model Post untuk memanggil method
getLatestPost(), saya perlu juga panggil model Post di dalam AppController
dengan menggunakan $uses.

Sila ubah AppController anda di /blog/app_controller.php dan salin kod seperti

di bawah :
Contoh lengkap AppController seperti di bawah :
Perlu diingatkan, selepas bari ke 15, jangan ada whitespace yang terhasil. Untuk
untuk, anda tidak perlu tutup kod php dengan tanda ?> seperti kebiasaan untuk
mengelakkan masalah whitespace.

Akhir sekali, saya ingin membuat ruangan untuk sidebar di dalam

/blog/views/layouts/default.ctp
Hanya perlu ubah kod di dalam DIV = content. Baris ke 68 adalah penggilan
Helper Sidebar untuk hasilkan kod yang memaparkan 10 posting terakhir di dalam
aplikasi blog. Save fail default.ctp dan buka alamat
http://localhost/cake_projects/blog
Di sebelah kanan aplikasi kini sudah ada senarai posting terakhir.

Authentication
Kini tiba masanya saya ingin membuat sistem Auth di mana hanya admin sahaja
yang boleh akses untuk manage blog admin. Untuk itu, saya perlukan table
bernama users dicipta di dalam database blog_development. Buka kembalik fail
Blog Schema yang terletak di /blog/config/sql/blog.php dan tambah kod untuk
table users :
*ralat : length untuk password sepatutnya 255 bukan 10 ( baris 25 )
Baris 21 – 35. Untuk mencipta table users menggunakan Cake Schema Console,
sila buka konsol MS-DOS dan pergi ke folder c:\xampp\htdocs\cake_projects\blog

Seterusnya saya hanya ingin mencipta table users sahaja. Untuk itu jalankan arahan
berikut di dalam MS – DOS
cake schema run create blog users bermaksud CakeSchema akan create table
bernama users di dalam skema blog.
Seterusnya anda akan ditanya 2 soalan

- Drop table users ? [ y ]

- Create table users ? [ y ]
Saya secara tidak sengaja telah meletak length untuk field password = 10.
Sepatutnya ialah 255 disebabkan komponen Auth akan seara automatik hashedkan
password yang dihantar dan ianya memerlukan 64 aksara . Jadi saya perlu ubah fail
skema blog dan perlu update table users.
Arahan : cake schema run update blog users

Kini anda telah mempunyai table users di dalam database blog_development.

Anda boleh taip cake schema help untuk arahan-arahan lain seperti update table,
cipta schema utama, cipta snapshot dan berbagai arahan lagi.
Table users sudah dicipta. Seterusnya saya perlu bina Model, Views dan Controller
untuk User. Disebabkan saya cukup malas untuk taip satu-persatu kod untuk
Model,View dan Controller, saya akan gunakan cake bake CLI untuk membuat
fail-fail tersebut secara automatik.
Cipta User Model : cake bake model User
Cipta User Controller : cake bake controller User

User Controller akan dicipta dengan fungsi $scaffold terbina dalam.
Cipta User View : cake bake view User
CakePHP akan mencipta fail skeleton untuk CRUD ( index,view,add dan edit ) di
dalam /blog/views/user/*
Sila lawati http://localhost/cake_projects/blog/user ( User singular bukan plural ).

Dan anda akan dapati paparan seperti di atas.

Auth Component
URL : http://www.littlehart.net/atthekeyboard/2007/09/11/a-hopefully-useful-
tutorial-for-using-cakephps-auth-component/
Saya akan menggunakan Component Auth yang didatangkan khas bersama

CakePHP untuk melindungi sistem Admin aplikasi blog. Komponen Auth secara
default akan mengambil kira konfigurasi berikut :
- Table bernama ‘users’ dicipta di dalam database

- Field bernama ‘username’ dan ‘password’ di dalam table users
Edit fail AppController untuk menambah var $components = array(‘Auth’);

supaya Auth Component dapat digunakan.

Ubahsuai AppController anda dan tambah kod seperti di bawah :
Kod untuk beforeFilter() di dalam AppController
Kod untuk isAuthorized(). Untuk protect admin area.

Tambah kod di baris 64 di dalam method beforeRender(). Untuk register $Auth di

dalam View.
Save fail AppController dan sekarang tambah satu user di alamat

http://localhost/cake_projects/user/add

Klik button submit. Sila tick checkbox Is Admin. Kemudian buat satu lagi user,
tetapi jangan tick checkbox is_admin. Jadi anda akan mempunyai 2 user,iaitu
admin dan bukan admin.
Jika Auth Component berfungsi dengan betul, nilai Password untuk User anda
sepatutnya berbentuk hashed seperti di atas.

Bina action untuk login() dan logout() dalam User Controller
Buka fail /blog/controllers/user_controller.php dan tambah fungsi login dan logout.
Baris 1 – 21 ( 4 methods, login,logout, admin_login dan admin_logout ) Saya

membina action untuk normal login/logout dan juga untuk admin login/logout.

Untuk action login dan admin_login, saya perlukan View login.ctp dicipta di dalam
folder /blog/views/user/login.ctp
Untuk menguji sistem Auth, saya perlu ubahsuai kod AppController (

/blog/app_controller.php ) dan matikan kod $this->Auth->allow(array(‘*’));
Baris 21 di dalam /blog/app_controller.php
Kemudian saya akan allow action Post Index dan Post View. Ini bermaksud,
pembaca tidak perlu login untuk akses action index() dan view() di dalam Post
Controller. Tambah method beforeFilter dalam Post Controller (
/blog/controllers/posts_controller.php )

Kalau anda masih ingat, di dalam AppController, saya telah menambah kod
Baris 64.
Dengan menggunakan $this->Auth->user(), saya boleh akses maklumat user yang

telah login dengan mudah sekali. Jika anda debug($Auth) di dalam View
default.ctp, data berikut akan diperolehi :
Baris 24 /views/layouts/default.ctp

Hasil debug($Auth) di dalam default.ctp. Dengan menggunakan variable $Auth di

dalam view, saya boleh mengesan user yang login ialah admin atau tidak dengan
menggunakan $Auth[‘User’][‘is_admin’]. Nilai 1 adalah admin dan 0 adalah
sebaliknya.

Jadi saya boleh membuat menu yang ringkas untuk Admin di dalam Helper
Sidebar. Edit fail /blog/views/helpers/sidebar.php dan tambah 2 method berikut :
Ralat ! : Baris 32, sila setkan ‘admin’ => FALSE
Method admin_login() untuk cipta link login ke Admin Post dan method admin()
untuk senaraikan modul-modul untuk Admin.
Seterusnya, di dalam Default Layout, /blog/views/layouts/default.ctp, sila tambah

kod berikut :

Sekarang, mari kita uji sistem Auth. Sila buka browser ke alamat
http://localhost/cake_projects/blog
Anda akan nampak link Administration di sidebar belah kanan, klik link tersebut
dan paparan login akan dipaparkan. Cuba login sebagai user yang mempunyai
akses admin.

Secara automatik, CakePHP Auth akan redirect anda ke muka hadapan blog dan
cuba klik menu Manage Post di sebelah kanan.
Paparan admin_index untuk Post. Kemudian cuba klik link Logout dan cuba login
sebagai user yang tidak mempunyai akses admin.

Menu Administration tidak kelihatan di sebelah kanan.
Cuba anda pergi ke alamat admin secara manual,

http://localhost/cake_projects/blog/admin/posts
Amaran Unauthorized Access akan diberikan. Taip

http://localhost/cake_projects/blog/user/logout untuk logout secara manual.

Ubahsuai User Controller menjadi Admin Scaffold
Jika anda malas untuk menaip semula kesemua Controller Action untuk CRUD
dan view, anda boleh menggunakan satu ciri $scaffold untuk Admin. Sila buka
User Controller dan update menjadi kod berikut
Jadikan var $scaffold = ‘admin’;
Sila tambah 2 method di atas, beforeRender() dan beforeFilter().
Callback beforeRender() digunakan untuk customise jenis field yang dipaparkan

di dalam action index dan juga edit. Jadi tidak kesemua field akan dipaparkan. Kod

untuk paparan Edit mempunyai field tambahan bernama change_password. Jika

admin ingin menukar password user, dia boleh menggunakan field ini. Mengapa
guna change_password tetapi tidak terus field password sahaja ?
Componen Auth di dalam CakePHP akan mengambil apa sahaja nilai termasuk
whitespace ( blank ) dan akan convert ke format hashed password jika ia detect
field bernama ‘password’ digunakan. Bayangkan admin Cuma ingin mengubah
data email , tetapi bila admin submit data, CakePHP akan mengambil nilai
whitespace / blank dan terus hashed kan data untuk password dan save ke dalam
database. Seterusnya, user tersebut tidak dapat login kerana hashed password
sudah bertukar. Untuk mengatasi masalah ini, saya menggunakan custom field
yang bernama change_password. Dalam callback beforeFilter(), saya akan
membuat checking samaada data change password wujud atau tidak. Jika wujud,
assignkan $this->data[‘User’][‘password’] kepada nilai change_password dan
secara automatik CakePHP akan mengubah password tersebut di dalam database.
Kemudian update fail Sidebar Helper untuk letak link Manage User
/blog/views/helpers/sidebar.php ( action admin )
Buka semua aplikasi blog di dalam Firefox , dan klik menu Manage User di
sebelah kanan, paparan berikut akan terhasil

Dengan masa tidak sampai 5 minit, anda telah berjaya membuat Admin Modul
untuk Model User . Module ini menggunakan $scaffold yang telah dicustomkan.
Cuba klik Edit salah satu user,
Kelihatan field bernama Change Password. Cuba anda ubah password ke nilai
yang baru. Kemudian logout, setelah itu login kembali menggunakan password
yang baru diubah.

Callback AfterFind
Bagaimana jika saya tidak suka format date Created dalam Scaffold ? Dan saya
ingin dalam format TimeAgoInWords() ? Untuk mengubah data yang telah ditarik
dari dalam database, saya akan menggunakan callback AfterFind() di dalam User
Model. Buka fail /blog/models/user.php dan tambah kod berikut :
$results adalah array() data yang direturn dari database.
Refresh semua paparan Manage User dan format Created telah berubah. AfterFind
sangat berguna jika anda ingin mengubah data yang dikeluarkan dari database
seperti untuk kegunaan drop down menu.

Model Relation
url : http://book.cakephp.org/view/79/Relationship-Types
Dalam CakePHP, table join dipersembahkan dalam bentuk Model Relation seperti
- User hasMany Post

- User hasMany Comment
- Post belongsTo User
- Post hasMany Comment
- Comment belongsTo Post
- Comment belongsTo User
- Tag hasAndBelongsToMany Post
- Post hasAndBelongsToMany Tag
Konsep blog yang saya bina ialah setiap User akan mempunyai Post mereka
sendiri. Jadi relationship yang ingin saya bina ialah berupa :
- User hasMany Post

- Post belongsTo User
Disebabkan setiap Post dimiliki oleh seorang User, di dalam table posts saya perlu
menambah kolum bernama user_id ( integer ). Untuk itu saya perlu ubahsuai fail
/blog/config/sql/schema/blog.php dan menambah field user_id
Ubah baris 12

Jalankan arahan Cake Schema : cake schema run update blog posts
Ubah Post Controller
Method admin_add() dan admin_edit() perlu diubahsuai untuk membolehkan nilai

user_id di dalam table posts diberi nilai $id user yang sedang login. Buka fail
/blog/controllers/posts_controller.php dan ubahsuai kod :
Tambah baris 71

Tambah baris 88
Variable $this->data[‘Post’][‘user_id’] akan diberi nilai $id user yang sedang login
dengan menggunakan panggilan $this->Auth->user(‘id’);
Ubahsuai Model Post dan User untuk tambah Model Relation
User Model : /blog/models/user.php
Hanya tambah baris 7

Post Model : /blog/models/post.php
Hanya tambah baris 11.
Seterusnya, edit Post terkini atau tambah Post baru menggunakan fungsi admin
Manage Post. Pastikan nilai user_id diisi secara automatik dengan melihat data di
dalam phpMyAdmin

Ubahsuai fail View Index di /blog/views/posts/index.ctp untuk tambah nama User

di dalam Posting
Baris 13. Cuba debug() nilai $value di baris 9. Anda akan lihat CakePHP akan
return data User yang memiliki Post tersebut.
Buka semula aplikasi blog anda dan hasilnya adalah seperti berikut :

Ralat
Ralat dalam format kolum Post.created,Post.updated,User.created dan

User.updated. Sepatutnya, jenis kolum ialah datetime dan bukannya date. Untuk
membetulkan format kolum tersebut, saya akan mengubah fail Blog Schema dan
akan laksanakan arahan cake schema
Ubah baris 16,17,34 dan 35.

Laksanakan arahan : cake schema run update blog posts. Cuba tambah Post lihat
kembali format data di browser.
Sekarang format Date untuk Created telah berjaya dipaparkan dengan betul.
Latihan
1. Gunakan field Updated untuk paparkan bilakah Post tersebut kali terakhir
dikemaskini.
2. Paparkan nama User di dalam admin_index Manage Post
3. Hanya paparkan Post dengan kondisi is_published = 1 di dalam index

Search Engine untuk Post
Tambah kod di bawah di dalam Post Controller
Bina function search() di dalam Post Controller. Sila baca komen untuk
penerangan.

Bina view untuk function search().
Header search.ctp untuk menu dan CSS untuk highlight keyword.
Fieldset search.ctp untuk bina form carian.

Search Result. Untuk paparkan hasil carian
Salin kesemua kod di atas dan save sebagai /blog/views/posts/search.ctp
Seterusnya, mari kita cuba sistem carian, layari

http://localhost/cake_projects/blog/posts/search dan mulakan carian berkaitan
‘php’ dan tekan Search.
Jasil carian akan dihighlight denganw arna kuning.

Screenshot di atas adalah bila saya cuba mencari Post dari pada User bernama
‘bazet’
Melihat SQL yang dijana oleh CakePHP, ia berjaya fetch 5 row data yang
berkaitan dengan search term di atas.

Seterusnya saya ingin membuat search field di dalam Helper Sidebar. Oleh itu saya
akan menambah Helper Form di dalam fail /blog/views/helpers/sidebar.php seperti
berikut :
Kemudian, saya akan bina method bernama search() supaya ianya boleh digunakan
di dalam Default Layout untuk generate Search Form :
Save fail Sidebar Helper, dan buka Default Layout, /blog/views/layouts/default.ctp

dan tambah kod berikut;
Baris 69 di dalam DOM id = sidebar.

Refresh kembali aplikasi Blog anda dan sistem carian telah terpapar di sebelah atas
kanan sidebar. Cuba buat carian dan tekan [ENTER]
Hasil carian anda telah berjaya dipaparkan.

Penerangan untuk Search Engine.
Ianya nampak kompleks kerana kriteria saya ialah mencari keyword match di
setiap field yang terlibat di dalam table Posts dan Users.
Saya gunakan array $options untuk membina dahulu kriteria carian.
- Fields : untuk tentukan field yang direturn ke View

- Limit : limit data yang dikeluarkan
- Order : susunan data berdasarkan Post.id ( ASC atau DESC )
- Conditions : kod yang akan generate statement untuk WHERE
- Or : carian ialah berdasarkan OR ( pilihan lain ialah AND )
Kod di baris 64,65 dan 66 ialah value assignment berdasarkan data yang dihantar
oleh Search Form sesudah user menekan button Search.

Action Search adalah fungsi untuk Public User dan tidak perlu Login ke dalam
sistem untuk menggunakannya. Jadi sila allow action Search dalam Post Controller
beforeFilter.
Menggunakan $postConditions
url : http://code.hexflux.com/2009/06/easier-searchfiltering-with-
controllerpostconditions/
Seterusnya saya ingin membuat Admin Search. Fungsinya untuk membuat simple
Search Filter untuk Admin Post. Sayacuma ingin membuat Post Filter dengan
menggunakan 2 fields sahaja iaitu Post.title dan Post.summary. Buka fail Post
Controller, dah tambah kod berikut

Untuk admin_search.ctp di dalam folder /blog/views/posts/ pula, sila tulis kod

berikut,
Kod di atas akan menjana Form untuk Search Filter
Kod di atas untuk menjana hasil carian.

Buka alamat http://localhost/cake_projects/blog/admin/posts/search. Mari kita

filter Post dengan keyword Post.title = ‘cakephp’ dan Post.summary = ‘skeleton’
( gunakan keyword anda )
Hasil carian terpapar di atas.
Kod SQL untuk Filter dijana oleh CakePHP
Kod $this->postConditions memudahkan anda menjana kod conditions untuk di

gunakan dengan $this->Model->find(‘all’, $options). Untuk bacaan lanjut dan
contoh, sila ke http://code.hexflux.com/2009/06/easier-searchfiltering-with-
controllerpostconditions/
Latihan :
1. Tambah link Post Filter di Sidebar di bawah Manage Post.

2. Tambah kod BreadCrumb di dalam admin_search.ctp

Sistem Komen menggunakan Ajax
CakePHP mempunyai Ajax dan Javascript Helper. Jadi untuk menulis kod untuk
Ajax, saya boleh menggunakan Helper tersebut. Cake 1.2.5 menggunakan Ajax
Prototype dan ScriptAculoUs. Untuk menggunakan Ajax, sila download
prototype.js dari website http://prototypejs.org/download dahulu dan save
sebagai /blog/webroot/js/prototype.js.
Kemudian ubah AppController untuk memasukkan Helper Javascript dan Ajax.
Baris 4 : /blog/app_controller.php
Seterusnya, include prototype.js dalam Default Layout di

/blog/views/layouts/default.ctp
Baris 35
Untuk sistem komen, Model Relation adalah seperti berikut :
- Post hasMany Comment

- Comment belongsTo Post
Ubah dahulu Model Post , /blog/models/post.php

Seterusnya, buka fail Skema Blog di /blog/config/sql/blog.php dan tambah skema

untuk table comments :
Saya akan bina table comments menggunakan Cake Bake CLI script.
Arahan : cake –app blog schema run create blog comments

Bina Model untuk Comment
Arahan : cake –app blog bake model
Hasil Comment Model yang dicipta oleh Cake Bake CLI

Bina Controller untuk Comment
Arahan : cake –app blog bake controller

Sila buka alamat http://localhost/cake_projects/comments
CakePHP secara automatik membuat dropdown Post. Sekarang saya sudah

mempunyai sistem Comment yang asas . Komen akan diisi oleh pembaca blog dan
mereka perlu memberi nama (Comment.poster_name), email
( Comment.poster_email ) , alamat website ( poster_website) dan akhir sekali
komen ( Comment.content ). Untuk field post_id, saya akan letak secara manual

di dalam Controller sebelum save untuk rujukan Post yang mana satu komen ini
ditujukan.
Untuk menghantar komen, pembaca perlu klik Post View dahulu dan di bawah
setiap Post akan ada ruangan untuk menambah komen. Saya akan menggunakan
teknologi Ajax untuk user menghantar komen.
Baris 11 ( Pastikan Post hasMany Comment )
Controller Comment Add akan menguruskan tugas memasukkan data komen ke

dalam table comments beserta post_id. Validation yang asas akan digunakan dalam
Comment Model.
Validation dalam Comment Model, /blog/models/comment.ctp
Tambah rule untuk $validate, barus 13 – 18

Seterusnya, saya akan tambah $components bernama ‘RequestHandler’ di dalam

Comment Controller. Dan bina action untuk beforeFilter() dan add().
Baris 1 – 32, /blog/controllers/comments_controller.php
Saya menggunakan magic find di baris 21, findAllByPostId. Nilai $post_id datang
dari hidden form field. Method Comment->findAllByPostId akan mencari
kesemua komen yang mempunyai nilai post_id yang sama dan seterusnya akan
didaftar ke View sebagai $comments. Jika ada form error, baris 25 – 28 akan

dilaksanakan. $this->render(‘add_failure’,’ajax’); akan render fail bernama

add_failure.ctp di dalam folder /blog/views/comments .
Cipta folder bernama comments di dalam folder /blog/views/ untuk placeholder

Comment View.
Cipta 2 fail bernama add_success.ctp dan add_failure.ctp di dalam folder

Comment View dan tambah kod di bawah :
/blog/views/comments/add_success.ctp
Baris 3 ialah arahan Ajax Prototype untuk sembunyikan Reply Form setelah
komen berjaya ditambah. Array $comments datang dari action add() sekiranya
berjaya save $this->data . Di baris 6 .Saya menggunakan Element .CakePHP akan
mencari fail /blog/views/element/comment.ctp dan passing variable $comment di
dalammnya.
blog/views/comments/add_failure.ctp
Kalau tidak berjaya save, ada kemungkinan User tidak memasukkan field dengan
betul. Baris 4 hingga 8 akan loopkan kesemua error. Baris 6 ialah fungsi CakePHP

bernama Inflector::humanize yang akan mengubah value seperti poster_name

menjadi Poster Name
Saya menggunakan Element kerana fail yang sama akan digunakan oleh Post
View method dan juga Comment Add method. Untuk mengurangkan pengulangan
kod, saya akan gunakan elemen. Di bawah ini adalah Elemen untuk paparkan
komen.
/blog/views/elements/comment.ctp
Saya menggunakan banyak inline CSS untuk mendapatkan view seperti di bawah.

Kemudian, cipta fail Element untuk reply.ctp di dalam folder yang sama. Elemen
ini akan memaparkan HTML Form untuk User hantar komen untuk setiap Post.

/blog/view/elements/reply.ctp
Ajax Form digunakan di baris 3 hingga 8. Rujukan,

http://book.cakephp.org/view/208/AJAX .
Update => ‘post_comments’

Akan update DOM ID bernama ‘post_comments’ setelah AJAX berjaya diproses
Indicator => ‘loader’
Bermaksud, semasa proses Ajax sedang di jalankan, Ajax Form akan paparkan
DOM ID bernama ‘loader’ untuk menunjukkan proses sedang dijalankan.

Saya menggunakan image bernama loader.gif yang diletak di

/blog/webroot/img/loader.gif. Image ini berfungsi sebagai ‘loader’ indicator
untuk proses Ajax.
Download image loader dari website http://ajaxload.info dan save

sebagai /blog/webroot/img/loader.gif

Akhir sekali sudah tiba masanya saya ubahsuai kod untuk Post View di
/blog/views/posts/view.ctp
/blog/views/posts/view.ctp
Letak kod di atas selepas fieldset yang paparkan kandungan Post dan sebelum
Back Link.
Ubahsuai Post Controller untuk dapatkan nilai $comments untuk Post tersebut.
Baris 79 – 81 , /blog/controllers/posts_controller.php
Baris 80 ialah Magic Find untuk senaraikan Comments berdasarkan Post Id

Mari kita uji sistem Ajax Comment. Buka aplikasi Blog anda dan View salah satu
Post anda.
Reply Form akan terpapar di bawah maklumat Post. Cuba anda klik button Add
Comment tanpa mengisi apa-apa data.
Loader indicator akan berfungsi setelah anda klik butang Add Comment.
Form Error akan dipaparkan berserta dengan mesej.
Sekarang cuba masukkan komen dengan lengkap

Klik Add Comment
Komen akan terus dipaparkan dan mesej turut diberikan. Saya juga sembunyikan
Form Reply jika komen berjaya dihantar.
Kira jumlah Comment untuk setiap Post

Saya ingin mendapatkan jumlah Comment untuk setiap Post di dalam Blog. Untuk
itu , saya akan gunakan khidmat Afterfind Callback di dalam Post Model. Tambah
kod berikut di dalam Post Model,
Tambah 2 method ( afterFind dan getCommentCount ) di dalam

/blog/models/post.php . Field baru bernama comment_count akan terhasil secara
automatik dan akan beri nilai jumlah komen.
Saya juga perlu membuat Plural Helper untuk menentukan ayat comment perlu
plural atau singular berdasarkan jumlah Comment.
Save sebagai /blog/views/helpers/plural.php
Ubah Post Index dan Post View untuk masukkan nilai jumlah Comment

Baris 22 – 26, /blog/views/posts/index.ctp
Baris 20, /blog/views/posts/view.ctp
Paparan Post Index sekarang mempunyai nilai jumlah Comment

Seterusnya, saya akan membuat method di dalam Sidebar Helper untuk paparkan
10 komen terakhir.
Tambah Text Helper di dalam Sidebar Helper
Tambah method getLatestComment($latest_comments = null)
/blog/views/helpers/sidebar.php
Tambah method getLatestComment di dalam Comment Model
/blog/models/comment.ctp

Ubahsuai kod beforeRender() di dalam AppController
Baris 60 dan 63, /blog/app_controller.php
Akhir sekali, ubahsuai Default Layout untuk memanggil Sidebar-

>getLatestComment()
Baris 77, /blog/views/layouts/default.ctp

Refresh aplikasi blog anda dan di sebelah kanan akan terpapar senarai Comment
terkini.
Link setiap Latest Comments akan pergi ke Post View berdasarkan $id Post.
Untuk Admin Comment pula, saya akan menggunakan $scaffold = ‘admin’ seperti
yang dilakukan kepada Controller User. Untuk itu, tambah kod beforeRender() di
dalam Comment Controller di /blog/controllers/comments_controller.php
/blog/controllers/comments_controller.php

Saya ingin senaraikan Comment terkini dahulu, jadi saya akan tambah var $order
di dalam Comment Model seperti berikut :
Baris 4, /blog/models/comment.php
Dan akhir sekali, saya perlu menambah link ke Manage Comment di Helper
Sidebar
Baris 64 – 67, /blog/views/helpers/sidebar.php

Klik link Manage Comment
Admin untuk Comment.
Dengan adanya Admin untuk Comment, anda boleh moderate komen-komen yang
datang dari User.

Filter Data dari User
URL : http://book.cakephp.org/view/153/Data-Sanitization
Saya akan gunakan Sanitize Helper untuk menapis data-data yang diterima dari
User melalui sistem Comment
Bayangkan User anda cuba memasukkan kod Javascript di dalam ruangan Content.
Jika sistem Blog saya tidak menapis kod HTML tersebut,Popup Javascript akan
execute dan menganggu sistem Blog.
Untuk itu, saya akan gunakan Sanitize. Import Sanitize sebelum class
CommentController, seperti berikut
Kemudian, untuk menapis kesemua data dari $this->data, letak kod seperti berikut,

Naris 30 akan menapis kesemua data dari HTML Form. Hasilnya,di dalam sistem,
kod Javascript di atas akan berupa seperti berikut :
Jika anda tidak mahu menggunakan sanitize, anda boleh juga gunakan fungsi h()
seperti
<?php echo h($variable); ?>
h() adalah short form untuk HtmlSpecialChars()
Email Webmaster jika User Post Comment

Saya menggunakan Streamyx semasa membuat tutorial blog ini dan saya ingin
menguji sistem penghantaran Email dari dalam aplikasi Blog. Untuk itu, saya akan
gunakan Email Component di dalam Comment Controller,
Baris 7 , /blog/ontrollers/comments_controller.php
Setelah itu, saya akan bina satu action bernama admin_email() di dalam Comment
Controller
Setelah itu, saya kan ubahsuai action add() supaya menghantar Email kepada saya
jika ada Comment baru.

Baris 35 – 38, /blog/controllers/comments_controller.php
Kemudian, saya akan menguji dengan menghantar satu komen di dalam blog.

Setelah itu saya akan periksa akaun Gmail
Dengan menggunakan Email Component, saya dapat menghantar report dengan

mudah sekali.
Target untuk tutorial seterusnya
1. Membuat Captcha sendiri untuk prevent Spam dalam Comment

2. Advanced Multiple Validation untuk Comment

3. Category untuk Post
4. RSS Export untuk Post
5. Tag untuk Post
Scaling CakePHP guna Cache Helper

 Bab ini hanya sesuai untuk System Administrator dan juga performance
tuner
Membuat website dynamic menyebabkan banyak panggilan data ke database

dilakukan dan akhirnya menyebabkan aplikasi dynamic loading data lebih perlahan
dari website statik. Untuk itu saya akan satu senario untuk optimizekan panggilan
data di dalam CakePHP
Action scaling adalah untuk menguji prestasi CakePHP untuk mengeluarkan data.
Untuk itu bina satu action bernama scaling dalam Post Controller. Pastikan method
scaling diletak dalam senarau Auth Allow di baris 18.
Buka alamat http://localhost/cake_projects/blog
Anda akan nampak debug yang mengatakan 3 SQL query akan dilaksanakan dan
mengambil masa 55 milisaat. Arahan DESCRIBE hanya dilaksanakan jika
aplikasi CakePHP dijalankan dalam mode DEBUG = 1,2 atau 3. Jika DEBUG di
setkan sebagai 0, ianya bermaksud untuk Production dan arahan Describe tidak
akan dilaksanakan.

Apache Bench
URL ; http://www.petefreitag.com/item/689.cfm
Running AB di dalam mesin yang sama sebenarnya tidak digalakkan

disebabkan keputusan yang kurang tepat. Lebih baik jika anda mempunyai PC
lain, install XAMPP dan cuba run AB menggunakan IP server pc yang running
Blog
Memperkenalkan Apache Benchmark. Utiliti untuk membuat simulasi user

requests di dalam sistem kita. Bagaimana kita nak tau prestasi aplikasi blog jika 10
orang user membuat 1 request ke action Post Scaling ? Untuk itu, anda perlu
menggunakan Apache Bench atau ab.
Sila masuk ke folder c:\xampp\apache\bin\ menggunakan MS-DOS Prompt.
Untuk menguji ab, sila taip ab –help

Simulasi 1 user buat request ke http://localhost/cake_projects/posts/scaling selama

10 saat
Arahan : ab –kc 1 –t 10 http://localhost/cake_projects/posts/scaling
-kc bermaksud Keep Alive dan mewakili 1 user

-t masa dalam saat
Dalam report di atas, 1 user berjaya membuat 0.97 request sesaat,

Cuba ubah –t 10 ke –n 100 ( untuk test 1 user membuat 100 connection ke

aplikasi )
Hasil di atas menunjukkan 98 failed request untuk 1 user membuat 100 request. Ini
bermaksud server tidak dapat menampung request dari user.
Seterusnya, saya akan membuat perbandingan antara CakePHP di antara 2 server,
- Windows Vista 1.5GB RAM running XAMPP

- Linux CENTOS 12GB RAM running LAMP
Page yang akan saya bandingkan ialah fresh CAKEPHP 1.2.5 installation

Ujian pertama : running 1 user selama 1 minit ( 60 secs ) di dalam Windows Vista
Windows Vista XAMPP dapat membuat 11,574 request dengan kelajuan 192.9
request sesaat.

Seterusnya ujian ke atas server Linux pula
Linux CENTos 5.4 LAMP dapat membuat 50,000 request dengan kelajuan
5718.31 request sesaat.
Hasil ujian
Machine Total Request Req/secs

Vista 1.5GB RAM 11,574 192.9
Linux 12GB RAM 50,000 5718.31

Jelas di sini, prestasi server menjadi peranan penting dalam menentukan aplikasi
boleh scaling atau tidak. Deploy aplikasi yang mempunyai high traffic users
sepatutnya di server Linux.
Bayangkan jika SQL yang tidak perlu dilaksanakan dalam aplikasi, ia akan
menyebabkan server mempunyai burden yang lebih. Untuk itu, kita kembali ke
fungsi Post Scaling yang kita bina sebentar tadi
Masa yang diperlukan untuk return semua Post menggunakan find(‘all’);
Buka http://localhost/cake_projects/blog/posts/scaling
Hasil di browser : (default) 12 queries took 64 ms
Cuba guna ab untuk menguji 10 user membuka page yang sama

Arahan : ab -kc 10 -t 10 http://localhost/caje_projects/blog/posts/scaling
566 request berjaya dibuat dalam masa 10 saat
Saya akan mengubah panggilan ke database dengan mengurangkan database

relation kepada -1
Baris 23, sila tambah $this->Post->recursive = -1
Hasil carian di browser akan cuma return objek Post sahaja tanpa Comment.

Dengan menjadikan $this->Post->recursive = -1, saya berjaya menaikkan kadar

request daru 543 sesaat ke 597 sesaat.
Seterusnya saya ingin menggunakan Cache Helper yang didatangkan dengan

CakePHP 1.2.5. Saya perlu enable dahlia cache di dalam /blog/config/core.php
Baris 83, /blog/config/core.php
Masukkan Cache Helper dalam Post Controller
Baris 10, /blog/controllers/posts_controller.php

Tambah $this->cacheAction = true, di dalam method scaling()
Baris 22, /blog/controllers/posts_controller.php
Cuba refresh kembali page Scaling di

http://localhost/cake_projects/blog/posts/scaling dan hasilnya
Query dikurangkan dan masa diambil hanya 12ms dari 66ms sebelum Cache
diaktifkan. Seterusnya buat AB test dengan parameter 10 concunrrent user

Saya berjaya menaikkan request ke 602 dari 543 setelah cache dihidupkan.
Seterusnya saya akan hantar nilai $posts dari Action ke View. Cipta 2 fail berikut
- /blog/views/elements/scaling.ctp
- /blog/views/posts/scaling.ctp
Save sebagai /blog/views/elements/scaling.ctp
Save sebagai /blog/views/posts/scaling.ctp
Mari kita uji Action Scaling dengan 2 kondisi, cache => false dan cache=> true.
Hasilnya di browser adalah seperti berikut :

69 ms jika Cache => false
16 ms jika Cache => true
Jika saya browse menggunakan windows explorer di folder

/blog/tmp/cache/views , fail element_cache_scaling adalah hasil caching elemen
scaling di dalam view Scaling. Ini bermaksud, CakePHP berjaya cache elemen
tersebut.
Element Caching amat penting untuk mengurangkan load masa yang diperlukan
untuk serve page tersebut.

Seterusnya saya akan membuat AB bench dengan nilai yang lebih besar
Arahan : ab –kc 1000 –t 120 http://localhost/cake_projects/blog/posts/scaling
Model
Controller
Element

Hasil : 6506 requests untuk 100 user concurrency dalam masa 120 saat
Hasil jika Cache untuk Model , Controller dan Element = FALSE
Arahan : ab –kc 1000 –t 120 http://localhost/cake_projects/blog/posts/scaling
Hasil : 6414 requests untuk 100 user concurrency dalam masa 120 saat
Perbezaan request sebelum dan selepas cache : 92 request.
Ini bermaksud, jika Cache digunakan dengan betul, sistem anda dapat melayan 92
request lagi. Tetapi ujian ini dilakukan di dalam mesin laptop Windows dan result
mungkin berbeza. Untuk meningkatkan lagi prestasi aplikasi blog, anda juga perlu
tahu ilmu berikut
- Gunakan LightHttpd web server

- MySQL High Performance tuning
- Dedicated box for Web Server,MySQL with Load Balancer
- Mem Cached

XAMPP for Windows didatangkan dengan perisian analisis Webalizer. Pergi ke

alamat http://localhost dan klik menu Webalizer di sebelah kiri

Hasil dari ujian AB stress test, webalizer merekodkan 105,382 hits
Mengecilkan saiz page ( dan melajukan loading )
Cuba klik menu Tools -> Page Info
Hasilnya saiz page anda ialah 6.24 KB

Untuk mengecilkan lagi saiz setiap page di dalam aplikasi Blog, buka App
Controller dan tambah kod berikut sebelum permulaan Class
Baris 1 – 9, /blog/app_controller.php
Kod di atas akan melaksanakan Gzip Compression jika debug di dalam

/app/config/core = 0. ( Untuk production )
Cub refresh Aplikasi Blog dan lihat semula Page Info
Hasilnya 1.56 KB sahaja, dan 75% saiz dapat dikecilkan dan data dapat disalurkan
75% lagi cepat.

Menjadi Pembangun CakePHP Bazet

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Menjadi Pembangun CakePHP Bazet

Uploaded by

Copyright:

Available Formats

Menjadi Pembangun CakePHP ~ Azril Nazli Alias ( azril.nazli@gmail.

Menjadi Pembangun CakePHP

Kerjaya : Trainer PHP/MySQL, CakePHP, Linux System Administration, E

Pengalaman Programming : Sejak 1998

Tarikh : 1 January 2010

Membina Aplikasi Blog menggunakan CakePHP 1.2.5 di dalam Persekitaran Windows

Menjadi Pembangun Laman Web Open Source

Tugas-tugas am pembangun laman web adalah seperti berikut

1. Memahami kehendak pelanggan dan membantu mereka membuat URS

Membina Aplikasi Blog menggunakan CakePHP 1.2.5 di dalam Persekitaran Windows

Membina laman web menggunakan framework akan menjimatkan masa anda

Bagaimana untuk menjadikan elemen kegembiraan wujud di dalam dunia

Membina Aplikasi Blog menggunakan CakePHP 1.2.5 di dalam Persekitaran Windows

Memperkenalkan CakePHP Framework

1. Convention over Configuration ( sila google term ini )

Secara teknikalnya, CakePHP ialah

“ CakePHP is a rapid development framework for PHP which uses commonly

Membina Aplikasi Blog menggunakan CakePHP 1.2.5 di dalam Persekitaran Windows

- PHP dan SQL programming

Apa yang kita bina ?

Bayangkan membuat sesuatu yang mengembirakan contohnya buat blog. Blog

1. Senarai posting anda

Teknologi yang terlibat

Membina Aplikasi Blog menggunakan CakePHP 1.2.5 di dalam Persekitaran Windows

Perisian yang perlu anda download

# Kategori Nama URL

2 Text Editor Crimson Text Editor http://www.crimsoneditor.com

3 Version Tortoise SVN http://tortoisesvn.net

4 Ajax ScriptAculoUs http://script.aculo.us

5 Ajax Prototype http://www.prototypejs.org

6 PHP CakePHP 1.2.5 Stable http://www.cakephp.org

Membina Aplikasi Blog menggunakan CakePHP 1.2.5 di dalam Persekitaran Windows

Apa itu XAMPP ?

Membina Aplikasi Blog menggunakan CakePHP 1.2.5 di dalam Persekitaran Windows

Pastikan perkataan ‘Running’ dipaparkan disebelah Apache dan MySql

Muka hadapan jika anda membuka alamat http://localhost atau http://127.0.0.1 di

Membina Aplikasi Blog menggunakan CakePHP 1.2.5 di dalam Persekitaran Windows

Pengenalan kepada CakePHP Framework

CakePHP menggunakan konsep MVC dalam pembinaan laman web. MVC

Apa itu Model ?

Membina Aplikasi Blog menggunakan CakePHP 1.2.5 di dalam Persekitaran Windows

Apa itu Controller ?

Apa itu View ?

Membina Aplikasi Blog menggunakan CakePHP 1.2.5 di dalam Persekitaran Windows

Struktur direktori Projek CakePHP

Contoh Struktur folder projek bernama Engineering di dalam CakePHP. CakePHP

Engineering/ ~ mewakili nama projek

Engineering/app/ ~ folder aplikasi utama untuk projek Engineering

Engineering/app/config/ ~ menyimpan fail konfigurasi untuk sistem seperti

Engineering/app/controllers/ ~ menyimpan fail-fail Controller

Engineering/app/locale/ ~ menyimpan fail terjemahan i18ln

Membina Aplikasi Blog menggunakan CakePHP 1.2.5 di dalam Persekitaran Windows

Engineering/app/models/ ~ menyimpan fail-fail Model

Engineering/app/plugins/ ~ menyimpan fail-fail untuk Plugin

Engineering/app/tests/ ~ menyimpan fail-fail untuk Unit Test

Engineering/app/tmp ~ folder sementara. Perlu writable

Engineering/app/vendors/ ~ folder untuk menyimpan 3r party vendor script.

Engineering/app/views/ ~ folder untuk menyimpan views untuk setiap action

Engineering/app/webroot ~ folder untuk public dan menyimpan fail-fail untuk

Engineering/cake ~ folder untuk libray core CakePHP.

Install CakePHP di dalam XAMPP

Membina Aplikasi Blog menggunakan CakePHP 1.2.5 di dalam Persekitaran Windows

Klik Download 1.2.5 Stable