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

Question

Kann jemand einige gute Browser-Add-on-Tools/Erweiterungen vorschlagen, die bei der Entwicklung helfen?Ich habe Firebug in Firefox installiert, was sich hervorragend für den Umgang mit CSS, HTML und Javascript eignet;Irgendwelche anderen Vorschläge?

Feuerkäfer

Answer 1

Feuerfuchs:

• Überprüfen Sie dies wenn Sie den DOM-Inspektor überhaupt verwenden
• Messe Es um Ihnen Pixelabstände mitzuteilen (falls Sie das benötigen)
• IE-Ansicht oder Safari-Ansicht um das Testen in anderen Browsern zu erleichtern
• HTML-Validator wenn Ihnen die Validierung am Herzen liegt
• Konsole² um Ihre js-Fehlerkonsole zu verbessern
• Der Javascript-Shell Bookmarklet ist auch praktisch (und schauen Sie sich auch die anderen dort an)

Bearbeiten:Dies ist zusätzlich zum Symbolleiste für die Webentwicklung von anderen erwähnt

Answer 2

Für Firefox:

Feuerkäfer eignet sich hervorragend für Untersuchungen und Entwicklungen.

Symbolleiste für Webentwickler ist auch gut.Hilft wirklich bei CSS- und Seitenlayout-Sachen und vielem mehr.

Ich benutze auch Live-HTTP-Header (Ich glaube, es heißt, aber es befindet sich auf meinem Arbeitscomputer, daher kann ich den Link jetzt nicht finden).Das hat uns bei Caching-Problemen und Ähnlichem geholfen.

Ich beschäftige mich viel mit der Entwicklung von Mobiltelefonen, daher verwende ich auch UserAgent-Umschalter.Sehr hilfreich, um sich als unterschiedliche Mobiltelefone auszugeben.

Ich verwende Firefox normalerweise nur für die Entwicklung und teste nur in anderen Browsern, da die meisten nicht über die umfangreiche Auswahl an Plugins verfügen, die die Entwicklung unterstützen, wie Firefox.

Answer 3

Das andere Must-Have für Firefox ist das von Chris Pederick Symbolleiste für Webentwickler.

Answer 4

Sie sollten unbedingt Safari installieren.Es verfügt über eine Reihe integrierter Tools.Ich verwende es ständig in Kombination mit anderen Browsern.

• Netzwerk-Timeline
• Fehlerkonsole
• Web-Inspektor
• Snippet-Editor

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

Bedenken Sie Folgendes: Es gibt ein separates Menü der obersten Ebene namens Entwickeln.

Answer 5

Opera hat:

Dragonfly (Tools -> Erweitert -> Entwicklertools)

Debug-Menü

UserJS-Methoden zum Abfangen von Dingen

opera:config#CompatMode%20Override zum Erzwingen von Macken oder Standardsmodus

Widgets für Webentwickler

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

Answer 6

Im Falle eines IE können die nächsten Tools hilfreich sein

• Microsoft-Entwicklersymbolleiste - dom|styles-Viewer
• Fiddler HTTP-Debugger - http-Monitor
• Sofortige Quelle - dom|styles-Viewer
• Companion.JS - dom|styles Viewer, erweiterte Fehlerkonsole

Die „uber“-Erweiterung für IE – „Developer Tools“, bereitgestellt als Teil von IE8

Answer 7

Entwicklerkonsole Und DOM-Snapshot für Oper:

http://dev.opera.com/tools/

Das Tolle ist, dass es sich hierbei um Bookmarklets handelt, die mit JS implementiert wurden.Der Blödsinn ist, dass sie das Internetz benötigen.

Answer 8

Feuerfuchs:

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

„Measure It“, um Pixelabstände zu ermitteln (falls erforderlich)

IE View oder Safari View zum einfachen Testen in anderen Browsern

HTML Validator, wenn Ihnen die Validierung am Herzen liegt

Console2 zur Verbesserung Ihrer JS-Fehlerkonsole

Das Javascript-Shell-Bookmarklet ist ebenfalls praktisch (und schauen Sie sich auch die anderen dort an)

Dies ist eine Ergänzung zu der von anderen erwähnten Web Development Toolbar

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

Answer 9

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

1. Web-Entwickler
2. Feuerkäfer
   1. Feuerkeks
   2. FirePHP
   3. Regenbogen
3. TamperData
4. Poster
5. FireFTP
6. Jeden neu laden
7. Selenium-IDE

Answer 10

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

Answer 11

Abgesehen von den bereits erwähnten hervorragenden Tools finde ich Charles äußerst nützlich sein.Vor allem, da ich viel mit Flash Remoting arbeite, was es hervorragend bewältigt.

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 Caching-Informationen enthalten).

Charles kann als Man-in-the-Middle für die HTTP/SSL-Kommunikation fungieren und es Ihnen ermöglichen, den Inhalt Ihrer HTTPS-Sitzungen zu debuggen.

Es ist plattformübergreifend und kostet 50 US-Dollar, es gibt jedoch eine „30-Minuten-pro-Sitzung“-Bewertung, die Sie herunterladen können.

Answer 12

Folgendes verwende ich:

Feuerfuchs:

• DOM-Inspektor:Ich verwende dies mehr als alles andere für die Webentwicklung
• Launchy:zum Öffnen von Websites in anderen Browsern/Apps
• Manipulationsdaten:Dies kann beim Debuggen von GET/POST-Anfragen hilfreich sein
• Symbolleiste für Webentwickler:Dies bietet so viele praktische Funktionen zum Debuggen:die W3C-Validierungstools, integriertes Lineal, Größenänderungstools, Quellmanipulation, einfache Cache-/CSS-/Skript-Tools

IE:

• Internet Explorer-Entwicklersymbolleiste:Bei weitem nicht so praktisch wie Firefox, aber es bietet Ihnen zumindest einen anständigen DOM-Inspektor

Sonstiges:

• Jesses praktische Lesezeichen:Die Hülse Besonders praktisch ist das Bookmarklet
• Ich installiere auch Safari Und Oper, verwenden sie aber meist nur zum Testen und Benchmarking, da ihre Entwicklungstools nicht so robust wie Firefox und nicht so fehlerhaft wie der IE sind.
• Luchs:Ich verwende dies, um sicherzustellen, dass alle JS-lastigen Websites weiterhin funktionieren, sodass ich sicher bin, dass sie für Google, Screenreader und jede andere Bot-ähnliche App gut aussehen.