launchframe 0.3.0 → 0.3.1

package/template/README.md

@@ -0,0 +1,121 @@
+# Launchframe Project
+
+This project was scaffolded by **[Launchframe](https://github.com/evangruhlkey/launchframe)** — an AI-powered website cloner + SaaS rebrander.
+
+```bash
+npx launchframe@latest <url> "<saas idea>"
+```
+
+Dependencies were installed for you. Files were written to **this directory** (project root) so **`.cursor`**, **`.claude`**, etc. work when you open this folder in your editor. Config lives in **`launchframe.config.json`** (`url` + SaaS `idea`).
+
+---
+
+## Quick start (two steps)
+
+1. **Open this folder** in [Cursor](https://cursor.com/) — the directory that **contains** `.cursor/` (not a parent folder).
+2. In chat, say: **Build it.**
+
+Your AI reads [`launchframe.config.json`](./launchframe.config.json) and [`AGENTS.md`](./AGENTS.md) and runs the full clone + rebrand pipeline (same as **`/clone-website`**).
+
+Rather read a postcard? See [`START_HERE.md`](./START_HERE.md).
+
+## What `/clone-website` does
+
+A multi-phase pipeline runs inside your AI agent:
+
+1. **Reconnaissance** — screenshots, design-token extraction, **image/video inventory** (`MEDIA_MANIFEST.md`), interaction sweep (scroll, click, hover, responsive)
+2. **Foundation** — fonts, globals, **`framer-motion`**, **download images & videos** to `public/` before most UI build
+3. **Component Specs** — writes detailed spec files (`docs/research/components/`) with exact CSS, **local media paths**, and **Motion** (CSS vs Framer)
+4. **Parallel Build** — dispatches builder agents in git worktrees, one per section
+5. **SaaS Rebrand Pass** — swaps product name, headlines, feature copy, CTAs, and brand marks to match `launchframe.config.json#idea`. Visuals stay 1:1.
+6. **Assembly & Visual QA** — merges worktrees, wires up the page, runs visual diff against the original
+
+Each builder agent receives the full component spec inline — exact `getComputedStyle()` values, interaction models, multi-state content, responsive breakpoints, asset paths. No guessing.
+
+## Supported AI Agents
+
+| Agent                                                         | Status                     |
+| ------------------------------------------------------------- | -------------------------- |
+| [Claude Code](https://docs.anthropic.com/en/docs/claude-code) | **Recommended** — Opus 4.7 |
+| [Codex CLI](https://github.com/openai/codex)                  | Supported                  |
+| [OpenCode](https://opencode.ai/)                              | Supported                  |
+| [GitHub Copilot](https://github.com/features/copilot)         | Supported                  |
+| [Cursor](https://cursor.com/)                                 | Supported                  |
+| [Windsurf](https://codeium.com/windsurf)                      | Supported                  |
+| [Gemini CLI](https://github.com/google-gemini/gemini-cli)     | Supported                  |
+| [Cline](https://github.com/cline/cline)                       | Supported                  |
+| [Roo Code](https://github.com/RooCodeInc/Roo-Code)            | Supported                  |
+| [Continue](https://continue.dev/)                             | Supported                  |
+| [Amazon Q](https://aws.amazon.com/q/developer/)               | Supported                  |
+| [Augment Code](https://www.augmentcode.com/)                  | Supported                  |
+| [Aider](https://aider.chat/)                                  | Supported                  |
+
+## Tech Stack
+
+- **Next.js 16** — App Router, React 19, TypeScript strict
+- **shadcn/ui** — Radix primitives + Tailwind CSS v4
+- **Tailwind CSS v4** — oklch design tokens
+- **Framer Motion** — default for non-trivial marketing animation (scroll reveals, staggers, layout); see `AGENTS.md`
+- **Lucide React** — default icons (replaced by extracted SVGs during cloning)
+- **Media** — targets download to `public/images/` & `public/videos/` per `docs/research/MEDIA_MANIFEST.md` (see `INSPECTION_GUIDE.md`)
+
+## Prerequisites
+
+- [Node.js](https://nodejs.org/) 24+
+- An AI coding agent with browser automation MCP **or** [Playwright](https://playwright.dev/) for `npm run recon` when MCP is unavailable
+- **First-time Playwright browsers:** after `npm install`, run `npx playwright install chromium`
+
+## Project Structure
+
+```
+src/
+  app/              # Next.js routes
+  components/       # React components
+    ui/             # shadcn/ui primitives
+    icons.tsx       # Extracted SVG icons
+  lib/utils.ts      # cn() utility
+  types/            # TypeScript interfaces
+  hooks/            # Custom React hooks
+public/
+  images/           # Downloaded images from target
+  videos/           # Downloaded videos from target
+  seo/              # Favicons, OG images
+docs/
+  research/         # Extraction output, component specs, REBRAND.md
+  design-references/ # Screenshots
+scripts/
+  sync-agent-rules.sh  # Regenerate agent instruction files
+  sync-skills.mjs      # Regenerate /clone-website for all platforms
+launchframe.config.json  # ← URL + SaaS idea (single source of truth)
+AGENTS.md           # Agent instructions (single source of truth)
+START_HERE.md       # "Open Cursor → say Build it"
+CLAUDE.md           # Claude Code config (imports AGENTS.md)
+GEMINI.md           # Gemini CLI config (imports AGENTS.md)
+```
+
+## Commands
+
+```bash
+npm run dev        # Start dev server
+npm run build      # Production build
+npm run lint       # ESLint check
+npm run typecheck  # TypeScript check
+npm run check      # Run lint + typecheck + build
+```
+
+## Use Cases
+
+- **Launch a SaaS faster** — start from a proven landing page, not a blank canvas
+- **Platform migration** — rebuild a site you own from WordPress/Webflow/Squarespace into a modern Next.js codebase
+- **Lost source code** — your site is live but the repo is gone; get the code back in a modern format
+- **Learning** — deconstruct how production sites achieve specific layouts, animations, and responsive behavior
+
+## Not Intended For
+
+- **Phishing or impersonation** — this project must not be used for deceptive purposes, impersonation, or any activity that breaks the law
+- **Passing off someone's design as your own** — logos, brand assets, and original copy belong to their owners
+- **Violating terms of service** — some sites prohibit scraping or reproduction. Check first
+
+## License
+
+MIT