ditto.site  by ion-design

Capture live websites and generate runnable code projects

Created 1 week ago

New!

447 stars

Top 66.4% on SourcePulse

GitHubView on GitHub
Project Summary

Summary

ditto.site transforms any public URL into a self-contained, deterministic TypeScript application, primarily targeting Next.js App Router or Vite React. It benefits engineers and power users by programmatically generating functional codebases from live web content, eliminating the need for original source code access and ensuring reproducible outputs.

How It Works

The core is a capture-to-code pipeline: a browser captures DOM, styles, layout, assets, and interaction states. This frozen capture undergoes deterministic inference to generate a byte-stable application. This approach prioritizes replicating the rendered output accurately, distinguishing it from LLM-based content generation by guaranteeing consistent code from identical inputs.

Quick Start & Requirements

Local setup involves cloning the repository, installing Node.js dependencies (npm ci), and Playwright (npx playwright install chromium). The primary command is npm run clone -- <URL> --out=<output_dir>. Hosted API usage requires obtaining an API key from https://www.ditto.site/api-key and setting DITTO_API_KEY and DITTO_API_URL environment variables, with examples provided via curl. Detailed documentation is available in docs/METHODOLOGY.md and docs/README.md.

Highlighted Details

  • Deterministic Code Generation: Produces byte-stable Next.js or Vite React projects from live web page captures.
  • Comprehensive Capture: Records DOM, computed styles, layout, assets, screenshots, and interaction states.
  • REST API & MCP Server: Offers a hosted API for programmatic cloning and an MCP server designed for agent interactions.
  • Flexible Output: Generates a JSON file map or a .tgz archive of the cloned application.

Maintenance & Community

The repository includes standard contribution guidelines (CONTRIBUTING.md, SECURITY.md, SUPPORT.md, CODE_OF_CONDUCT.md), indicating a structured development process. However, specific details on active maintainers, community channels (e.g., Discord, Slack), or sponsorships are not detailed in the provided README.

Licensing & Compatibility

The project is released under the permissive MIT License, allowing for commercial use and integration into closed-source projects without significant restrictions.

Limitations & Caveats

ditto.site does not replay or capture complex application logic, authentication flows, payment systems, personalization features, or arbitrary third-party JavaScript. The local CLI is currently repo-local and not available via npx.

Health Check
Last Commit

20 hours ago

Responsiveness

Inactive

Pull Requests (30d)
27
Issues (30d)
1
Star History
447 stars in the last 12 days

Explore Similar Projects

Starred by Chip Huyen Chip Huyen(Author of "AI Engineering", "Designing Machine Learning Systems") and Elvis Saravia Elvis Saravia(Founder of DAIR.AI).

DeepCode by HKUDS

1.0%
16k
AI agents transform ideas into production-ready code
Created 1 year ago
Updated 1 day ago
Feedback? Help us improve.