Web Development

  Homes arrow Web Development arrow Page 2 - Firebug Firefox Extension Review
 Webmaster Tools
 
Base64 Encoding 
Browser Settings 
CSS Coder 
CSS Navigation Menu 
Datetime Converter 
DHTML Tooltip 
Dig Utility 
DNS Utility 
Dropdown Menu 
Fetch Content 
Fetch Header 
Floating Layer 
htaccess Generator 
HTML to PHP 
HTML Encoder 
HTML Entities 
IP Convert 
Meta Tags 
Password Encryption
 
Password Strength
 
Pattern Extractor 
Ping Utility 
Pop-Up Window 
Regex Extractor 
Regex Match 
Scrollbar Color 
Source Viewer 
Syntax Highlighting 
URL Encoding 
Web Safe Colors 
Forums Sitemap 
Weekly Newsletter
 
Developer Updates  
Free Website Content 
 RSS  Articles
 RSS  Forums
 RSS  All Feeds
Write For Us 
Contact Us 
Site Map 
Privacy Policy 
Support 
 USERNAME
 
 PASSWORD
 
 
  >>> SIGN UP!  
  Lost Password? 
WEB DEVELOPMENT

Firebug Firefox Extension Review
By: Joe Eitel
  • Search For More Articles!
  • Disclaimer
  • Author Terms
  • Rating: 4 stars4 stars4 stars4 stars4 stars / 3
    2008-11-26

    Table of Contents:
  • Firebug Firefox Extension Review
  • Features
  • Use
  • Conclusion

  • Rate this Article: Poor Best 
      ADD THIS ARTICLE TO:
      Del.ici.ous Digg
      Blink Simpy
      Google Spurl
      Y! MyWeb Furl
    Email Me Similar Content When Posted
    Add Developer Shed Article Feed To Your Site
    Email Article To Friend
    Print Version Of Article
    PDF Version Of Article
     
     

    SEARCH DEV MECHANIC

    TOOLS YOU CAN USE

    advertisement

    Firebug Firefox Extension Review - Features


    (Page 2 of 4 )

    If you enjoy clicking the “OK” button 40,000 times a day due to “alert debugging,” then Firebug is not for you. If that routine’s grown old, you’ll enjoy Firebug’s ability to log messages from JavaScript in your web page directly to the console.

    It is a very well known fact that many programmers have trouble with JavaScript. Firebug enables programmers to stop JavaScript and inspect and study it line by line. Another very interesting aspect of Firebug is that sometimes you don't  choose to use the debugger; sometimes the debugger chooses you! Firebug gives you the option to break into the debugger automatically when an error occurs so you can examine the less-than-stellar conditions that got you into trouble in the first place.

    While debugging, you often want to see the value of complex expressions or objects that are buried in the DOM. Firebug allows you to type in an arbitrary JavaScript expression whose value will be updated every time you step in the debugger.

    There is also no longer a need to use debugger from other programs or services as Firebug comes equipped with a simple, lightweight way to set breakpoints in your scripts and examine every step of execution. Many web applications are comprised of a massive amount of files, and finding the specific file you want to debug can be a tedious chore. Firebug's script file chooser sorts and organizes files into very clean, organized and easily-accessed list that will help you find any file you are seeking in a snap.

    After spending a ridiculous amount of time programming a web page, the last thing a programmer wants to see is errors in the file product. With Firefox, you won’t mind seeing errors at all because the program allows you to clearly view them before publication. Firebug adds a small icon to the Firefox status bar which tells you if the page is incorrect. Opening up the Firebug panel allows you to look at the errors that occurred on a specific page -- which is very important, because programs that show all errors at once have a tendency to overwhelm and complicate things even further. Firebug’s new feature means you will never again have to dig through a ridiculously large pile of errors in the JavaScript console window. This feature alone will have programmers declaring their deep and abiding love for Firebug.

    Anyone who has ever programmed anything for a website knows that an unforeseen amount of very detailed and cumbersome work happens behind the curtain of a web page. Thankfully, Firebug comes equipped with inspectors which allow you to stroll through the DOM using the familiar hyperlink model on the web. If you encounter an object reference, all it takes is a simple click to inspect it.

    Every error report has a link on its right side that points to the file and line number where the error occurred. Clicking this link will take you right to the Firebug JavaScript debugger or CSS inspector so that you can start solving the problem right away. Some errors also include the actual snippet of source that contains the error, which is also a link to the original file.

    Two more helpful features include the quick search box and filtering errors. You can filter the Firebug Console to show only the errors and messages that match the text for which you searched. As new rows are added to the console, they will only appear if they match the text in the quick search box. The filtering errors feature enables Firebug to report errors in JavaScript, CSS, or XML files. If you only care about some of these languages, you can uncheck the ones you don't want to see in the Console's options menu.

    Lastly, one more very cool and helpful feature that Firebug offers is magnification. If you find yourself squinting at Firebug's small print, don't press your nose against the monitor. Firebug comes equipped with the ability to temporarily make the font larger. Firebug lets you increase or decrease the size of its fonts to your heart's content. Whether you are new to programming or a seasoned pro, everyone will surely find all of Firebug’s new features incredibly helpful.

    More Web Development Articles
    More By Joe Eitel

       

    WEB DEVELOPMENT ARTICLES

    - On Page SEO for New Domains
    - Improve Your Site`s Speed
    - Safari Books Online Review
    - Creating an Estore From the Ground Up
    - Most Common SEO Mistakes Developers Make
    - Making the Most of Your Titles and Meta Desc...
    - Five Ways Using Flash Can Damage Your Site
    - A Web Designer`s Guide to Colors
    - Use Webstarts to Create a Free Site
    - More Than Just Looks. How Your Web Design C...
    - How to Design Content Pages
    - Mint Review
    - Make Your WordPress Website Look Professional
    - How to Create a Mobile Web Site
    - Meta Tags: Still Useful?

    Developer Shed Affiliates

     



    © 2003-2018 by Developer Shed. All rights reserved. DS Cluster - Follow our Sitemap