Construimos una plataforma de video completa con Claude Code. Así lo hicimos.
3 fundadores, sin inversores, un workflow potenciado por IA. Cómo usamos Claude Code para diseñar, construir y lanzar una plataforma completa de video — SDK, API, dashboard, docs y website.
TL;DR
- Construimos una plataforma completa de video — SDK, API backend, dashboard, documentación y website — usando Claude Code como herramienta principal de desarrollo.
- No copilot. No autocompletado. Orquestación completa a través de un monorepo con 6 proyectos.
- El insight clave: el desarrollo asistido por IA no se trata de escribir código más rápido. Se trata de mantener coherencia en todo un producto a una velocidad que no debería ser posible con 3 personas.
3 Fundadores, Sin Inversores, Un Workflow
VIDTREO es una API de video. Graba, transcodifica y entrega video a $0.01/minuto. Pero este post no es sobre el producto — es sobre cómo lo construimos.
Cada pieza de nuestra plataforma fue diseñada, construida y desplegada usando Claude Code. No como motor de sugerencias. Como la capa de orquestación de todo nuestro flujo de desarrollo.
Así se ve en la práctica.
Planificar → Iterar → Desplegar → Repetir
Cada feature comienza como un plan. Describimos lo que queremos construir y Claude Code genera una estrategia de implementación a través de todo nuestro stack — SDK, API, dashboard, docs.
Lo revisamos. Hacemos push back. Refinamos. A veces iteramos un plan 5 o 6 veces antes de escribir una sola línea de código.
Luego ejecutamos. Misma sesión. Contexto completo del codebase.
Un cambio en el SDK dispara actualizaciones en la API. El dashboard refleja la nueva funcionalidad. Los docs la explican. El pipeline de deployment se encarga del resto. Un sistema coherente, no tickets dispersos en 4 repos.
Feature request
↓
Plan (Claude Code diseña arquitectura a través de SDK, API, dashboard, docs)
↓
Review (fundadores revisan, refinan, iteran 3-6 rondas)
↓
Execute (misma sesión, contexto completo del monorepo)
↓
Deploy (pipeline automatizado en todos los servicios)
Esta es la diferencia entre “la IA escribe código” y “la IA orquesta un producto.”
Todo Está Controlado por Código
La mayoría de empresas tienen una wiki para guías de marca. Una página de Notion para reglas de comunicación. Un doc de Confluence para decisiones de arquitectura que nadie actualiza.
Nosotros pusimos todo en código.
- ¿Reglas de marca? En código.
BRAND_GUIDE.mddefine cada color, fuente y regla de uso. - ¿Patrones de comunicación? En código.
BRAND_VOICE.mdestablece el tono para cada punto de contacto. - ¿Decisiones de arquitectura? En código. Archivos
CLAUDE.mden cada directorio describen cómo funciona cada sistema. - ¿Guías de voz de marketing? En código. Incluso este blog post siguió nuestras reglas documentadas de brand voice antes de ser escrito.
- ¿Prompts de generación de imágenes? En código. Una guía de estilo Nano Banana asegura que cada imagen generada por IA coincida con nuestra identidad visual.
No tenemos una wiki que nadie lee. Tenemos un codebase que refuerza la consistencia en cada touchpoint — desde mensajes de error hasta respuestas en LinkedIn.
Cuando Claude Code escribe un componente, lee BRAND_GUIDE.md y usa los valores hex correctos. Cuando redacta un blog post, revisa BRAND_VOICE.md y evita palabras como “revolucionario” y “seamless.” Cuando modifica la API, lee la guía de arquitectura y sigue nuestro patrón de arquitectura hexagonal.
La documentación es el mecanismo de enforcement.
El Contexto Es el Superpoder
Aquí es donde Claude Code se diferencia de cualquier otra herramienta de IA que hemos probado.
Claude Code recuerda todo. Nuestras decisiones de arquitectura. Por qué elegimos Cloudflare Workers sobre Lambda. Cómo nuestro upload queue maneja transferencias chunked. Los nombres exactos de variables CSS en nuestro componente de recorder. El schema de Drizzle ORM para nuestra base de datos Neon PostgreSQL.
Cuando decimos “agrega una nueva opción de encoding,” sabe:
- Dónde vive el schema en el backend (
src/modules/videos/domain/) - Qué endpoint de API modificar (
src/presentation/http/videos/) - Cómo actualizar la UI del dashboard (
src/components/videos/) - Qué debe decir la página de docs (
src/content/docs/) - Cómo escribir la migración (
drizzle/)
Porque ha estado ahí desde el día uno.
No estamos prompteando un chatbot. Estamos trabajando con un miembro del equipo que ha leído cada línea de código que hemos escrito.
El Stack Que Lanzamos
Seamos concretos sobre lo que este workflow produjo:
SDK — Un recorder de video multi-paquete. Librería core en TypeScript, componente React y Web Component. Transcodificación client-side vía WebCodecs. Persistencia IndexedDB para la cola de uploads. 40 KB en total.
@vidtreo/recorder → Core: captura, transcodificación, upload
@vidtreo/recorder-react → Componente React con UI integrada
@vidtreo/recorder-wc → Web Component <vidtreo-recorder>
Backend API — Cloudflare Workers con Hono.js. Domain-Driven Design con arquitectura hexagonal. Neon PostgreSQL vía Drizzle ORM. R2 storage (cero egress fees). Stripe billing. Better Auth para autenticación.
Dashboard — TanStack Start con React 19. Gestión de videos, analytics, configuración de environments, gestión de API keys, billing. 50+ componentes.
Documentación — Fumadocs sobre Next.js 16, desplegado en Cloudflare Workers vía OpenNext. Trilingüe (EN/ES/PT). Ejemplos de código interactivos con el SDK real.
Website de Marketing — Astro 6 con demos en vivo. Multilingüe. Páginas de comparación con competidores. Blog con MDX.
Deployment — Automatizado en todos los servicios. Cloudflare Workers para backend, dashboard y docs. npm registry para el SDK.
Todo a $0.01/minuto. Sin suscripciones. Sin costos ocultos. 83% de margen bruto.
Cómo Se Ve Esto en el Día a Día
Un día típico con Claude Code:
Mañana: “Necesitamos agregar límites de grabación por environment.” Claude Code planifica el cambio de schema en el backend, la modificación del endpoint de API, la UI del dashboard para configurar límites, la lógica de enforcement en el SDK y la actualización de documentación. Revisamos. Tres rondas de refinamiento. Ejecutamos.
Tarde: “El recorder móvil necesita un modo nativo para iOS Safari.” Claude Code lee la arquitectura existente del recorder, entiende el sistema de detección de dispositivos, propone un nuevo modo de grabación que delega a la app de cámara nativa. Debatimos las implicaciones de UX. Refinamos el plan. Ejecutamos a través de los tres paquetes del SDK simultáneamente.
Noche: “Escribe un blog post sobre nuestro modelo de pricing.” Claude Code lee nuestro análisis de costos en BUSINESS_PLAN.md, revisa BRAND_VOICE.md para el tono, y produce un borrador que cumple con cada checkpoint de marca. Editamos la voz. Publicamos.
Una sesión. Contexto completo. Sin cambio de contexto.
Las Reglas Que Seguimos
Este workflow no funciona por accidente. Hemos desarrollado principios específicos:
1. Planes antes de código. Cada feature no trivial recibe un plan escrito que abarca todos los proyectos afectados. Nada de “solo empieza a codear.”
2. CLAUDE.md en cada proyecto. Cada directorio tiene un archivo de contexto que explica la arquitectura, convenciones y patrones de ese proyecto. Así es como Claude Code mantiene la consistencia.
3. TypeScript estricto en todo. Sin any. Sin atajos. Esto le da a Claude Code la información de tipos que necesita para hacer cambios correctos entre proyectos.
4. Sin barrel files. Import desde archivos fuente reales. Esto mantiene el grafo de dependencias explícito y ayuda a Claude Code a entender las conexiones reales.
5. Boundaries domain-driven. Cada módulo es dueño de su lógica de dominio. Claude Code respeta estas boundaries porque están documentadas.
6. Revisar todo. Claude Code propone, nosotros aprobamos. Cada plan se itera. Cada cambio es revisado por al menos un fundador antes de merge.
Lo Que Aprendimos
La calidad de la IA escala con la calidad de la documentación. Mientras mejores son nuestros archivos CLAUDE.md, mejor es el output de Claude Code. Escribir documentación no es overhead — son datos de entrenamiento para tu workflow de IA.
La coherencia le gana a la velocidad. Podríamos lanzar features individuales más rápido con una herramienta más simple. Pero mantener consistencia a través de 6 proyectos con 3 personas requiere orquestación. Claude Code no se desvía. Sigue los patrones documentados cada vez.
Equipos pequeños pueden construir productos grandes. Sin orquestación de IA, nuestro stack necesitaría 12-15 ingenieros. Lo sabemos porque hemos trabajado en equipos de ese tamaño construyendo menos. La restricción no es inteligencia — es coordinación. Y la coordinación es exactamente en lo que la IA es buena.
El codebase es la fuente de verdad. No Slack, no Notion, no una wiki. Cuando cada regla está en código, la IA puede reforzarla. Cuando cada decisión está documentada en el repo, la IA la recuerda.
La Conclusión Real
El desarrollo asistido por IA no se trata de escribir código más rápido. Se trata de mantener coherencia en todo un producto a una velocidad que no debería ser posible con 3 personas.
Cada plan revisado. Cada patrón reforzado. Cada deployment consistente.
No solo usamos IA para construir un producto. Usamos IA para construir un sistema que construye un producto.
Así se ve el desarrollo de producto code-controlled y potenciado por IA.
Prueba el resultado: vidtreo.com · docs.vidtreo.com
Tenemos curiosidad — ¿alguien más está usando herramientas de IA para orquestar todo su flujo de desarrollo, no solo escribir código? Nos encantaría saber cómo es su proceso.
Posts Relacionados
Añade grabación de video a React en 5 minutos
Tutorial paso a paso para integrar grabación de video en el navegador en tu app React con el SDK de VIDTREO.
Transcripción y Resúmenes con IA: Por Qué Tu Plataforma de Video Los Necesita Integrados
Los servicios de transcripción con IA cuestan $0.002-0.036/min y requieren integraciones complejas. Descubre cómo VIDTREO incluye transcripción y resúmenes con IA en cada grabación sin costo adicional.