Browser Developer Tools

Web developers frequently need to see what's happening 'under the hood' on a website. The Browser Developer Tools (also called the “DevTools”, the “Inspector”, or the “Console”) give you that power.

The DevTools are awesome for seeing how a webpage is working, and testing out code. 👍🏿

The Devtools are safe It’s impossible to do any permanent damage to a website from the DevTools.

None of the changes you make in the DevTools are permanent. It’s a safe space to experiment. If something goes wrong, you can refresh 🔁 the page and get back to the original.

You can read more on MDN about:

Try it: Devtools Scavenger hunt

In this Scavenger Hunt, you’ll use the DevTools to view and edit properties of a webpage. You’ll get to explore for yourself what a webpage is made of, and practice using the tools that real web developers use to debug websites.

⚠️ If you get stuck on this assignment, watch the video below to see how to solve each clue.

Scavenger Hunt Solution Video