Today we are going to build a small web scrapper app. This application will be scrapping data from Airbnb website and display it in a nice grid view. We will add a Refresh button that will be able to trigger a new scraping round and update the results. In order to make our app a bit more performant we will utilize the browser local storage to store already scrapped data so that we don’t trigger new scrapping requests every time when the browser is refreshed.

Here is how it will look like:

TL;DR

If you want to skip the reading, here 💁 is the GitHub repository with a detailed README 🙌, and here you can see the live demo.

Let’s go step by step and see how to build and the deploy the app.

We will start with the server part.

Spin up the app with Vite

We will use Vite build tool to quickly spin up a bare bone React application, equipped with TailwindCSS for styling. In order to do that run this in your terminal app:

npm create vite@latest web-scraper -- --template react