Empfehlungen für Browser-Add-On-Tools zur Unterstützung bei der Entwicklung [geschlossen]

Firefox:

• Inspizieren Sie dies , wenn Sie überhaupt den DOM Inspector verwenden
• Messen Sie es , um die Pixelentfernungen anzugeben (wenn Sie das brauchen)
• IE-Ansicht oder Safari-Ansicht zum einfachen Testen in anderen Browsern
• HTML Validator wenn Sie sich für die Validierung interessieren
• Konsole ² zur Verbesserung Ihrer js-Fehlerkonsole
• Das JavaScript-Shell -Bookmarklet ist auch praktisch (und sieh dir auch die anderen dort an)

Bearbeiten: Dies ist zusätzlich zu der von anderen erwähnten Web Development Toolbar >     

Das andere Must-Have für Firefox ist Chris Pedericks Web Developer Toolbar .

Sie sollten unbedingt Safari installieren. Es hat eine Reihe von integrierten Werkzeugen. Ich benutze es immer in Kombination mit anderen Browsern.

• Netzwerkzeitachse
• Fehlerkonsole
• Web-Inspektor
• Snippet-Editor

Außerdem können Sie den Benutzeragenten für Ihre Anforderungen festlegen.

Bedenken Sie, dass es ein separates Top-Level-Menü namens Entwickeln hat.

Opera hat:

Dragonfly (Werkzeuge - & gt; erweiterte - & gt; Entwicklerwerkzeuge)

Debug-Menü

UserJS-Methoden zum Abfangen von Dingen

oper: config # CompatMode% 20Override für das Erzwingen von Macken oder Standards-Modus

Webentwickler-Widgets

Sie können die Quelle der Dateien anzeigen, sie bearbeiten, Änderungen übernehmen und sie erneut aus dem Cache laden.

Bei IE können die nächsten Tools nützlich sein

• Microsoft Developer Toolbar - dom | styles viewer
• Fiddler HTTP-Debugger - http-Monitor
• Sofortige Quelle - dom | styles viewer
• Companion.JS - dom | styles viewer, erweiterte Fehlerkonsole

Die Erweiterung "uber" für IE - "Developer Tools", die als Teil von IE8 bereitgestellt werden

Entwicklerkonsole und DOM-Snapshot für Opera:

Ссылка

Awesome ist, dass diese Bookmarks mit JS implementiert sind. Sauge ist, dass sie das Internetz benötigen.

  

Firefox:

     

Überprüfen Sie dies, wenn Sie überhaupt den DOM Inspector verwenden

     

Messen Sie es, um Pixelabstände anzugeben (wenn Sie das brauchen)

     

IE-Ansicht oder Safari-Ansicht zum einfachen Testen in anderen Browsern

     

HTML-Validator, wenn Ihnen die Validierung wichtig ist

     

Console2 zur Verbesserung Ihrer js-Fehlerkonsole

     

Das JavaScript-Shell-Bookmarklet ist auch praktisch (und sehen Sie sich auch die anderen an)

     

Dies ist zusätzlich zur von anderen erwähnten Web Development Toolbar

Diese Liste von Cebjyre ist fast fertig (da FireBug bereits in der Frage erwähnt wurde). Ich würde nur Tamperdata hinzufügen. Von Zeit zu Zeit ist es sehr nützlich.

Hier sind meine entwicklungsorientierten Add-Ons für Firefox 3 :

1. Webentwickler
2. Firebug
   1. Feuerkoch
   2. FirePHP
   3. Regenbogen
3. TamperData
4. Poster
5. FireFTP
6. ReloadEvery
7. Selenium IDE

YSlow ist ein nettes Firebug-Addon zur Fehlerbehebung bei der Ladezeit einer Seite.

Abgesehen von den ausgezeichneten Tools, die ich bereits erwähnt habe, finde ich sehr nützlich. Zumal ich viel mit Flash Remoting arbeite, das es hervorragend beherrscht.

  

Charles ist ein HTTP-Proxy / HTTP-Monitor / Reverse-Proxy, der es einem Entwickler ermöglicht, den gesamten HTTP-Verkehr zwischen seinem Computer und dem Internet anzuzeigen. Dazu gehören Anfragen, Antworten und die HTTP-Header (die die Cookies und die Caching-Informationen enthalten).

     

Charles kann als Man-in-the-Middle für die HTTP / SSL-Kommunikation fungieren, sodass Sie den Inhalt Ihrer HTTPS-Sitzungen debuggen können.

Es ist crossplatform, kostet $ 50, aber es gibt eine "30 Minuten pro Sitzung" -Evaluation, die Sie herunterladen können.

Folgendes benutze ich:

Firefox:

• DOM Inspector : Ich benutze dies mehr als alles andere für die Web-Entwicklung
• Launchy : zum Öffnen von Websites in anderen Browsern / Apps
• Manipulationsdaten : Dies kann beim Debuggen von GET / POST-Anfragen hilfreich sein
• Web Developer Toolbar : Dies hat so viele praktische Funktionen für das Debugging: Die W3C-Validierungswerkzeuge, das integrierte Lineal und Werkzeuge zur Größenanpassung , Quellenmanipulation, einfache Cache / CSS / Skript-Tools

IE:

• Internet Explorer Developer Toolbar : Nirgends in der Nähe als praktisch wie der Firefox, aber zumindest gibt es Ihnen einen anständigen DOM Inspector

Verschiedenes:

• Jesses handliche Bookmarklets : das shell Bookmarklet ist besonders praktisch
• Ich installiere auch Safari und Opera < Sie werden meistens nur zum Testen und Benchmarking verwendet, da ihre Entwicklungstools nicht so robust wie Firefox sind und nicht so fehleranfällig sind wie IE.
• Lynx : Ich benutze dies, um sicherzustellen, dass JS-schwere Seiten immer noch funktionieren, so dass ich mir sicher bin Sie werden gut aussehen, um Google, Bildschirmleser und andere Bot-ähnliche App.