10 Popular Firefox Add-ons for Web Developers

Ini adalah post saya yang ke 100!

Nak kongsi sikit je perkara, kepada mereka yang jadi web-based system developer, dan suka sangat gunakan firefox untuk testing method, ada benda menarik yang nak share...

Kalau anda semua nak tau, dengan firefox, ada banyak benda yang kita boleh install sebagai "Add-on" untuk firefox browser kita ni,, Dengan adanya firefox ni, kite boleh ubah macam2 benda dan setting untuk memastikan yang firefox kita ni sentiasa stabil dan berfungsi untuk membantu kita selain daripada fungsi asalnya sebagai browser, Add-on yang kita install sebenarnya boleh kita utilize sebagai alat untuk membantu kita membina sistem yang kita nak. Personally, untuk firefox yang saya gunakan, ada lebih dari sepuluh add-on yang kerjanya samada block script, block advertisement, check css, check javascript dan sampailah kepada benda suka-suka iaitu tukar warna tema firefox anda.

Berikut adalah 10 Add-On yang boleh anda gunakan untuk membantu anda sebagai seorang pembangun perisian berasaskan web...

1. Firebug

With Firebug, you can edit the CSS, HTML, and JavaScript on any web page live without navigating to a different application. Changes can be made and previewed in real-time. The add-on also comes with network activity analysis tools and a JavaScript performance profiler. Like the Firefox browser itself, Firebug can be extended with plug-ins that add new features.

2. Web Developer


The Web Developer add-on is the most powerful and dynamic extension in this list; it adds a toolbar that lets you do numerous useful things.
You can disable Java, disable or view cookies, disable CSS, view styles, see detailed information on forms, disable images, find broken images, view JavaScript, display all kinds of behind-the-scenes information, edit HTML, show hidden elements, resize the window to a specified resolution, validate code and much more.

3. ColorZilla

ColorZilla is a color picker that lives down in your browser’s status bar. Just click the ColorZilla button and move the cursor over the color you want to find out about; you’ll be given a reading that includes the color’s RGB values and the hexadecimal code you need to duplicate the color on your own site. ColorZilla also includes a color wheel, a page zoomer and a measuring tool.

4. HTML Validator

HTML Validator appears as an icon in the status bar, and displays the number of HTML errors Firefox encountered when opening up a web page. You can then dive into the HTML code to investigate what caused the errors.

5. FireFTP

FireFTP is an adequately featured FTP (File Transfer Protocol) client that runs inside Firefox. When you execute it, it appears as an extra window just like Firefox’s bookmark or download managers. Features aren’t just limited to the basics; you can perform integrity checks or searches, sync directories while navigating, compare directories and so on. This add-on should meet the needs of the majority of FTP users.

6. IE Tab

Microsoft’s Internet Explorer web browser is barely used by web developers, but it’s the most popular browser in the world at large. With IE Tab you can open any website in a tab that’s actually running IE instead of Firefox. That way, you can more easily make sure your website runs correctly for millions of people who aren’t using Firefox.

7. MeasureIt

With MeasureIt, you can draw a rectangular ruler anywhere on the website to get the measurements (height and width) in pixels of any element or space. Similar functionality is offered by ColorZilla, so running both add-ons at the same time would be redundant, but this plug-in is nevertheless hugely popular.

8. Greasemonkey

Greasemonkey allows more advanced customization of your browser by executing custom JavaScript scripts that change the way websites are displayed. Hundreds of scripts are available, and many of them are tailored to specific websites. For example, we’ve covered the Facebook Friends Checker script in the past; it monitors your friends list when you’re logged in to Facebook and notifies you when one has been removed.

9. View Source Chart

When you look at the source for a web page using Firefox’s normal tools, you’re given a massive block of barely-organized text; it’s not very easy to scan and look for something specific. View Source Chart displays a web page’s source code in a set of smartly divided, colored partitions. It visually represents tag boundaries and DOM structure so you can navigate efficiently without getting lost in the noise.

10. Aardvark

Use Aardvark to select elements on a website and perform any one of a broad selection of functions on them. You just click on an element and hit one of several keyboard shortcuts. Possibilities include hitting R to remove the element, W to widen it, I to isolate it or V to view the element’s source. Hitting H for “help” brings up a list of all 14 shortcuts.

Ada macam-macam lagi add-ons yang boleh anda gunakan untuk membantu anda,
Anda boleh cari di https://addons.mozilla.org, browse dan gunakan add-on memberi manfaat kepada anda...sebab ada juga add-ons yang takde guna, buat semak je... ;)

No comments:

Post a Comment