⚠️ USER-AUTHORED NOTE — not official documentation from Google or any vendor.

The JSON → HTML Dashboard Pipeline

This is an architectural pattern for handling bulk data extraction (web scraping, data mining, or analysis).

The Core Problem

When an AI extracts a large amount of data (e.g., scraping 100 tweets, finding 50 Zillow listings, or summarizing 20 legal cases), simply dumping that raw text into a .txt or .md file results in a massive, unreadable wall of text.

The Solution: The 3-File Pipeline

Instead of dumping raw text, the AI should always construct a 3-file pipeline to turn the raw data into a beautiful, readable web page for the user.

1. The Source of Truth (data.json)

The AI saves all scraped data into a highly structured JSON file. Computers are excellent at reading and editing JSON.

[
  {
    "id": 1,
    "title": "Example Property",
    "price": "$450,000",
    "image_url": "https://example.com/image.jpg",
    "link": "https://example.com/listing"
  }
]

2. The Compiler (build_dashboard.ps1 or .py)

The AI writes a short, 10-line script. The script's only job is to open data.json, wrap every item in pretty HTML/CSS code, and save the result as an HTML file.

3. The Output (dashboard.html)

This is the final product. The user opens dashboard.html in their web browser and sees a beautiful, professional-looking grid of data with clickable links and formatted images, rather than staring at raw code.

Critical Rule

Never edit the HTML file directly. If the user wants to add or delete a scraped item, the AI must edit the data.json file, and then re-run the Compiler script to generate a fresh HTML dashboard.