mozilla

Dieser Artikel benötigt eine technische Überprüfung.

Dieser Artikel benötigt eine redaktionelle Überprüfung.

Diese Übersetzung ist unvollständig. Bitte helfen Sie, diesen Artikel aus dem Englischen zu übersetzen.

Untersuchen, Bearbeiten und Debuggen von HTML, CSS und JavaScript für Desktop- und Mobilseiten
Firefox Aurora installieren

Was ist neu in Aurora?

Aurora ist eine Vorschauversion von Firefox, welche schon die neusten Funtkionen enthält bevor diese offiziell im Release erscheinen. In der aktuellen Aurora-Version gibt es die folgenden neuen Updates:

Inspektor

Entwerfen

Werkzeuge zum Erstellen von Webseiten und Web Apps.

JavaScript-Umgebung
Ein Texteditor innerhalb Firefox zum Schreiben und Ausführen von JavaScript.
Stilbearbeitung
Betrachten und Bearbeiten von CSS Styles der aktuellen Seite.
Shader Bearbeitung
Ansehen und Bearbeiten der WebGL Vertex/Fragment Shaders.

Untersuchen und Debuggen

Untersuchen, Entdecken und Debuggen von Webseiten und Web Apps.

Web-Konsole
Log-Nachrichten einer Webseite anschauen und mittels JavaScript mit der Seite interagieren.
Inspektor
HTML und CSS einer Seite anschauen und verändern.
JavaScript Debugger
Das JavaScript einer Seite stoppen, schrittweise laufen lassen, untersuchen und verändern.
Netzwerkanalyse
Netzwerkanfragen beim Laden der Seite untersuchen.
Developer Toolbar
Eine Kommandozeile für die Entwickler-Werkzeuge.
3D-Untersuchung
3D-Visualisierung der Seite.

Mobilgeräte

Werkzeuge für die Entwicklung mit Mobilgeräten.

App-Manager
Designen und Entwickeln von Apps für Firefox OS.
Firefox OS Simulator
Starten und Debuggen Sie Ihre Firefox OS App auf dem Desktop ohne ein echtes Firefox OS Handy zu benötigen.
Responsive Design View
Schauen Sie sich an, wie Ihre Webseite oder App in verschiedenen Browser-Größen aussieht ohne, dass Sie die Größe Ihres Browser-Fensters verändern müssen.
Firefox auf Android debuggen
Verbinden Sie die Entwickler-Werkzeuge mit Firefox auf dem Android-Handy.

Performance

Finden und Beheben von Geschwindingkeitsproblemen.

JavaScript Profiler
Finden Sie heraus wo JavaScript Zeit benötigt den Code auszuführen
Paint Flashing Tool
Hebt die neu gezeichneten Flächen einer Seite hervor.
Reflow Event Logging
Untersuchen von Reflow Ereignissen in der Web-Konsole.
Laufzeitanalyse
Untersuchen wie lange Teile der Seite zum Laden brauchen.

Den Browser debuggen

Normalerweise werden die Entwicklerwerkzeuge für Webseiten oder Web Apps verwendet. Es gibt aber auch die Möglichkeit, den Browser als Ganzes zu untersuchen und zu debuggen. Das kann zum Beispiel für die Entwicklung des Browsers selbst oder von Add-ons nützlich sein.

Browser Konsole
Schauen Sie sich die Log-Nachrichten des Browsers selbst und von Add-ons an und führen Sie JavaScript Code im Kontext des Browsers aus.
Browser Toolbox
Verbinden der Entwicklerwerkzeuge mit dem Browser.

Die Entwickler-Werkzeuge erweitern

Die Entwickler-Werkzeuge sind so gebaut, dass es möglich ist diese zu erweitern. Firefox Add-ons haben Zugriff auf die Entwickler-Werkzeuge und auf Komponenten zum Ausbau bestehender Tools sowie zum Hinzufügen neuer Tools. Mit dem Remote Debugging Protokoll ist es möglich, eigene Debugging-Clients und -Server zu entwicklen, um somit Webseiten mit den eigenen Tools zu debuggen.

Remote Debugging Protokoll
Protokoll zur Verbindung der Entwickler-Werkzeuge mit einem Debugging-Ziel, wie zum Beispiel einer Instanz von Firefox oder einem Firefox OS.
Source Editor
Ein eingebauter Code-Editor in Firefox, welcher in Ihr Add-ons eingebunden werden kann.

Siehe auch

Dieser Bereich stellt einige Ressourcen bereit, die nicht vom Mozilla Developer Tools Team zur Verfügung gestellt werden, aber von Webentwicklern viel benutzt werden. Es sind einige Firefox Add-ons aufgelistet, eine komplette Liste befindet sich dennoch in der Kategorie "Webentwicklung" auf addons.mozilla.org.

Firebug
Ein sehr bekanntes und mächtiges Werkzeug für Webentwickler mit einem JavaScript Debugger, HTML und CSS Inspektor und Editor sowie einer Netzwerkanalyse.
DOM Inspector
Untersuchen und Bearbeiten des DOM von Webseiten oder XUL-Fenstern.
Web Developer
Fügt ein Menü und eine Symbolleiste mit verschiedenen Entwickler-Werkzeugen zum Browser hinzu.
Webmaker Tools
Eine Reihe von Tools für Anfänger im Bereich der Webentwicklung.
W3C Validators
Das W3C stellt einige Tools zur Überprüfung des Webseitencodes bereit. Zum Beispiel Gültigkeitsprüfungen für HTML und CSS.
JSHint
Analysiert JavaScript Code.

Werde Teil der Developer Tools Community

Wähle eine der Möglichkeiten, um an der Diskussion teilzunehmen: