[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"pack-detail-ai-app-builders-es":3,"seo:pack:ai-app-builders:es":74},{"code":4,"message":5,"data":6},200,"操作成功",{"pack":7},{"slug":8,"icon":9,"tone":10,"status":11,"status_label":12,"title":13,"description":14,"items":15,"install_cmd":73},"ai-app-builders","🏗","#A21CAF","stable","Estable","Constructores de Apps IA","bolt.diy, Bolt.new, Webstudio, Budibase, ToolJet, Onlook, Sandpack — genera apps full-stack y edita React en vivo en el navegador.",[16,28,38,45,52,59,66],{"id":17,"uuid":18,"slug":19,"title":20,"description":21,"author_name":22,"view_count":23,"vote_count":24,"lang_type":25,"type":26,"type_label":27},435,"b45a4842-0a5e-413f-9651-3c294157f4da","bolt-diy-ai-full-stack-app-builder-any-llm-b45a4842","bolt.diy — AI Full-Stack App Builder, Any LLM","Community fork of Bolt.new. Prompt, edit, and deploy full-stack web apps with any LLM provider. 19K+ GitHub stars.","Script Depot",357,0,"en","script","Script",{"id":29,"uuid":30,"slug":31,"title":32,"description":33,"author_name":34,"view_count":35,"vote_count":24,"lang_type":25,"type":36,"type_label":37},225,"ba69689a-ab30-4274-b6bf-1ed4a87a151b","bolt-new-ai-full-stack-web-app-generator-ba69689a","Bolt.new — AI Full-Stack Web App Generator","Prompt, run, edit, and deploy full-stack web apps in the browser. AI generates code, installs packages, runs dev server, and deploys — all from a chat interface. 16K+ stars.","AI Open Source",294,"skill","Skill",{"id":39,"uuid":40,"slug":41,"title":42,"description":43,"author_name":34,"view_count":44,"vote_count":24,"lang_type":25,"type":36,"type_label":37},882,"55aaef45-349d-11f1-9bc6-00163e2b0d79","webstudio-open-source-visual-website-builder-55aaef45","Webstudio — Open Source Visual Website Builder","Webstudio is an open-source Webflow alternative with a visual drag-and-drop editor, full CSS support, headless CMS integration, and self-hosting on Cloudflare.",382,{"id":46,"uuid":47,"slug":48,"title":49,"description":50,"author_name":22,"view_count":51,"vote_count":24,"lang_type":25,"type":36,"type_label":37},919,"ed9cefd6-34ae-11f1-9bc6-00163e2b0d79","budibase-open-source-low-code-app-builder-ed9cefd6","Budibase — Open Source Low-Code App Builder","Budibase is an open-source low-code platform for building internal tools, admin panels, dashboards, and workflow apps in minutes. Connect any database and deploy instantly.",299,{"id":53,"uuid":54,"slug":55,"title":56,"description":57,"author_name":22,"view_count":58,"vote_count":24,"lang_type":25,"type":36,"type_label":37},1185,"eac97f87-371c-11f1-9bc6-00163e2b0d79","tooljet-open-source-low-code-platform-business-apps-eac97f87","ToolJet — Open Source Low-Code Platform for Business Apps","ToolJet is an open-source low-code platform for building internal tools, dashboards, and business applications. It provides a visual app builder, workflow automation, AI integration, and connects to 30+ data sources out of the box.",279,{"id":60,"uuid":61,"slug":62,"title":63,"description":64,"author_name":34,"view_count":65,"vote_count":24,"lang_type":25,"type":36,"type_label":37},867,"0d4f9803-33e3-11f1-9bc6-00163e2b0d79","onlook-visual-ai-code-editor-react-apps-0d4f9803","Onlook — Visual AI Code Editor for React Apps","Open-source Figma-like visual editor for building React and Next.js apps with AI. Edit visually and code syncs in real-time. Design branching, team collab, deploy. Apache-2.0, 25,000+ stars.",318,{"id":67,"uuid":68,"slug":69,"title":70,"description":71,"author_name":22,"view_count":72,"vote_count":24,"lang_type":25,"type":36,"type_label":37},824,"847af291-82ed-41ac-9bec-1719afd4d3b0","sandpack-ai-powered-live-code-editor-component-847af291","Sandpack — AI-Powered Live Code Editor Component","Embed live code editors in web apps with instant preview. Sandpack by CodeSandbox powers interactive coding experiences for AI chatbots, docs, and educational platforms.",297,"tokrepo install pack\u002Fai-app-builders",{"pageType":75,"pageKey":8,"locale":76,"title":77,"metaDescription":78,"h1":13,"tldr":79,"bodyMarkdown":80,"faq":81,"schema":97,"internalLinks":107,"citations":120,"wordCount":133,"generatedAt":134},"pack","es","Constructores de Apps IA: 7 generadores full-stack","bolt.diy, Bolt.new, Webstudio, Budibase, ToolJet, Onlook, Sandpack — genera apps full-stack y edita React en vivo en el navegador. Instala con TokRepo.","Siete builders IA que van de prompt a app corriendo en minutos — Bolt para SaaS greenfield, Webstudio para React design-first, Budibase y ToolJet para tools internos, Onlook para diseño en vivo en React, Sandpack para sandboxes embebidos.","## Qué incluye este pack\n\n| # | Builder | Mejor para | Salida |\n|---|---|---|---|\n| 1 | bolt.diy | generador estilo Bolt self-host | app full-stack en WebContainer |\n| 2 | Bolt.new | hosted prompt-a-SaaS | app full-stack + deploy a Netlify |\n| 3 | Webstudio | builder visual, ergonomía de design tool | React + CSS limpios |\n| 4 | Budibase | tools internos con self-host | low-code app + Postgres |\n| 5 | ToolJet | tools internos, más drag-drop | low-code app + conectores |\n| 6 | Onlook | \"Figma para código\", edita React en vivo | diffs sobre tu repo React real |\n| 7 | Sandpack | sandbox embebible de CodeSandbox | React ejecutable dentro de cualquier página |\n\nEstos siete cubren el espectro completo desde \"escribe una frase, obtén una SaaS\" hasta \"da a los diseñadores control visual sobre mi codebase React real\". No son intercambiables — cada uno apuesta por algo diferente sobre quién hace el trabajo y qué se genera.\n\n## Por qué importa\n\nLa categoría \"IA construye tu app\" pasó de truco a workflow real en 2025. Tres razones:\n\n1. **WebContainers**: el runtime de Node en navegador de StackBlitz hace que un npm install completo + dev server arranque en 5 segundos dentro de una pestaña. Se acabó el \"espera mientras provisionamos un sandbox\".\n2. **Capacidad de código de modelos frontier**: Claude Sonnet 3.7 y GPT-5 por fin escriben React que realmente compila y funciona al primer intento, no \"casi funciona tras 3 arreglos\".\n3. **Edición en vivo sobre codebases reales**: Onlook es el avance — los diseñadores arrastran elementos en el navegador y emiten diffs limpios contra tu repo existente. Se acabó el \"rediseñar en Figma → ingeniero reimplementa\".\n\nResultado: construir una app CRUD desde un prompt ahora toma 15 minutos incluyendo auth, deploy y una base de datos real. El cuello de botella pasó de codificar a pensar producto.\n\n## Instala en un comando\n\n```bash\n# Instala el pack completo\ntokrepo install pack\u002Fai-app-builders\n\n# O elige el que encaje en tu situación\ntokrepo install bolt-diy\ntokrepo install webstudio\ntokrepo install onlook\n```\n\nLa página TokRepo de cada recurso lista opciones hosted vs self-host, el coste típico de tokens por generación, y los targets de deploy soportados (Netlify, Vercel, Cloudflare Pages, Docker).\n\n## Trampas comunes\n\n- **WebContainer != Node**: bolt.diy y Bolt.new corren apps en WebContainer, un runtime WASM compatible con Node. Algunos paquetes npm con bindings nativos no funcionan. Verifica tu stack antes de apostar un proyecto.\n- **Drift en código generado**: el React generado por IA a menudo usa patrones ligeramente fuera de spec (hooks mal memoizados, bugs accidentales de cliente\u002Fservidor). Trata la generación como punto de partida, no producto terminado.\n- **Tools internos vs apps**: Budibase y ToolJet son builders de *tools internos* — asumen un usuario empleado autenticado. No los lances como SaaS para clientes sin replantear auth, branding y casos borde.\n- **Onlook necesita un repo real**: edita *tu* React, no un sandbox. Conectarlo requiere correr un proceso agente local. Trátalo como herramienta-de-instalación-única, no spin-up por tarea.\n- **Gasto de tokens en Bolt.new**: generaciones de app completa pueden quemar 100k+ tokens por ronda. El tier hosted limita el uso; self-host bolt.diy con tu propia key Anthropic evita el límite pero te factura directo.\n\n## Cuando este pack solo no basta\n\nEste pack genera el *frontend*. Para correr un producto real también necesitas:\n\n- **Un backend o CMS**: ver **CMS Headless para IA** — Strapi, Directus, Hasura — la capa de datos estructurada para apuntar tu app generada.\n- **Una base de datos**: las demos WebContainer de bolt.diy usan SQLite o en-memoria; producción necesita Postgres \u002F Supabase \u002F Neon.\n- **Auth**: Bolt.new conecta Auth0 o Supabase Auth; si self-hosteas, plánealo explícito.\n- **Pipeline de deploy**: elige Netlify o Cloudflare Pages y mantente.\n\nPara sitios docs, páginas marketing o blogs producto, no necesitas este pack — ver **Generadores de Sitios Estáticos & Docs**. Los app builders resuelven una forma distinta de problema.\n\n## Errores conceptuales comunes\n\n\"Generaré una SaaS este finde\". Quizá — pero el código generado es ~70% del trabajo. Flujos de auth, integración de pagos, multi-tenancy, estados de error, edge cases de mobile responsive, consent GDPR, accesibilidad y observabilidad son cosas que los builders saltan o hacen mal. Ese 30% restante es donde los productos viven o mueren.",[82,85,88,91,94],{"q":83,"a":84},"¿Son gratis estas herramientas?","bolt.diy, Webstudio (community), Budibase (community), ToolJet, Onlook (con límites) y Sandpack son open-source y gratis de self-hostear. Bolt.new es hosted con tier free y planes pagos desde ~$20\u002Fmes. El coste oculto en hosted es gasto de tokens LLM — generar una app completa puede quemar $1-3 por ronda, e iterarás 5-20 veces en un proyecto real.",{"q":86,"a":87},"¿Bolt.new o bolt.diy?","bolt.new si quieres experiencia hosted pulida, te sirve su pricing y no te importa la elección de modelo. bolt.diy si quieres self-host, BYOK (Anthropic, OpenAI, Ollama local), y poder forkear el generador. La salida es similar; la diferencia es quién corre la infra y paga la factura LLM.",{"q":89,"a":90},"¿Funcionan con Cursor o Codex CLI?","La mayoría son apps web standalone, no CLI tools — los visitas en el navegador, generas, y descargas o deployeas. Onlook es la excepción: se pairea con tu proyecto React local y editas visualmente mientras Cursor o Codex CLI maneja otras tareas. Sandpack es embebible, puedes meterlo en una extensión Cursor o sitio doc.",{"q":92,"a":93},"¿En qué difiere de Sitios Estáticos & Docs?","App builders generan apps dinámicas full-stack con estado, auth y BD. Generadores estáticos generan sitios marketing\u002Fdocs prerendered sin backend. Si tu producto tiene cuentas de usuario, ven aquí. Si lanzas un blog o landing page, usa el pack estático.",{"q":95,"a":96},"¿Cuál es la trampa operativa?","Subestimar la cola de productización. Los builders te llevan a una demo funcional en una hora. Llevar esa demo a un cliente que paga añade auth, pagos, errores, monitoring, accesibilidad, testing móvil, GDPR, SOC 2 en algunos mercados — típicamente 4-12 semanas adicionales. Planéalo; no seas el founder que lanza un prototipo Bolt como producto real al tercer día.",{"@context":98,"@type":99,"name":100,"description":101,"numberOfItems":102,"publisher":103},"https:\u002F\u002Fschema.org","CollectionPage","AI App Builders","Seven generators that produce full-stack apps and live-edit React in the browser — bolt.diy, Bolt.new, Webstudio, Budibase, ToolJet, Onlook, Sandpack.",7,{"@type":104,"name":105,"url":106},"Organization","TokRepo","https:\u002F\u002Ftokrepo.com",[108,112,116],{"url":109,"anchor":110,"reason":111},"\u002Fes\u002Fpacks\u002Fheadless-cms-for-ai","CMS Headless para IA","el backend que conectas tras generar",{"url":113,"anchor":114,"reason":115},"\u002Fes\u002Fpacks\u002Fstatic-site-docs","Sitios Estáticos & Docs","alternativa si no necesitas una app completa",{"url":117,"anchor":118,"reason":119},"\u002Fes\u002Ftools\u002Fbolt-new","Bolt.new","la entrada más viral del pack",[121,125,129],{"claim":122,"source_name":123,"source_url":124},"bolt.diy is the open-source community fork of Bolt.new for self-hosted in-browser app generation","stackblitz-labs\u002Fbolt.diy","https:\u002F\u002Fgithub.com\u002Fstackblitz-labs\u002Fbolt.diy",{"claim":126,"source_name":127,"source_url":128},"Webstudio is an open-source visual web builder that compiles to React","webstudio-is\u002Fwebstudio","https:\u002F\u002Fgithub.com\u002Fwebstudio-is\u002Fwebstudio",{"claim":130,"source_name":131,"source_url":132},"ToolJet is an open-source low-code platform for building internal tools","ToolJet\u002FToolJet","https:\u002F\u002Fgithub.com\u002FToolJet\u002FToolJet",729,"2026-05-02T15:00:00Z"]