Skip to content

mahedikd/simple-scraper

Repository files navigation

logo

Simple Scraper Extension

A smart, simple, and powerful browser extension to extract data from any website.
Built with React, TypeScript, Vite, and Tailwind CSS.

Intro

Simple Scraper is a generic scraper extension designed to make data extraction easy and accessible. It allows users to visually select elements on a webpage, define scraping steps, and export the data without writing code.

Whether you need to scrape a list of products, extract article text, or gather data from nested elements, Simple Scraper provides a flexible and user-friendly interface to get the job done.

Features

  • Visual Selection: Point and click to select elements on any webpage to scrape.
  • Step-based Scraping: Define multiple steps to traverse commands or scrape nested data.
  • Data Export: Download scraped data as JSON.
  • Cheat Sheet: Built-in CSS selector cheat sheet to help you target specific elements.
  • Export Configuration: Export your current steps and share them with others.
  • Modern UI: Clean and responsive interface built with Tailwind CSS.

Usage

Installation

From Release

  1. Go to the Releases page.
  2. Download the extension.zip file from the latest release.
  3. Unzip the file.
  4. Load into Chrome/Edge/Brave:
    • Open chrome://extensions.
    • Enable Developer mode.
    • Click Load unpacked.
    • Select the unzipped folder.

From Source

  1. Clone the repository:
    git clone https://github.com/mahedikd/simple-scraper.git
    cd simple-scraper
  2. Install dependencies:
    pnpm install
  3. Build the extension:
    pnpm build
  4. Load into Chrome/Edge/Brave using the dist directory.

How to use

  1. Navigate to the website you want to scrape.
  2. Open the Simple Scraper extension popup.
  3. Use the selector picker to choose elements on the page.
    • Hover over elements to highlight them.
    • Click to select.
  4. Add steps to define the extracting logic (e.g., text, attributes).
  5. Click Start to begin scraping.
  6. Download your data (JSON) when finished.

Tech Docs

Contributing

Feel free to open PRs or raise issues!