What is the developer tool box used for in browsers?

curious because it’s just there

It let’s you execute Javascript code directly in your browser in the context of the page you are viewing. It also let’s you see the source code of the page, all the resources being utilized, and record the network / communication activity in real time.

I was doing some webscraping recently which involved pages requiring logins, and it was the only way I could track down all of the different .js resources being used by the website, and the different get/post authentication requests being sent to various servers. I’m sure there are other ways to do it, but the Chrome developer tool gave me the detail I needed to understand what the browser was doing.