freeCodeCamp/guide/english/developer-tools/developer-tools-in-browsers/firefox-developer-tools/index.md

1.1 KiB

title
Firefox Developer Tools

Firefox Developer Tools

Firefox Developer tools aid web developers with writing, analyzing, and debugging HTML, CSS and Javascript code.

Core Features:

  • Inspector: View and edit page content and layout.
  • Console: See javascript console.log() messages and errors
  • Debugger: View and modify JavaScript running on a page
  • Network: See network requests made when pages are loaded
  • Performance: Analyze computer resources used by the site
  • Responsive Desing Mode: Shows how your website will behave on different device

Accessing Developer Tools

In the menu bar at the top of the screen select Tools > Web Developer > Web Console.

You can also bring up Developer Tools by right-clicking on any element on a web page and selecting "Inspect Element" from the options.

The tools will appear on the bottom; however, if you like you can dock them on the left or right the screen, or you can have them appear as a separate window altogether.

More Information: