Vibecode MagicChat
track this build5 steps, step by step0%A retrieval chatbot over your own docs is one of the most one-shottable products there is: crawl the site, chunk and embed it, answer from the top matches with an LLM, drop in a widget. What you don't get for free is the boring operational layer, scheduled re-crawls, analytics, lead capture and human handoff, multi-source connectors, and a hosted widget that stays up. Buildable in a weekend, real gaps after that.
You are building a lean indie version of MagicChat. Create the following project files first, then implement the application by following them. Keep the files updated as decisions change. Do not collapse this into a single README or prompt. ===== README.md ===== # MagicChat indie build ## Goal Build the smallest trustworthy replacement for the core MagicChat workflow for one developer or a tiny team. ## Scope Crawl a site or docs, chunk and embed the pages into a vector store, retrieve the top matches for a visitor question, and answer with an LLM through an embeddable chat widget. ## Quick start 1. Install the documented dependencies. 2. Copy `.env.example` to `.env`. 3. Run the development command chosen during implementation. 4. Complete the acceptance checks in `BUILD_PLAN.md`. ## Honest limits This build deliberately does not replace: - scheduled auto re-crawl and content refresh - analytics and conversation-history dashboards - lead capture and human handoff - multi-source connectors and integrations - hosted uptime for the widget - team seats and enterprise compliance (HIPAA/DPA/BAA) If those capabilities are essential, use Onyx (formerly Danswer) instead of pretending the gap is solved. ===== AGENTS.md ===== # Agent instructions - Optimize for a working, understandable weekend build. - Prefer the fewest moving parts that satisfy the brief. - Do not invent cryptography, security guarantees, APIs, or compliance claims. - Keep secrets out of source control and logs. - Add focused tests for destructive, security-sensitive, and data-loss paths. - Run the project checks before declaring the build complete. - Record any deliberate shortcut in the README under "Tradeoffs". ===== BUILD_PLAN.md ===== # Build plan ## Original build brief Build me an AI support chatbot that trains on my own website and docs, to replace MagicChat, in an empty repo. Stack (no alternatives): Next.js 15 (App Router) + TypeScript, Postgres with the pgvector extension via Drizzle ORM, and Docker Compose so `docker compose up` runs Postgres and the app together. Use the OpenAI or Anthropic API for both embeddings and answers (keys in .env). Core loop: - `npm run ingest -- <sitemap-or-url>`: crawl the pages, strip to clean text, chunk (~800 tokens with overlap), embed each chunk, and store text + vector + source URL in Postgres. - A /api/chat route: embed the incoming question, pull the top-k chunks by cosine similarity, and ask the LLM to answer ONLY from that context, returning the source URLs it used. Stream the answer. - A single embeddable widget: one <script> tag mounts a floating chat bubble on any site, talking to /api/chat with CORS locked to configured origins. Details: - One config file: bot name, greeting, allowed origins, model, top-k. - Store everything locally in Postgres; `npm run reindex` re-crawls and replaces. - Secrets in .env, ship .env.example, never commit keys. - Handle empty, loading, and "I don't know from the docs" states honestly; never invent answers outside the retrieved context. - Out of scope: multi-channel (email/WhatsApp/Slack), team seats, an analytics dashboard, human handoff, scheduled auto-refresh (leave a documented cron hook), and any hosted control plane. - README: setup, the ingest command, embedding the widget, and where data lives. ## Required capabilities - OpenAI/Anthropic API key - an embeddings model - a vector store (pgvector or sqlite-vec) - a public HTTPS deployment for the widget ## Delivery order 1. Scaffold the smallest runnable application and document its commands. 2. Implement the primary data model and core workflow. 3. Add validation, safe failure states, and persistence. 4. Cover the critical path with automated tests. 5. Exercise a clean install from the README and fix every missing step. ## Done when - A new user can go from clone to first successful workflow using only the README. - The core workflow works without paid infrastructure unless the brief requires it. - Tests cover the highest-risk behavior. - Known limitations are explicit rather than hidden. ===== .env.example ===== # Copy to .env and document every variable when it is introduced. # Never put real credentials in this file. APP_ENV=development # Add only values required by the selected implementation.
You are building a lean indie version of MagicChat. Create the following project files first, then implement the application by following them. Keep the files updated as decisions change. Do not collapse this into a single README or prompt. ===== README.md ===== # MagicChat indie build ## Goal Build the smallest trustworthy replacement for the core MagicChat workflow for one developer or a tiny team. ## Scope Crawl a site or docs, chunk and embed the pages into a vector store, retrieve the top matches for a visitor question, and answer with an LLM through an embeddable chat widget. ## Quick start 1. Install the documented dependencies. 2. Copy `.env.example` to `.env`. 3. Run the development command chosen during implementation. 4. Complete the acceptance checks in `BUILD_PLAN.md`. ## Honest limits This build deliberately does not replace: - scheduled auto re-crawl and content refresh - analytics and conversation-history dashboards - lead capture and human handoff - multi-source connectors and integrations - hosted uptime for the widget - team seats and enterprise compliance (HIPAA/DPA/BAA) If those capabilities are essential, use Onyx (formerly Danswer) instead of pretending the gap is solved. ===== AGENTS.md ===== # Agent instructions - Optimize for a working, understandable weekend build. - Prefer the fewest moving parts that satisfy the brief. - Do not invent cryptography, security guarantees, APIs, or compliance claims. - Keep secrets out of source control and logs. - Add focused tests for destructive, security-sensitive, and data-loss paths. - Run the project checks before declaring the build complete. - Record any deliberate shortcut in the README under "Tradeoffs". ===== BUILD_PLAN.md ===== # Build plan ## Original build brief Build me an AI support chatbot that trains on my own website and docs, to replace MagicChat, in an empty repo. Stack (no alternatives): Next.js 15 (App Router) + TypeScript, Postgres with the pgvector extension via Drizzle ORM, and Docker Compose so `docker compose up` runs Postgres and the app together. Use the OpenAI or Anthropic API for both embeddings and answers (keys in .env). Core loop: - `npm run ingest -- <sitemap-or-url>`: crawl the pages, strip to clean text, chunk (~800 tokens with overlap), embed each chunk, and store text + vector + source URL in Postgres. - A /api/chat route: embed the incoming question, pull the top-k chunks by cosine similarity, and ask the LLM to answer ONLY from that context, returning the source URLs it used. Stream the answer. - A single embeddable widget: one <script> tag mounts a floating chat bubble on any site, talking to /api/chat with CORS locked to configured origins. Details: - One config file: bot name, greeting, allowed origins, model, top-k. - Store everything locally in Postgres; `npm run reindex` re-crawls and replaces. - Secrets in .env, ship .env.example, never commit keys. - Handle empty, loading, and "I don't know from the docs" states honestly; never invent answers outside the retrieved context. - Out of scope: multi-channel (email/WhatsApp/Slack), team seats, an analytics dashboard, human handoff, scheduled auto-refresh (leave a documented cron hook), and any hosted control plane. - README: setup, the ingest command, embedding the widget, and where data lives. ## Required capabilities - OpenAI/Anthropic API key - an embeddings model - a vector store (pgvector or sqlite-vec) - a public HTTPS deployment for the widget ## Delivery order 1. Scaffold the smallest runnable application and document its commands. 2. Implement the primary data model and core workflow. 3. Add validation, safe failure states, and persistence. 4. Cover the critical path with automated tests. 5. Exercise a clean install from the README and fix every missing step. ## Done when - A new user can go from clone to first successful workflow using only the README. - The core workflow works without paid infrastructure unless the brief requires it. - Tests cover the highest-risk behavior. - Known limitations are explicit rather than hidden. ===== .env.example ===== # Copy to .env and document every variable when it is introduced. # Never put real credentials in this file. APP_ENV=development # Add only values required by the selected implementation.
You are building a production product version of MagicChat. Create the following project files first, then implement the application by following them. Keep the files updated as decisions change. Do not collapse this into a single README or prompt. ===== PRODUCT.md ===== # MagicChat product brief ## Problem A retrieval chatbot over your own docs is one of the most one-shottable products there is: crawl the site, chunk and embed it, answer from the top matches with an LLM, drop in a widget. What you don't get for free is the boring operational layer, scheduled re-crawls, analytics, lead capture and human handoff, multi-source connectors, and a hosted widget that stays up. Buildable in a weekend, real gaps after that. ## Product outcome Crawl a site or docs, chunk and embed the pages into a vector store, retrieve the top matches for a visitor question, and answer with an LLM through an embeddable chat widget. ## Target user A serious builder who needs a maintainable product foundation rather than a one-off demo. ## Required capabilities - OpenAI/Anthropic API key - an embeddings model - a vector store (pgvector or sqlite-vec) - a public HTTPS deployment for the widget ## Explicit non-goals for v1 - scheduled auto re-crawl and content refresh - analytics and conversation-history dashboards - lead capture and human handoff - multi-source connectors and integrations - hosted uptime for the widget - team seats and enterprise compliance (HIPAA/DPA/BAA) ## Success criteria - The primary workflow is measurable end to end. - Setup is reproducible in a clean environment. - Failure, recovery, and support paths are documented. - Product claims match what the implementation actually guarantees. ===== ARCHITECTURE.md ===== # Architecture ## Starting brief Build me an AI support chatbot that trains on my own website and docs, to replace MagicChat, in an empty repo. Stack (no alternatives): Next.js 15 (App Router) + TypeScript, Postgres with the pgvector extension via Drizzle ORM, and Docker Compose so `docker compose up` runs Postgres and the app together. Use the OpenAI or Anthropic API for both embeddings and answers (keys in .env). Core loop: - `npm run ingest -- <sitemap-or-url>`: crawl the pages, strip to clean text, chunk (~800 tokens with overlap), embed each chunk, and store text + vector + source URL in Postgres. - A /api/chat route: embed the incoming question, pull the top-k chunks by cosine similarity, and ask the LLM to answer ONLY from that context, returning the source URLs it used. Stream the answer. - A single embeddable widget: one <script> tag mounts a floating chat bubble on any site, talking to /api/chat with CORS locked to configured origins. Details: - One config file: bot name, greeting, allowed origins, model, top-k. - Store everything locally in Postgres; `npm run reindex` re-crawls and replaces. - Secrets in .env, ship .env.example, never commit keys. - Handle empty, loading, and "I don't know from the docs" states honestly; never invent answers outside the retrieved context. - Out of scope: multi-channel (email/WhatsApp/Slack), team seats, an analytics dashboard, human handoff, scheduled auto-refresh (leave a documented cron hook), and any hosted control plane. - README: setup, the ingest command, embedding the widget, and where data lives. ## Boundaries Separate the product into replaceable modules for interface, application logic, persistence, external integrations, and operational concerns. Keep domain logic independent from delivery frameworks and vendors. ## Production baseline - Configuration: validated at startup with safe local defaults where possible. - Security: least privilege, input validation, secret redaction, rate limits on abuse-prone paths, and no invented security primitives. - Data: explicit schema and migrations, transactional writes where integrity matters, backup and restore instructions. - Integrations: adapters around third-party providers, idempotent webhook or job processing, bounded retries, and timeouts. - Observability: structured logs with request or operation IDs, an error-tracking hook, and health/readiness checks where a server exists. - Quality: unit tests for domain rules, integration tests at module boundaries, and one end-to-end critical-path test. ## Decision records For each major dependency, document why it was chosen, its failure mode, and how it can be replaced. Do not introduce infrastructure until a requirement justifies it. ===== AGENTS.md ===== # Agent instructions - Read `PRODUCT.md` and `ARCHITECTURE.md` before changing code. - Implement milestone by milestone; keep each change reviewable and leave the application runnable. - Treat authentication, payments, encryption, imports, webhooks, and destructive actions as high-risk boundaries when present. - Never invent cryptography or silently weaken a requirement to make a test pass. - Use provider interfaces for external services and deterministic fakes in tests. - Add migrations and rollback or recovery notes for persistent data changes. - Log useful operational context without credentials, tokens, passwords, or personal data. - Update documentation and run all checks before completing a milestone. ===== MILESTONES.md ===== # Delivery milestones ## M0 — Decisions and scaffold - Confirm the runtime, persistence model, threat boundaries, and deployment target. - Create a reproducible local environment and continuous checks. ## M1 — Core workflow - Implement the smallest end-to-end product path with validation and tests. - Keep integrations behind interfaces. ## M2 — Trust layer - Add secure failure behavior, recovery paths, audit-relevant events, and data safeguards. - Test abuse cases and destructive operations. ## M3 — Operability - Add structured logs, error reporting hooks, health signals, backup/restore documentation, and deployment configuration. ## M4 — Release gate - Run a clean-install test, critical-path end-to-end test, dependency review, and documented rollback exercise. - Compare the shipped behavior with `PRODUCT.md` and publish remaining limitations. ===== OPERATIONS.md ===== # Operations ## Before release - Validate configuration and secrets at startup. - Define backup, restore, and rollback procedures and test them. - Document logs, error tracking, health signals, and alert ownership. - Set dependency update and vulnerability review expectations. ## Incident checklist 1. Contain the issue without destroying evidence or user data. 2. Record the timeline and affected scope. 3. Rotate exposed secrets and revoke compromised sessions or credentials. 4. Restore from a verified source when needed. 5. Document the root cause, remediation, and regression test. ## Launch constraint Do not market omitted MagicChat capabilities as implemented. The v1 non-goals in `PRODUCT.md` remain user-visible limitations until they are deliberately delivered.
# MagicChat indie build ## Goal Build the smallest trustworthy replacement for the core MagicChat workflow for one developer or a tiny team. ## Scope Crawl a site or docs, chunk and embed the pages into a vector store, retrieve the top matches for a visitor question, and answer with an LLM through an embeddable chat widget. ## Quick start 1. Install the documented dependencies. 2. Copy `.env.example` to `.env`. 3. Run the development command chosen during implementation. 4. Complete the acceptance checks in `BUILD_PLAN.md`. ## Honest limits This build deliberately does not replace: - scheduled auto re-crawl and content refresh - analytics and conversation-history dashboards - lead capture and human handoff - multi-source connectors and integrations - hosted uptime for the widget - team seats and enterprise compliance (HIPAA/DPA/BAA) If those capabilities are essential, use Onyx (formerly Danswer) instead of pretending the gap is solved.
# Agent instructions - Optimize for a working, understandable weekend build. - Prefer the fewest moving parts that satisfy the brief. - Do not invent cryptography, security guarantees, APIs, or compliance claims. - Keep secrets out of source control and logs. - Add focused tests for destructive, security-sensitive, and data-loss paths. - Run the project checks before declaring the build complete. - Record any deliberate shortcut in the README under "Tradeoffs".
# Build plan ## Original build brief Build me an AI support chatbot that trains on my own website and docs, to replace MagicChat, in an empty repo. Stack (no alternatives): Next.js 15 (App Router) + TypeScript, Postgres with the pgvector extension via Drizzle ORM, and Docker Compose so `docker compose up` runs Postgres and the app together. Use the OpenAI or Anthropic API for both embeddings and answers (keys in .env). Core loop: - `npm run ingest -- <sitemap-or-url>`: crawl the pages, strip to clean text, chunk (~800 tokens with overlap), embed each chunk, and store text + vector + source URL in Postgres. - A /api/chat route: embed the incoming question, pull the top-k chunks by cosine similarity, and ask the LLM to answer ONLY from that context, returning the source URLs it used. Stream the answer. - A single embeddable widget: one <script> tag mounts a floating chat bubble on any site, talking to /api/chat with CORS locked to configured origins. Details: - One config file: bot name, greeting, allowed origins, model, top-k. - Store everything locally in Postgres; `npm run reindex` re-crawls and replaces. - Secrets in .env, ship .env.example, never commit keys. - Handle empty, loading, and "I don't know from the docs" states honestly; never invent answers outside the retrieved context. - Out of scope: multi-channel (email/WhatsApp/Slack), team seats, an analytics dashboard, human handoff, scheduled auto-refresh (leave a documented cron hook), and any hosted control plane. - README: setup, the ingest command, embedding the widget, and where data lives. ## Required capabilities - OpenAI/Anthropic API key - an embeddings model - a vector store (pgvector or sqlite-vec) - a public HTTPS deployment for the widget ## Delivery order 1. Scaffold the smallest runnable application and document its commands. 2. Implement the primary data model and core workflow. 3. Add validation, safe failure states, and persistence. 4. Cover the critical path with automated tests. 5. Exercise a clean install from the README and fix every missing step. ## Done when - A new user can go from clone to first successful workflow using only the README. - The core workflow works without paid infrastructure unless the brief requires it. - Tests cover the highest-risk behavior. - Known limitations are explicit rather than hidden.
# Copy to .env and document every variable when it is introduced. # Never put real credentials in this file. APP_ENV=development # Add only values required by the selected implementation.
# MagicChat product brief ## Problem A retrieval chatbot over your own docs is one of the most one-shottable products there is: crawl the site, chunk and embed it, answer from the top matches with an LLM, drop in a widget. What you don't get for free is the boring operational layer, scheduled re-crawls, analytics, lead capture and human handoff, multi-source connectors, and a hosted widget that stays up. Buildable in a weekend, real gaps after that. ## Product outcome Crawl a site or docs, chunk and embed the pages into a vector store, retrieve the top matches for a visitor question, and answer with an LLM through an embeddable chat widget. ## Target user A serious builder who needs a maintainable product foundation rather than a one-off demo. ## Required capabilities - OpenAI/Anthropic API key - an embeddings model - a vector store (pgvector or sqlite-vec) - a public HTTPS deployment for the widget ## Explicit non-goals for v1 - scheduled auto re-crawl and content refresh - analytics and conversation-history dashboards - lead capture and human handoff - multi-source connectors and integrations - hosted uptime for the widget - team seats and enterprise compliance (HIPAA/DPA/BAA) ## Success criteria - The primary workflow is measurable end to end. - Setup is reproducible in a clean environment. - Failure, recovery, and support paths are documented. - Product claims match what the implementation actually guarantees.
# Architecture ## Starting brief Build me an AI support chatbot that trains on my own website and docs, to replace MagicChat, in an empty repo. Stack (no alternatives): Next.js 15 (App Router) + TypeScript, Postgres with the pgvector extension via Drizzle ORM, and Docker Compose so `docker compose up` runs Postgres and the app together. Use the OpenAI or Anthropic API for both embeddings and answers (keys in .env). Core loop: - `npm run ingest -- <sitemap-or-url>`: crawl the pages, strip to clean text, chunk (~800 tokens with overlap), embed each chunk, and store text + vector + source URL in Postgres. - A /api/chat route: embed the incoming question, pull the top-k chunks by cosine similarity, and ask the LLM to answer ONLY from that context, returning the source URLs it used. Stream the answer. - A single embeddable widget: one <script> tag mounts a floating chat bubble on any site, talking to /api/chat with CORS locked to configured origins. Details: - One config file: bot name, greeting, allowed origins, model, top-k. - Store everything locally in Postgres; `npm run reindex` re-crawls and replaces. - Secrets in .env, ship .env.example, never commit keys. - Handle empty, loading, and "I don't know from the docs" states honestly; never invent answers outside the retrieved context. - Out of scope: multi-channel (email/WhatsApp/Slack), team seats, an analytics dashboard, human handoff, scheduled auto-refresh (leave a documented cron hook), and any hosted control plane. - README: setup, the ingest command, embedding the widget, and where data lives. ## Boundaries Separate the product into replaceable modules for interface, application logic, persistence, external integrations, and operational concerns. Keep domain logic independent from delivery frameworks and vendors. ## Production baseline - Configuration: validated at startup with safe local defaults where possible. - Security: least privilege, input validation, secret redaction, rate limits on abuse-prone paths, and no invented security primitives. - Data: explicit schema and migrations, transactional writes where integrity matters, backup and restore instructions. - Integrations: adapters around third-party providers, idempotent webhook or job processing, bounded retries, and timeouts. - Observability: structured logs with request or operation IDs, an error-tracking hook, and health/readiness checks where a server exists. - Quality: unit tests for domain rules, integration tests at module boundaries, and one end-to-end critical-path test. ## Decision records For each major dependency, document why it was chosen, its failure mode, and how it can be replaced. Do not introduce infrastructure until a requirement justifies it.
# Agent instructions - Read `PRODUCT.md` and `ARCHITECTURE.md` before changing code. - Implement milestone by milestone; keep each change reviewable and leave the application runnable. - Treat authentication, payments, encryption, imports, webhooks, and destructive actions as high-risk boundaries when present. - Never invent cryptography or silently weaken a requirement to make a test pass. - Use provider interfaces for external services and deterministic fakes in tests. - Add migrations and rollback or recovery notes for persistent data changes. - Log useful operational context without credentials, tokens, passwords, or personal data. - Update documentation and run all checks before completing a milestone.
# Delivery milestones ## M0 — Decisions and scaffold - Confirm the runtime, persistence model, threat boundaries, and deployment target. - Create a reproducible local environment and continuous checks. ## M1 — Core workflow - Implement the smallest end-to-end product path with validation and tests. - Keep integrations behind interfaces. ## M2 — Trust layer - Add secure failure behavior, recovery paths, audit-relevant events, and data safeguards. - Test abuse cases and destructive operations. ## M3 — Operability - Add structured logs, error reporting hooks, health signals, backup/restore documentation, and deployment configuration. ## M4 — Release gate - Run a clean-install test, critical-path end-to-end test, dependency review, and documented rollback exercise. - Compare the shipped behavior with `PRODUCT.md` and publish remaining limitations.
# Operations ## Before release - Validate configuration and secrets at startup. - Define backup, restore, and rollback procedures and test them. - Document logs, error tracking, health signals, and alert ownership. - Set dependency update and vulnerability review expectations. ## Incident checklist 1. Contain the issue without destroying evidence or user data. 2. Record the timeline and affected scope. 3. Rotate exposed secrets and revoke compromised sessions or credentials. 4. Restore from a verified source when needed. 5. Document the root cause, remediation, and regression test. ## Launch constraint Do not market omitted MagicChat capabilities as implemented. The v1 non-goals in `PRODUCT.md` remain user-visible limitations until they are deliberately delivered.
$ choose a build depth, inspect the files, then open the complete pack in your agent
People pay so they never touch the plumbing: the crawler that re-indexes when docs change, the dashboard that shows what customers asked, the connectors to their help desk, and a widget that stays up without them running a server. The RAG is easy; keeping it fresh, measured and online is the recurring work.
xscheduled auto re-crawl and content refresh
xanalytics and conversation-history dashboards
xlead capture and human handoff
xmulti-source connectors and integrations
xhosted uptime for the widget
xteam seats and enterprise compliance (HIPAA/DPA/BAA)
Don't feel like building it? These folks already made it free.
no votes, no pay-to-list · just what's real
MagicChat pricing
| plan | monthly | annual (per mo) | what you get |
|---|---|---|---|
| free | $0/workspace | $0/workspace | 1 chatbot; 100 messages/month; 50 training pages; website embed; community support |
| lite | $29/workspace | — | 1 chatbot; 7,500 messages/month; 500 pages; 1 team member; manual refresh |
| starter | $59/workspace | — | 1 chatbot; 15,000 messages/month; 1,000 pages; 1 team member; manual refresh |
| growth | $129/workspace | — | 2 chatbots; 33,000 messages/month; 10,000 pages; 4 team members; monthly auto-refresh; API access |
| scale | $429/workspace | — | 10 chatbots; 110,000 messages/month; 50,000 pages; 10 team members; weekly auto-refresh; daily auto-scan |
| enterprise | custom | — | Custom message volume, chatbot count, seats and compliance; HIPAA eligible with DPA/BAA on request |
free tier1 chatbot, 100 messages/month and 50 training pages
billingmonthly + annual (annual advertised at about 40% off; exact effective annual tier prices not exposed)
hidden costsRemoving MagicChat branding costs $59/month. Each extra 5,000-message block costs $59/month. Prices exclude tax; paid plans have a 7-day trial.
verified 2026-08-12 · source ↗
Vibecode MagicChat
Kinda. The core of MagicChat is buildable in a weekend with the prompt on this page, but there are real gaps: scheduled auto re-crawl and content refresh, analytics and conversation-history dashboards. Read the honest list above before committing.
How much does MagicChat cost?
MagicChat costs about $59/month (Starter, checked 2026-08-12), which is $708 per year.
What do I lose by replacing MagicChat?
Honestly: scheduled auto re-crawl and content refresh; analytics and conversation-history dashboards; lead capture and human handoff; multi-source connectors and integrations; hosted uptime for the widget; team seats and enterprise compliance (HIPAA/DPA/BAA). If any of those are load-bearing for you, keep paying.
Is there an open-source alternative to MagicChat?
Yes: Onyx (Self-hosted chat over your own docs with connectors and permissions; heavier to run than a widget, but the whole RAG loop is yours.) The prompt is for when you want it exactly your way.