Sie sind hier: Wissen
Werbung Werbung

Was ist Firebug ?

Von André Krämer

Die Entwicklung moderner Webseiten ist kein leichtes Unterfangen. Neben den Herausforderungen im serverseitigen Quellcode gilt es auf der Client-Seite, HTML, JavaScript und CSS zu meistern.
Die kostenfreie Firefox Erweiterung Firebug hilft, den Überblick zu bewahren und Fehlern im HTML Quelltext, den CSS Stildefinitionen sowie dem JavaScript Code auf die Schliche zu kommen.
Das unter einer BSD Lizenz stehende Open Source Werkzeug wurde ursprünglich im Jahr 2006 von Joe Hewitt, der zum initialen Firefox Team gehörte, programmiert. Die Weiterentwicklung wird von der Firebug Working Group gesteuert. Das Werkzeug kann über die Mozilla Erweiterungsbibliothek unter https://addons.mozilla.org/de/firefox/addon/firebug/, oder auch direkt unter https://getfirebug.com herunter geladen werden.
Nach erfolgreicher Installation integriert sich Firebug direkt in den Browser. Der Start erfolgt über die Taste F12.
Das Werkzeug zeigt sich nun als eigenes Panel im unteren Bereich des Browserfensters. Über sieben Karteikartenreiter können die Hauptfunktionalitäten des Werkzeugs ausgewählt werden. Der erste Bereich, „Konsole“, ermöglicht es, Ad-Hoc JavaScript Code einzutippen und auf der aktuell dargestellten Internet Seite auszuführen. Außerdem werden in diesem Bereich auch JavaScript- oder netzwerkbezogene Fehlermeldungen des Browsers ausgegeben.
Auf dem Reiter „HTML“ werden alle Knoten des Document Object Models (DOM) in einer aufklappbaren Baumstruktur, ähnlich dem Windows Explorer, dargestellt. Hier hat der Anwender die Möglichkeit, Elemente zu markieren, die anschließend auch sofort auf der gerenderten Seite umrahmt werden. Umgekehrt kann über ein Auswahlwerkzeug auch ein HTML-Element auf der aktuellen Seite ausgewählt werden, welches dann in der Baumstruktur markiert wird. Neben der reinen Selektion kann die Seitenstruktur hier auch direkt editiert werden. Außerdem werden für jedes Element auch die darauf angewandten CSS Stilregeln angezeigt. Auch für diese besteht die Möglichkeit der direkten Bearbeitung.
Auf der Karteikarte „CSS“ können alle CSS-Dateien, die für die aktuelle Seite geladen wurden, ausgewählt, inspiziert und bearbeitet werden.
Analog dazu gibt es den Reiter „JavaScript“. Hier können geladene JavaScript Dateien begutachtet werden. Außerdem bietet sich hier die Möglichkeit, den JavaScript Quelltext zu debuggen. Veränderungen am Code können jedoch nicht vorgenommen werden.
Auf weiteren Reitern können sämtliche Variablen und Methoden des DOM eingesehen, der Netzwerkverkehr analysiert und Cookies begutachtet werden.
Neben den vorgestellten Standardfunktionalitäten gibt es eine Fülle nützlicher Erweiterungen für Firebug, wie zum Beispiel Yahoos Webseiten Analysewerkzeug YSlow.

Beratung & Support

Schulungen zu diesem Thema

 Anfrage für eine individuelle Schulung zum Thema Firebug  Gesamter Schulungsthemenkatalog

Bücher zu diesem Thema

  .NET 9.0 Update: Die Neuerungen in .NET 9.0 gegenüber .NET 8.0
  PowerShell 7 und Windows PowerShell 5 – das Praxishandbuch
  .NET 8.0 Update: Die Neuerungen in .NET 8.0 gegenüber .NET 7.0
  Blazor 8.0: Moderne Webanwendungen und hybride Cross-Platform-Apps mit .NET 8.0, C# 12.0 und Visual Studio 2022
  Moderne Datenzugriffslösungen mit Entity Framework Core 8.0
  C# 12.0 Crashkurs
  Cross-Plattform-Apps mit .NET MAUI entwickeln
  Blazor 7.0: Blazor WebAssembly, Blazor Server und Blazor Hybrid
  C# 11.0 Crashkurs
  Moderne Datenzugriffslösungen mit Entity Framework Core 7.0
  PowerShell 7 und Windows PowerShell 5 – das Praxishandbuch
  App Engineering: SwiftUI, Jetpack Compose, .NET MAUI und Flutter
  Vue.js 3 Crashkurs
  Moderne Datenzugriffslösungen mit Entity Framework Core 6.0
  Blazor 6.0: Blazor WebAssembly, Blazor Server und Blazor Desktop
  C# 10.0 Crashkurs
  Cross-Plattform-Apps mit Xamarin.Forms entwickeln
  Developing Web Components with TypeScript: Native Web Development Using Thin Libraries
  PowerShell – kurz & gut
  C# 9.0 Crashkurs: Die Syntax der Programmiersprache C# für die Softwareentwicklung in .NET 5.0, .NET Core und Xamarin
  ASP.NET Core Blazor 5.0: Blazor WebAssembly und Blazor Server - Moderne Single-Page-Web-Applications
  Windows PowerShell 5 und PowerShell 7: Das Praxisbuch
  Moderne Datenzugriffslösungen mit Entity Framework Core 5.0
  ASP.NET Core Blazor 3.1/3.2: Blazor Server und Blazor Webassembly - Moderne Single-Page-Web-Applications mit .NET, C# und Visual Studio
  ASP.NET Core Blazor 3.0/3.1: Blazor Server und Blazor Webassembly - Moderne Single-Page-Web-Applications mit .NET, C# und Visual Studio
  Moderne Datenzugriffslösungen mit Entity Framework Core 3.1
  C# 8.0 Crashkurs: Die Syntax der Programmiersprache C# für die Softwareentwicklung in .NET Framework, .NET Core und Xamarin
  Moderne Datenzugriffslösungen mit Entity Framework Core 3.0
  Windows PowerShell 5.1 und PowerShell Core 6.1 - Das Praxishandbuch
  Moderne Datenzugriffslösungen mit Entity Framework Core 2.1/2.2
  Moderne Webanwendungen für .NET-Entwickler: Server-Anwendungen, Web APIs, SPAs & HTML-Cross-Platform-Anwendungen mit ASP.NET, ASP.NET Core, JavaScript
  C# 7.3 Crashkurs: Die Syntax der Programmiersprache C# für die Softwareentwicklung in .NET Framework, .NET Core und Xamarin
  Modern Data Access with Entity Framework Core: Database Programming Using .NET, .NET Core, UWP, and Xamarin with C#
  Windows PowerShell und PowerShell Core - Der schnelle Einstieg: Skriptbasierte Systemadministration für Windows, Linux und macOS
  Programmierung in Python
  C# 7.2 Crashkurs: Die Syntax der Programmiersprache C# für die Softwareentwicklung in .NET Framework, .NET Core und Xamarin
  Moderne Datenzugriffslösungen mit Entity Framework Core 2.0/2.1
  Effizienter Datenzugriff mit Entity Framework Core: Datenbankprogrammierung mit C# für .NET Framework, .NET Core und Xamarin
  Moderne Datenzugriffslösungen mit Entity Framework Core 2.0
  Windows PowerShell 5 und PowerShell Core 6 - Das Praxishandbuch
  Angular - Das Praxisbuch zu Grundlagen und Best Practices
  Moderne Datenzugriffslösungen mit Entity Framework Core 1.0, 1,1 und 2.0
  Moderne Datenzugriffslösungen mit Entity Framework Core 1.0, 1,1 und 2.0
  Moderne Datenzugriffslösungen mit Entity Framework Core 1.1 und 2.0-Preview2
  Moderne Datenzugriffslösungen mit Entity Framework Core 1.x und 2.0
  Moderne Datenzugriffslösungen mit Entity Framework Core 1.x und 2.0
  Introducing Regular Expressions: JavaScript and TypeScript
  Introducing Web Development
  Introducing Bootstrap 4
  Programming Web Applications with Node, Express and Pug
  Einführung in TypeScript: Grundlagen der Sprache TypeScript 2
  Pug – Die Template-Engine für node.js
  Web-Programmierung mit Node, Express und Pug
  Windows PowerShell 5 – kurz & gut
  Moderne Datenzugriffslösungen mit Entity Framework Core 1.1
  Windows PowerShell 5.0 - Das Praxishandbuch
  PHP 7 und MySQL: Von den Grundlagen bis zur professionellen Programmierung
  Windows Scripting Lernen
  .NET Praxis - Tipps und Tricks für .NET und Visual Studio
  Grundlagen für Web-Entwickler: Protokolle, HTML und CSS
  Bootstrap 3 - Stile und Komponenten
  Bootstrap 4 - Stile und Komponenten
  Einführung in JavaScript: ECMAScript 5
  Einführung in node.js
  express – Middleware für node.js
  JADE – Die Template Engine für node.js
  Reguläre Ausdrücke in JavaScript
  Moderne Datenzugriffslösungen mit Entity Framework 6
  C++ Standardbibliothek
  AngularJS: Moderne Webanwendungen und Single Page Applications mit JavaScript
  Microsoft SharePoint Server 2013 und SharePoint Foundation: Das umfassende Handbuch
  SQL Server 2014 für Professionals: Hochverfügbarkeit, Cloud-Szenarien, Backup/Restore, Monitoring & Performance
  Moderne Webanwendungen mit ASP.NET MVC und JavaScript
  Windows PowerShell 4.0 - Das Praxishandbuch
  JavaScript: Das umfassende Handbuch, inkl. HTML5, JavaScript-Frameworks, jQuery, OOP
  C++11 für Programmierer
  C++ kurz und gut
  Microsoft ASP.NET 4.5 - Entwicklerbuch
  Moderne Webanwendungen mit ASP.NET MVC
  Verteilte Systeme und Services mit .NET 4.5
  Scripting mit Windows PowerShell 3.0 - Der Workshop: Skript-Programmierung mit Windows PowerShell 3.0 vom Einsteiger bis zum Profi
  Windows 8 für Administratoren
  Windows 8.1 - Das Handbuch (27. November 2013)
  Windows Store Apps entwickeln mit C# und XAML - Crashkurs
  .NET 4.5 Update
  Windows Scripting Lernen
  WPF 4.5 und XAML
  Datenbankprogrammierung mit .NET 4.5
  C++11: Der Leitfaden für Programmierer zum neuen Standard
  Verteilte Systeme und Services mit .NET 4.0
  Microsoft ASP.NET 4.0 mit C# 2010 - Entwicklerbuch
  Agile Software Engineering with Visual Studio
  Datenbankprogrammierung mit .NET 4.0. Mit Visual Studio 2010 und SQL Server 2008 R2
  Microsoft SharePoint Server 2010 und SharePoint Foundation 2010
  Microsoft SQL Server 2008 R2 - Das Entwicklerbuch
  Microsoft Viusal C# 2010
  Office 2010 Programmierung mit VSTO und .NET 4.0: Word, Excel und Outlook erweitern und anpassen
  Programmieren mit dem ADO.NET Entity Framework
  .NET 4.0 Crashkurs
  Visual Basic 2010: Grundlagen, ADO.NET, Windows Presentation Foundation
  .NET 4.0 Update
  Windows PowerShell 2.0 - Das Praxishandbuch
  Windows 7 im Unternehmen
  Agile Muster und Methoden
  Ajax
  ASP.NET 4.0
  ASP.NET 4.0 mit Visual C# 2010
  JavaScript
  PHP 5-Migration
  Scripting mit Windows PowerShell 2.0 - Der Einsteiger-Workshop
  SQL Server 2008 R2: Das Programmierhandbuch. Inkl. ADO.NET 3.5, LINQ to Entities und LINQ to SQL
  Visual Basic 2010
  Windows PowerShell 2.0 - Crashkurs
  Windows Server 2008 R2
  Windows Scripting
  Windows Scripting Lernen
  Data Mining mit Microsoft SQL Server
  Windows 7 für Administratoren
  Microsoft ASP.NET 3.5 mit Visual Basic 2008 - Entwicklerbuch
  .NET 3.5
  Essential PowerShell
  .NET 3.5 Crashkurs
  Webanwendungen mit ASP.NET 3.5 und AJAX Crashkurs
 Alle unsere aktuellen Fachbücher  E-Book-Abo für ab 99 Euro im Jahr