What are devtools and how they're used in web scraping?

Every modern web browser comes with a special suite of tools for web developers called the Developer Tools (or devtools for short).

This suite contains a lot of powerful tools used in web scraper development that can help to debug and understand how the target websites work.

Devtools can be launched on any website using the F12 key or by right-clicking anywhere on the page and selecting "inspect" option.

devtools inspect right click

To start, the "Elements" tab allows for inspecting the final HTML structure of the page. This can be used to create CSS and XPath selectors for scraping:

devtools elements tab

The "Network" tab (aka the Network Inspector) can be used to inspect the network traffic of the page. This can be used to understand how the website works and discover its backend and hidden APIs:

devtools network inspector tab

One of the most popular features of Network devtools is the ability to export the requests to cURL commands (right click -> copy as curl) that can be converted to scraping code using tools like curlconverter.

Question tagged: HTTP, Data Parsing, XPath, Css Selectors, Hidden API

Related Posts

How to Handle Cookies in Web Scraping

Introduction to cookies in web scraping. What are they and how to take advantage of cookie process to authenticate or set website preferences.

How to Effectively Use User Agents for Web Scraping

In this article, we’ll take a look at the User-Agent header, what it is and how to use it in web scraping. We'll also generate and rotate user agents to avoid web scraping blocking.

How to Scrape in Another Language, Currency or Location

Localization allows for adapting websites content by changing language and currency. So, how do we scrape it? We'll take a look at the most common methods for changing language, currency and other locality details in web scraping.