Repost dari artikel saya di PC Mild 22/2010

Debugging adalah salah satu tahap yang pasti harus dilalui dalam pembuatan suatu software, termasuk dengan pembuatan sebuah website. Dalam pemrograman website, ada banyak cara untuk melakukan debugging. Namun pada konsepnya, seharusnya debugging itu dipisahkan dari program utama. Bagaimana dengan PHP yang secara default tidak memiliki console?

Salah satu contoh nyata debugging adalah mengetahui nilai dari suatu variable. Jika membuat program pada desktop, dapat dengan mudah dicetak pada console. Namun, terkadang melakukan debugging dalam PHP yang merupakan bahasa pemrograman web dirasa cukup merepotkan. Programmer harus memanggil “echo” atau “vardump” untuk mencetak isi variable ke dalam browser, yang berarti mau tidak mau akan berdampak pada tampilan website.

Tapi ternyata programmer di dunia tidak kehabisan akal. Dengan tool yang akan dibahas pada artikel ini, Anda bisa melakukan debugging PHP dengan menggunakan console. Tidak perlu menginstall komponen server lainnya seperti yang dilakukan pada Xdebug. Anda hanya membutuhkan browser Mozilla Firefox, kemudian menambahkan add-on seperti langkah-langkah di bawah ini.

1. Gunakan browser Mozilla Firefox. Anda bisa mendownloadnya di situs resminya, http://www.mozilla.com. Versi terbaru Firefox saat artikel ini ditulis adalah 3.6.12. (red: sekarang versi 4 sudah release)
   

   Halaman download Mozilla Firefox

2. Install add-on firebug. Anda bisa mendownloadnya dengam membuka website resminya di http://getfirebug.com atau dengan fasilitas install add-on secara langsung pada menu Tools->Add-ons. Pilih get add-ons, lalu search add-on firebug dan pilih download. Setelah proses instalasi, browser harus direstart agar add-on bisa berjalan.
   

   Halaman download Firebug

3. Setelah firebug terinstall, pada bagian pojok kanan bawah Firefox Anda akan muncul gambar sebuah serangga. Klik gambar tersebut untuk membuka fitur firebug. Sebenarnya cukup dengan menginstall firebug ini, Anda sudah bisa mendebug javascript secara langsung pada console. Cukup menggunakan fungsi di bawah ini.

   console.log();
   console.info();
   console.debug();
   console.warn();
   console.error();

   Masing-masing fungsi hanya berbeda dalam hal penampilannya saja, untuk memudahkan pemisahan antara error, warning, atau lainnya. Jangan lupa untuk mengaktifkan (enable) fitur console yang ada pada jendela firebug di bagian bawah.

   

   Tampilan hasil logging

4. Langkah berikutnya adalah menginstall add-on Firephp untuk browser Firefox Anda. Sebaiknya Anda tidak menginstall dengan fasilitas add-on browser Anda, tetapi langsung membuka pada website resminya di http://www.firephp.com. Saat artikel ini ditulis, Firephp firefox extension ada dalam versi 0.5.0. Meskipun belum versi final, tapi versi ini sudah cukup stabil untuk melakukan debugging. Setelah instalasi, sekali lagi Anda harus merestart browser Anda.
   

   Tampilan halaman download FirePHP

5. Setelah itu, untuk bisa debugging PHP dengan firephp ini, Anda harus mendownload script firephp core yang ada di web http://www.firephp.org/HQ/FinalRelease.htm. Versi terakhir saat artikel ini ditulis adalah v0.3.2. Download file tersebut, kemudian extract. File penting didalamnya yang perlu Anda gunakan adalah Firephp.class.php dan fb.php yang terdapat dalam folder lib/FirePHPCore. Kedua file tersebut digunakan untuk PHP versi 5.0 ke atas. Untuk PHP versi 4, Anda bisa menggunakan file dengan nama sama, namun dengan ekstensi php4. Letakkan kedua file tersebut dalam server Anda, dengan lokasi terserah Anda. Misalkan, pada folder htdocs/firephp/fb.php dan htdocs/firephp/Firephp.class.php untuk server XAMPP.
6. Untuk melakukan pengujian, buatlah sebuah file index.php. Perlu diketahui, Anda cukup menggunakan salah satu dari kedua file yang sebelumnya telah dijelaskan. Untuk debugging dengan Object Oriented, gunakan Firephp.class.php. Sedangkan untuk procedural, lebih baik menggunakan method overload pada file fb.php. Jangan lupa untuk mengaktifkan panel net console pada tab firebug untuk mengaktifkan fungsi firephp.

   <?php
   // dengan object oriented
   require_once 'firephp/FirePHP.class.php';
   $firephp = FirePHP::getInstance(TRUE);
   // mengaktifkan firephp
   $firephp->setEnabled(TRUE);
   $firephp->log('Log message OOP');
   // menonaktifkan firephp
   $firephp->setEnabled(FALSE);
   
   // dengan prosedural
   require_once 'firephp/fb.php';
   // mengaktifkan firephp
   FB::setEnabled(TRUE);
   FB::log('Log message prosedural');
   // menonaktifkan firephp
   FB::setEnabled(FALSE);

   Maka tampilan pada console adalah seperti pada gambar.

   

   Hasil debug yang keluar di console

7. Anda bisa mengatur setting firephp lebih lanjut untuk kedalaman array, object filter, line number, error handling, dan sebagainya. Firephp ini juga menyediakan fungsi lain untuk debugging, sama seperti Firebug, yaitu log(), warn(), error(), dan info(). Kelebihannya yang lain adalah bisa debugging table secara langsung, mendeteksi waktu eksekusi, dan debugging dalam group untuk memudahkan mata melihat. Anda bisa mempelajarinya pada tutorial di http://www.firephp.org/HQ/Use.htm.
8. Berhati-hatilah dalam menggunakan Firephp ini, terutama jika Anda akan mempublikasikan website Anda. Jangan lupa untuk memanggil method setEnabled(false) agar Firephp tidak melakukan logging. Akan sangat berbahaya sekali jika client yang mengakses website Anda juga memiliki firefox add-on Firephp, sehingga semua log akan muncul pada browsernya.

Selamat mencoba.

Download source code secara keseluruhanArtikel ini telah dipublikasikan di media cetak tabloid PC Mild edisi 22 tahun 2010 lalu.