Debugging Javascript, CSS, HTML and PHP using FireBug and FirePHP

There are number of firefox add-on every webdeveloper love, in which one of the best add-on is firbug.
Fire bug let's you debug your javascript, html, css code. Thinking even more  it' can debug PHP also using FirePHP. It include debugger, error consol and commandline.

After you install  firebug add-on you will see a 'firebug'  in statusbar of firefox .Click on that bug firebug in open for you at bottom of your page.

If you bored using javascript alery(myVar); function for debugging you may use console.log(myVar); like console on most development tools.
Also firbug helps you to inspect each every corner of DOM using your mouse.

Debugging PHP using Firebug, FirePHP


First you need to install firebug add-on then firePHP add-on. Then download FirePHPCore from http://www.firephp.org/  and add FirePHPCore in your PHP 'include' or root or somewhere you like. Include it in you PHP file.
using
require('FirePHPCore/fb.php');
and call fb() function passing a single argument that you need to pass in to Console

try{
        echo "hello";
       }
   (Exception $e) {
    fb($e);
    fb("Error in data ".$foo);
   }
 

FirePHP writes this to console using  HTTP headers – in particular, X-FirePHP-Data headers in the response.
So you need to use ob_start();

This will initialise output buffering, so that any HTML you output is held up till the end of script execution.

Referances

More about Firebug and FirePHP

You can get Firbug Add-on from here  http://getfirebug.com/enable

FirePHP Project     http://www.firephp.org/