▲ Sesión de la comunidad: Lanza y valida más rápido con PostHog + v0

VVercel
컴퓨터/소프트웨어창업/스타트업AI/미래기술

Transcript

00:00:00[AUDIO EN BLANCO]
00:00:30[AUDIO EN BLANCO]
00:01:00[AUDIO EN BLANCO]
00:01:29>> Hola a todos.
00:01:32Bienvenidos a la sesión comunitaria de Vercel de esta semana.
00:01:36Estamos muy emocionados de tenerlos aquí.
00:01:41Es genial hacer estas sesiones en vivo porque siento que
00:01:44no las hacía desde hace tiempo.
00:01:46Así que, ¡hola a todos!
00:01:47[RISAS] Si es su primera vez en una de nuestras sesiones,
00:01:53soy Pauline Navas, del equipo de comunidad aquí en Vercel.
00:01:57Quizás me hayan visto en los espacios de nuestra propia plataforma,
00:02:03[www.vercel.com](https://www.vercel.com), o tal vez en X o LinkedIn, respondiendo preguntas y
00:02:08colaborando con la comunidad para entender qué es lo que están creando
00:02:12en Vercel.
00:02:13Así que esta es siempre una oportunidad para conectar con la comunidad,
00:02:18nuestros clientes y nuestros usuarios en directo.
00:02:22Genial, es asombroso ver a tantos de ustedes ya conectados.
00:02:25Veo un buenas noches de Adam en el chat.
00:02:29Hola, hola, hola.
00:02:31Dejen un mensaje en el chat para saber desde dónde nos sintonizan hoy.
00:02:36Si están viendo esto en X, YouTube o LinkedIn y
00:02:39quieren unirse al chat, vayan a [community.vercel.com/live](https://community.vercel.com/live).
00:02:46Encontrarán la sesión justo arriba y podrán dejar un comentario.
00:02:53Sobre la sesión de hoy, me emociona mucho cuando tenemos estas
00:02:58sesiones de integración del Marketplace de Vercel, porque es genial ver lo que
00:03:03se puede construir sobre Vercel usando nuestras integraciones.
00:03:07Hoy vamos a hablar con PostHog.
00:03:11Y por si no los conocen, la versión corta es que PostHog
00:03:16es una plataforma de análisis de productos de código abierto.
00:03:19Pueden verla como una herramienta de feature flags, pruebas A/B, rastreo de eventos y,
00:03:25básicamente, todo lo necesario para entender qué pasa realmente
00:03:29cuando la gente usa su producto.
00:03:31Lo que hace que la sesión de hoy sea súper emocionante es que PostHog ahora
00:03:36se integra directamente con v0.
00:03:38Eso significa que pueden pasar de una idea a un experimento en vivo sin
00:03:43tener que salir de su entorno de desarrollo.
00:03:45Ya no hace falta eso de lanzar primero y preocuparse por la analítica después.
00:03:50Pueden configurar los feature flags, hacer pruebas y rastrear eventos personalizados
00:03:55como parte de la propia construcción del proyecto.
00:03:58Así que dejaré de parlotear, pero ¡hola a todos!, veo a muchísima gente en el chat.
00:04:06Qué bien.
00:04:06Cuéntennos desde dónde nos ven.
00:04:09Genial.
00:04:10Así que, sin más preámbulos, me encantaría dar la bienvenida a Brooker, de PostHog.
00:04:16Hola, Brooker.
00:04:17- Hola.
00:04:17Encantado de estar aquí.
00:04:19Sí, como dijo Pauline, mi nombre es Brooker.
00:04:21Soy ingeniero de producto en el equipo de crecimiento.
00:04:25Para empezar, les contaré un poco sobre lo que ofrece PostHog y
00:04:30por qué querrían usar algo como PostHog en v0.
00:04:34Después veremos algunos casos de uso en Vercel y v0.
00:04:41Haré una demostración en vivo.
00:04:42Implementaremos algunos de esos casos de uso.
00:04:46Los dos que quiero cubrir en particular... bueno, empezaré explicando
00:04:49qué es PostHog y por qué les interesaría como usuarios de v0
00:04:54y de Vercel.
00:04:56Imaginen que usan v0, crean la mejor app del mundo, la despliegan,
00:05:02y quieren ver cómo funciona. ¿Cómo lo descubren?
00:05:06¿Cómo entienden cómo usa la gente su app, qué les gusta,
00:05:11o qué no les gusta?
00:05:12¿Cómo se dan cuenta cuando algo sale mal?
00:05:15Muchas veces despliegas una app y funciona de maravilla
00:05:19en el modo de vista previa.
00:05:20Quizás hiciste pruebas tú mismo, pero cuando ya está en producción,
00:05:26surgen problemas que no previste.
00:05:29Ahí es cuando salta una excepción, y sería muy útil para ustedes
00:05:33tener visibilidad sobre eso, y especialmente llevar esa visibilidad
00:05:39y ese contexto a v0, al agente, para que el agente entienda todo
00:05:45lo que pasa en producción y solucione el problema sin que tengan
00:05:50que ir buscando el contexto en diferentes sitios, ya sea en su
00:05:55sistema de logs, de errores, o intentando reproducirlo ustedes mismos
00:05:59copiando y pegando desde las DevTools de Chrome.
00:06:02No es que yo haya tenido que hacer eso antes...
00:06:04- Creo que todos lo hemos hecho.
00:06:07- Sí.
00:06:09Así que ese es un caso de uso que quiero mostrar: el manejo de errores.
00:06:13Y el otro son los feature flags y las pruebas A/B.
00:06:17La verdad es que he disfrutado mucho este método de desarrollo.
00:06:23Estás trabajando con tu equipo.
00:06:26Hablan sobre una funcionalidad que quieren añadir.
00:06:29Y quizás tienes una opinión distinta a la de tu compañero sobre cómo
00:06:33implementar esa funcionalidad.
00:06:34Tú quieres hacerlo de una forma.
00:06:36Ellos de otra.
00:06:39Una forma genial de resolverlo es hacer ambas cosas y probarlas
00:06:42en producción para ver cuál da mejores resultados.
00:06:46También vamos a ver eso.
00:06:48Así que, sin más dilación, voy a compartir mi pantalla.
00:06:51Les mostraré todo el proceso de principio a fin.
00:06:55Una pequeña parte ya está hecha en esta cuenta.
00:06:58Así que cambiaré a una cuenta donde aún no tenga PostHog instalado.
00:07:06Avísenme cuando se vea mi pantalla.
00:07:09- La pantalla se ve, Brooker.
00:07:11Adelante.
00:07:11- Genial.
00:07:12Bien.
00:07:12Estamos en Vercel.
00:07:14Vamos a integraciones y buscamos PostHog.
00:07:18No sé por qué dice... ah, "Browse Marketplace".
00:07:21Entramos al Marketplace.
00:07:22Buscamos PostHog, lo seleccionamos y hacemos clic en "Install".
00:07:29Me preguntará si quiero crear una cuenta nueva o vincular una existente.
00:07:32Si ya tienen cuenta en PostHog, pueden vincularla.
00:07:35Y lo que esto hará por mí es... vamos a instalarlo aquí.
00:07:39Va a... perdón, no puedo hacer clic y hablar al mismo tiempo.
00:07:46¿Por qué tengo que poner una dirección de facturación?
00:07:48Vale.
00:07:49Rellenan este formulario.
00:07:52Pulsen "Continue".
00:07:53Esto sincronizará sus... déjenme mostrarles qué hará.
00:07:59Sincronizará sus variables de entorno para que, si voy a "Settings"...
00:08:06Bueno, iré al "Overview".
00:08:09Oh, pensaba que ya lo tenía instalado.
00:08:14Hagámoslo rápido.
00:08:15Vamos a instalarlo para un proyecto.
00:08:17Elijo en qué proyecto quiero instalarlo.
00:08:20Pulsamos "Continue".
00:08:22Genial.
00:08:23Esto va... ya elegí el proyecto.
00:08:25Veamos.
00:08:30Perdón, creía que tenía uno aquí.
00:08:32Ah, ya sé qué pasa.
00:08:33Tengo abierta la cuenta equivocada.
00:08:35Creo que estoy en esta.
00:08:37- Esto es lo mejor, por cierto; depurar e ir paso a paso.
00:08:41Es fantástico.
00:08:42- Sí.
00:08:44Vale, sí, aquí lo tengo conectado.
00:08:47Lo que quería destacar, lo mejor de esta integración, es que
00:08:51no tienen que gestionar las variables de entorno ustedes mismos.
00:08:55Si tienen experiencia en eso, sabrán que no es divertido, sobre todo
00:08:59cuando hay que rotar las claves, algo que es muy recomendable.
00:09:03La integración de Vercel con PostHog gestionará todo eso por ustedes.
00:09:08Solo tienen que seguir los pasos de la instalación
00:09:12que acabo de mostrar.
00:09:13También gestiona la facturación; tenemos un plan gratuito muy generoso.
00:09:17Así que espero que no tengan que preocuparse por eso al principio,
00:09:21hasta que su producto despegue y sea el menor de sus problemas.
00:09:24Pero sí, esto sincronizará sus variables de entorno.
00:09:28Lo principal que necesitamos es el PostHog host... no voy a mostrarlo
00:09:33porque no quiero que me regañen, pero el host es solo una URL.
00:09:39Será algo como us.i.posthog.com.
00:09:43La PostHog key es la parte importante, y es la que le dirá a PostHog,”0
00:09:48la que identificará su proyecto dentro de PostHog.
00:09:50Así, cuando su aplicación esté en producción y se reporten
00:09:58errores, uso y feature flags a PostHog, esta clave es la que
00:10:02vinculará su producto con un proyecto de PostHog.
00:10:07Es muy útil tenerlo todo configurado automáticamente aquí.
00:10:12¿Alguna duda sobre la parte de Vercel?
00:10:16Es bastante sencillo.
00:10:17Lo expliqué un poco rápido y tuve algún problemilla, lo siento.
00:10:21Básicamente, lo instalas, lo vinculas al proyecto de Vercel que
00:10:25quieras usar, y ya estás listo para empezar.
00:10:28También tenemos algunas guías de inicio por aquí.
00:10:32Pueden ver sus feature flags aquí si las tienen configuradas.
00:10:35Aún no tengo ninguna en este, pero las tendremos en un minuto.
00:10:40- Sí, es genial.
00:10:41Iba a decir que no hay preguntas por ahora, lo que indica que es muy fluido.
00:10:47Pregunté por el chat si alguien ya había probado esta integración.
00:10:51Si es así, cuéntennos y pregunten lo que quieran a medida que avanzamos.
00:10:54- Sí, y siéntanse libres de interrumpir.
00:10:58Pasemos a la demo.
00:10:59Tengo una app funcionando.
00:11:01Hice un jueguito.
00:11:02Se llama Hog Hop.
00:11:04Aquí tengo un pequeño PostHog.
00:11:06Hay bichos corriendo y trato de recoger puntos de datos.
00:11:12Max va saltando y recogiendo puntos de datos.
00:11:15Tengo un fallo.
00:11:16Al recoger ciertos puntos, se queda congelado.
00:11:21Ahora no puedo hacer nada.
00:11:23Me pasó esto en producción y necesito ayuda para saber qué ocurre.
00:11:28Podría, como dije antes, abrir las DevTools.
00:11:32Podría mirar los logs de Vercel para intentar encontrar errores.
00:11:41Pero voy a mostrarles cómo no hace falta hacer nada de eso.
00:11:44En v0, pueden reunir todo el contexto necesario sobre el error y arreglarlo
00:11:50directamente ahí.
00:11:51Primero mostraré cómo añadir el MCP.
00:11:54Abajo a la izquierda en el chat de v0 hay un botoncito de "+",
00:12:01donde aparece una sección para los MCP.
00:12:04Solo tienen que hacer clic en "Add MCP".
00:12:06PostHog ya está configurado como un MCP predefinido.
00:12:10Como ya lo tengo conectado para esto, no voy a desconectarlo.
00:12:13Pero solo hay que pulsar el botón de "+" y les pedirá que inicien
00:12:18sesión con su cuenta de PostHog.
00:12:19Algo que no mostré fue que, al crear la integración entre PostHog
00:12:25y Vercel, aparece este botón de "Open in PostHog", que me
00:12:30loguea en PostHog para no tener que gestionar credenciales ni nada.
00:12:36Ya estoy dentro, y luego en v0, cuando quiero conectar el MCP,
00:12:42solo hago clic para autenticar y se abrirá una pestaña de PostHog
00:12:48para autenticar el MCP.
00:12:50Me acabo de dar cuenta de que no definí qué es MCP, lo siento mucho.
00:12:52MCP (Model Context Protocol) es básicamente una forma de reunir información
00:12:58para darle al agente de v0 la capacidad de recopilar datos o
00:13:03llamar a funciones vinculadas a esta cuenta.
00:13:07En este caso, decimos: "Oye, v0, si necesitas preguntar algo o gestionar
00:13:14cosas en PostHog"... y es un producto con muchísimas funciones,
00:13:19el MCP de PostHog permite hacer un montón de cosas.
00:13:24De hecho, les mostraré... tenemos una documentación... PostHog Docs, Model Context Protocol.
00:13:29Esto les muestra básicamente todo lo que pueden hacer.
00:13:33No se abrumen demasiado con esta lista.
00:13:35Todo esto ya está cargado en el agente.
00:13:36Así que podrían preguntar: "¿Qué puedo hacer con el MCP de PostHog?"
00:13:42Y se lo dirá.
00:13:43Solo asegúrense de tener activado este pequeño interruptor de aquí.
00:13:50Y bueno, lo que quería mostrar aquí es que, de nuevo,
00:13:55cuando intento recopilar este tercer punto de datos, encuentro un error.
00:14:00Simplemente se congela.
00:14:01Así que voy a describir eso aquí.
00:14:04Me indicó todas estas cosas que puedo hacer con el MCP de PostHog.
00:14:08Se lo voy a describir al agente.
00:14:10Le diré: "Al recopilar puntos de datos con Max, a veces se congela.
00:14:23¿Puedes encontrar el error usando los fallos del MCP de PostHog y arreglarlo?"
00:14:35Y mientras lo hace, les mostraré el panel de control de PostHog.
00:14:39Cuando estoy en PostHog, puedo ir a aplicaciones y luego a seguimiento de errores.
00:14:47Como dije, PostHog hace muchísimas cosas.
00:14:50Así que hay bastantes funciones que pueden explorar aquí.
00:14:55Nos enfocaremos solo en un par para darles una idea tangible de lo que pueden hacer.
00:15:01Si tienen un perfil más técnico y quieren ver qué está pasando realmente
00:15:04con estos errores, pueden abrir esto y ver... podrían, por ejemplo,
00:15:11hacer clic en el error y ver el trazado de la pila.
00:15:14Pueden ver cuántas veces está ocurriendo.
00:15:17Y ¿qué más pueden ver?
00:15:20Problemas similares.
00:15:21Uno... a ver si esto sigue funcionando.
00:15:25¡Oh, lo arregló!
00:15:26Vale. Les mostraré otra cosa la próxima vez que tengamos que esperar al agente.
00:15:30Dice que ya está arreglado.
00:15:32Veamos si puedo desplegarlo o probarlo en la vista previa.
00:15:37Hagamos eso.
00:15:39Muy bien.
00:15:39Voy a moverme y recoger algo.
00:15:41¡Oh, está funcionando!
00:15:42Genial. Así de fácil.
00:15:46Tenía un error.
00:15:48Le expliqué más o menos lo que estaba pasando.
00:15:51Incluso si no tienen tanta información sobre cómo reproducirlo,
00:15:55podrían darle menos detalles y simplemente decirle que busque errores.
00:15:59Podría preguntar: "¿Hay otros errores en el MCP de PostHog que debamos arreglar?"
00:16:09Diré que de hoy, para no irnos demasiado atrás en el historial.
00:16:12La otra cosa que quería mostrar es la grabación de sesiones, es una función genial.
00:16:21Puedo ver realmente... oh, no se ve muy bien aquí.
00:16:27Vaya, qué curioso.
00:16:28De acuerdo. Vamos a saltarnos esto, pero voy a investigar por qué pasa.
00:16:33Normalmente, podrías ver exactamente lo que hacen los usuarios.
00:16:36Supongo que por la tecnología que usamos en este juego,
00:16:42la grabación se está estropeando.
00:16:44Pero probablemente en otro tipo de aplicaciones... seguro que en otras aplicaciones sí funciona.
00:16:50Nunca me había pasado esto con ninguna otra aplicación.
00:16:51Así pueden ver cómo la gente usa su app y con qué problemas se topan.
00:16:58Ver ese video en vivo de lo que hacen ayuda mucho a contextualizar.
00:17:04Y te da muchísima más información que intentar mirar
00:17:08la actividad, los eventos o cosas así, o los registros.
00:17:13Bien, tenemos un par de errores más.
00:17:16Y esto es algo que también quiero recalcar.
00:17:18Como desarrollador, quizás no sepas todo lo que los usuarios encuentran en producción.
00:17:25Puede que no te lo informen.
00:17:26O que tú mismo no te hayas topado con ello.
00:17:28Por eso, tener visibilidad de todos los errores es superútil.
00:17:34En este caso, hay otros errores que están ocurriendo.
00:17:40Ah, parece que ambos fueron corregidos.
00:17:43Qué bien. ¿Alguna pregunta sobre esto?
00:17:47Quiero pasar ahora a las funciones de control o "feature flags".
00:17:51>> No hay preguntas en el chat por ahora, pero sí comentarios.
00:17:54Alguien dice que tienen muchas herramientas en un solo lugar, un plan gratuito muy generoso
00:18:01y una experiencia de desarrollador increíble en su plataforma, lo cual siempre da gusto oír.
00:18:05Tenía una pregunta, aunque seguro que la mencionarás en esta sección.
00:18:11Más allá de los errores, ¿qué otras cosas de gran valor puede hacer el MCP de PostHog
00:18:19para los usuarios de v0 que crees que la gente pasa por alto?
00:18:23>> Sí. Para mí, las "feature flags" y los experimentos son de lo más beneficioso.
00:18:30Creo que hay muchos equipos y aplicaciones que no los usan y deberían.
00:18:38Así que lo mostraré rápidamente.
00:18:40>> Sí, por supuesto.
00:18:41Una transición perfecta.
00:18:42>> Sí. Vamos a añadir... en este caso, tengo este juego.
00:18:46Ahora mismo no tengo forma de matar a los bichos.
00:18:48Específicamente, hay un bicho yendo de un lado a otro en esa pequeña plataforma.
00:18:52Y me cuesta mucho conseguir ese punto de datos.
00:18:55A mis usuarios también.
00:18:57Así que quiero crear una funcionalidad extra.
00:19:01Vamos a darle a mi erizo la capacidad de disparar láseres por los ojos.
00:19:16Pero quiero probar esto comparándolo con otra funcionalidad.
00:19:22Estoy pensando... láseres.
00:19:24Supongo que podríamos hacer lo clásico de Mario.
00:19:27También... bueno, empecemos creando una "feature flag" multivariante con láseres como una variante
00:19:43y la capacidad de saltar sobre los bichos para matarlos como otra variante.
00:19:52Y luego... con esto quiero mostrar un par de cosas.
00:19:59El MCP es muy potente.
00:20:02Puedes usarlo para casi todo lo que harías en el panel de control.
00:20:07Puedes hacerlo desde el panel.
00:20:10Se los enseñaré si vamos a aplicaciones.
00:20:17Y luego a "feature flags".
00:20:21También... casi todo lo que haces en el MCP lo puedes hacer en el chat de aquí.
00:20:25Si usan... abriré una nueva pestaña aquí.
00:20:29Ah, no hay forma de chatear en esta pestaña.
00:20:33Vaya.
00:20:34Lo perdí.
00:20:37Abriré un nuevo chat, aquí está.
00:20:39Podría darle una instrucción similar.
00:20:43La única diferencia es que este chat no tendrá la capacidad de actualizar mi código de v0, obviamente.
00:20:48Tengo que aceptarlo.
00:20:52Pero aún podría usarlo para gestionar las "feature flags".
00:20:55O aquí puedo crear una "feature flag", ya saben... y debería estar creándola
00:21:01ahora mismo.
00:21:02Aquí vamos.
00:21:03Experimento, crear.
00:21:04Podría crearlo a través de la interfaz de usuario.
00:21:07Lo estoy mostrando mediante el agente de v0 usando el MCP porque me parece que cuanto más
00:21:16pueda hacer en mi agente, como en v0, mejor.
00:21:20No quiero perder tiempo haciendo clics y aprendiendo una interfaz nueva.
00:21:24Aunque el panel es genial y me encanta la interfaz, prefiero
00:21:31pasar más tiempo construyendo directamente en v0.
00:21:35Genial.
00:21:36Ya configuró el experimento.
00:21:39Y establecimos algunas métricas.
00:21:40Esta es una de las claves del experimento: ¿cuál
00:21:47es la hipótesis que quieres probar?
00:21:49v0 se adelantó y creó una hipótesis por nosotros.
00:21:53Eso está bastante bien.
00:21:55Quizás quiera leerla y actualizarla.
00:21:58Dice que probará cuál de las dos opciones da mejores tasas de finalización del juego.
00:22:02Está bien.
00:22:03Tal vez mi objetivo sea la tasa de finalización.
00:22:05Pero quizás sea simplemente el tiempo que pasan jugando.
00:22:09Creo que la tasa de finalización tiene sentido.
00:22:13Así que la estableció como métrica principal.
00:22:16Primero hay que plantear una hipótesis.
00:22:18¿Qué estoy probando?
00:22:19En este caso, si es más entretenido pisar a los bichos o usar el láser.
00:22:26Luego configuramos las métricas principales.
00:22:29Y también está el concepto de métricas secundarias, que creo que son superimportantes.
00:22:33Las métricas principales son los objetivos principales que quieres alcanzar.
00:22:38Pero con cualquier función que añadas o cambio que hagas, puede haber
00:22:43efectos secundarios.
00:22:44En este caso, quizás maten más o menos bichos por sesión.
00:22:49A lo mejor terminan más el juego pero matan menos bichos.
00:22:52Probablemente sea poco común.
00:22:53O, por ejemplo, las muertes por sesión es otra cosa a observar.
00:22:57Siempre que configures un experimento, es importante pensar: ¿cuál
00:23:02es mi meta?
00:23:03Y luego, ¿qué cosas podría estar afectando este cambio que quizás no sean
00:23:09el objetivo principal, pero de las que quiero estar al tanto al tomar la decisión?
00:23:14Una pregunta rápida, Brooker.
00:23:17Si alguien por error configura mal la métrica del objetivo al principio, ¿qué tan fácil es en PostHog
00:23:23ajustar ese experimento sin perder todo en v0?
00:23:30Sí, podrías hacerlo de nuevo mediante el MCP, el chat o en la interfaz de aquí.
00:23:36Hay un pequeño icono de lápiz junto a la métrica.
00:23:39Solo haces clic ahí.
00:23:41Y, digamos que quieres cambiar de "juego completado" a "tiempo pasado en
00:23:46la aplicación" o algo similar.
00:23:47Harías clic aquí y buscarías un evento o... quizás decidimos
00:23:53que queremos ver si los usuarios se están yendo más rápido.
00:23:58Así que podría cambiarlo a "abandono de página".
00:24:00Y en este caso, el objetivo sería que esa métrica disminuya.
00:24:03Quiero que la gente abandone la página con menos frecuencia.
00:24:08Es así de fácil.
00:24:10También puedes usar el MCP para hacerlo, que personalmente me resulta mucho más sencillo.
00:24:16Pero bueno, está bien ver las dos formas.
00:24:19Sí.
00:24:20Genial.
00:24:21Sí.
00:24:22Y lo recalculará.
00:24:23A veces lo que me pasa es que lanzo un experimento,
00:24:27veo los resultados y eso me ayuda a darme cuenta de que tengo otra pregunta
00:24:32que quiero hacer.
00:24:33Como dijiste, quiero actualizar las métricas que estoy siguiendo.
00:24:36Hay veces en las que quizás no tengo un evento o una forma de medir eso todavía.
00:24:43Ese es otro punto donde el MCP puede ser muy útil.
00:24:46Puedes decir algo como: "añade un evento".
00:24:48Estoy pensando en un buen ejemplo... no sé, tal vez saltos.
00:24:53Podría decir: "añade un evento para cada vez que el erizo salte".
00:25:02En ese caso, solo tendrías esos eventos... bueno, dependiendo de lo que estés
00:25:08midiendo en la mayoría de estos casos.
00:25:10Probablemente solo se registrarían desde el momento en que los añades a tu app.
00:25:15Y entonces puedes cambiar la duración de tu experimento para que empiece
00:25:21en un momento determinado.
00:25:22También podrías segmentar... Oh, perdón.
00:25:24Lo siento mucho.
00:25:25Y si cambias eso a mitad del experimento, ¿hay alguna
00:25:31recomendación sobre si se debe reiniciar la prueba o es seguro seguir recogiendo datos
00:25:38en el mismo experimento?
00:25:40Buena pregunta.
00:25:42Mientras seas consciente de los diferentes cambios que puedan estar afectando a lo que
00:25:48estás haciendo.
00:25:49No veo problema en mantener el mismo experimento en marcha.
00:25:55Podría haber un escenario donde haya otros cambios ocurriendo al mismo tiempo
00:25:59que podrían influir en tus experimentos.
00:26:02Así que debes estar muy atento a todas las pruebas que estás realizando y
00:26:06cómo podrían afectarse entre sí.
00:26:09Por eso creo que, por lo general... en este caso, hicimos una prueba multivariante,
00:26:15donde tengo "pisotón" y "láser", aunque creo que puso el láser como control.
00:26:20Pero quizás quiera un control que sea "sin arma".
00:26:30Puede ser útil agrupar todo eso en un solo experimento para no tener
00:26:35problemas donde diferentes experimentos compitan entre ellos.
00:26:38¿Tiene sentido?
00:26:39Sí, tiene sentido.
00:26:41Sí.
00:26:42A ver por dónde vamos... oh, no añadí eso a la cola.
00:26:45Bien, ya está.
00:26:47Ya tenemos los ojos láser.
00:26:48Veamos qué pasa si usamos la aplicación ahora.
00:26:51Vale, genial.
00:26:52Tengo un láser, pero no está matando a los enemigos.
00:26:57Qué mal.
00:26:58Bueno, esto es algo con lo que podríais encontraros.
00:27:02No le di las instrucciones adecuadas a v0.
00:27:05Así que no vamos a culpar a v0 por eso.
00:27:07Solo dije: “dispara láseres por los ojos”.
00:27:10Pero no le pedí que matara a los bichos con el láser.
00:27:12También se pueden segmentar diferentes usuarios.
00:27:16Podría decir, por ejemplo: “asigna mi usuario a la función de pisotón”.
00:27:23Y luego veremos si es capaz de identificar quién soy.
00:27:26Esto es forzar un poco los límites del agente y del MCP, pero el MCP tiene
00:27:31la capacidad de localizar a un usuario.
00:27:35Y después configurar la variante del experimento para ese usuario específico.
00:27:41Se pueden dirigir diferentes cohortes a diferentes variantes.
00:27:46Si quieres que, por ejemplo, todos los de Australia tengan ojos láser, también
00:27:51podrías hacerlo.
00:27:53Y bueno, creo que se nos está acabando el tiempo, ¿no?
00:27:56No recuerdo cuánto...
00:27:57Sí, así es.
00:27:58De hecho, acabo de comprobarlo.
00:27:59Pero sí.
00:28:00Vale, de acuerdo.
00:28:02Podría seguir con esto,
00:28:03pero si tenéis alguna otra pregunta o algo que no haya cubierto,
00:28:08sería interesante saberlo.
00:28:09Sí, nos ha llegado otra pregunta: para los usuarios de v0 que son nuevos en
00:28:15la experimentación, ¿tenéis alguna lista de comprobación o algo similar
00:28:21para evitar configurar un experimento “malo” o engañoso?
00:28:27Sí, bueno... no estoy seguro al cien por cien.
00:28:31Sé que tenemos guías.
00:28:32No quiero ponerme a buscarlas ahora en directo,
00:28:34pero sin duda podría facilitaros una guía después.
00:28:38Podríamos...
00:28:39Sí, podemos adjuntarla a la sección de recursos de este chat.
00:28:43Sí, por supuesto.
00:28:44Claro.
00:28:45Y también podríais consultar a la IA; animo a la gente a
00:28:50preguntar en el chat o explorar la interfaz. Hay muchas cosas útiles, como
00:28:55la hipótesis que mencioné y que no aparecía en v0.
00:28:58Así que podría ser útil abrir la interfaz y ver qué otras opciones hay
00:29:02disponibles para probar.
00:29:05O incluso preguntarle a v0: “¿Qué cosas me
00:29:10estoy perdiendo aquí?
00:29:11¿Qué más podemos hacer con esto?”.
00:29:13Os animo a que aprovechéis v0 todo lo posible para casos así,
00:29:18o la IA de PostHog, que es otra opción para chatear dentro de PostHog.
00:29:23Vaya, ni siquiera sabía que teníais eso.
00:29:26Qué genial.
00:29:27Supongo que pregunto esto en todas nuestras sesiones de integración, pero
00:29:35¿qué estáis preparando a largo plazo?
00:29:36¿Algo que puedas compartir con nosotros?
00:29:38Sí, vemos el futuro del desarrollo de software y productos como algo más autónomo.
00:29:45Y creo que ya está empezando a ocurrir,
00:29:47aunque todavía queda camino por recorrer.
00:29:53Cosas como lo que mostré sobre la resolución de errores... no creo que falte mucho
00:29:59para que eso sea lo estándar en una aplicación; es decir, tener una app funcionando
00:30:04y que haya algo en segundo plano corrigiendo errores sin que yo
00:30:09tenga que decírselo, y quizás recibir algún tipo de informe al respecto.
00:30:15Al final, en el futuro, no quiero tener que pedirle a una IA que busque errores,
00:30:20ni quiero recibir una alerta en mitad de la noche
00:30:24que me despierte por un fallo.
00:30:26Creo que, en el futuro, algún tipo de sistema —ya sea PostHog,
00:30:35Vercel o ambos trabajando juntos—
00:30:38se encargará de recopilar información. Los errores son solo una parte.
00:30:43Está la grabación de sesiones que mostré, el análisis de productos, los experimentos...
00:30:49¿Realmente necesito crear diferentes métricas manualmente?
00:30:53De hecho, fue interesante ver que aquí v0
00:30:57ya seleccionó algunas métricas interesantes por nosotros.
00:31:00Pero probablemente tendré un agente monitorizando todo eso en el futuro y
00:31:05realizando actualizaciones de código sin que yo tenga que darle instrucciones
00:31:14tan específicas. Mi labor será guiar la estrategia, como por ejemplo
00:31:19¿qué tipo de experiencia quiero para mi juego?
00:31:20¿Cuáles son los objetivos métricos que persigo?
00:31:22Pero en cuanto a lo más básico, creo que gran parte será
00:31:26gestionado de forma autónoma.
00:31:28Sí, desarrollo autónomo.
00:31:30Exacto.
00:31:31Me encanta esa visión porque coincide totalmente con lo que
00:31:37estamos hablando en Vercel y también con v0.
00:31:40Se trata de cerrar el círculo: desde el despliegue,
00:31:43pasando por la observación en PostHog, hasta corregir e iterar automáticamente.
00:31:49Es fantástico.
00:31:50Una última pregunta antes de terminar, ya que sé que estamos en el tiempo límite.
00:31:56¿Cómo puede la gente involucrarse en la comunidad de PostHog?
00:32:00Mencioné al principio que PostHog es de código abierto.
00:32:03¿Aceptáis contribuciones?
00:32:05No sé si lo he dicho bien,
00:32:06pero es lo que leí.
00:32:07Sí.
00:32:08Al cien por cien.
00:32:09Recibimos Pull Requests de todas partes que revisamos constantemente.
00:32:10También hay un foro de PostHog donde podéis hacer preguntas.
00:32:16Organizamos eventos en vivo.
00:32:21Ojalá tuviera la URL a mano, pero te la pasaré después.
00:32:22Sí, por supuesto.
00:32:26Eso, hay eventos en vivo.
00:32:27Solo tenéis que registraros.
00:32:29Usad la aplicación.
00:32:30Decidnos qué os parece.
00:32:31Contactadnos en X, LinkedIn o lo que uséis.
00:32:32Hacednos saber vuestra opinión, somos muy activos en esas plataformas.
00:32:37Increíble.
00:32:40Muchas gracias, Brooker.
00:32:41Esto ha sido fantástico.
00:32:43Y para todos los que nos veis, si tenéis más preguntas, dejadlas en el
00:32:44chat y nos aseguraremos de que el equipo de PostHog las responda.
00:32:49Pero sí, muchas gracias, Brooker.
00:32:54Agradezco mucho tu tiempo aquí.
00:32:56Gracias a vosotros.
00:32:58Sí.
00:32:59Gracias por invitarme.
00:33:00Genial.
00:33:02Muchas gracias a todos por uniros a este chat y a nuestra sesión de hoy.
00:33:03Por si no lo sabéis, organizamos una sesión comunitaria en vivo casi cada semana.
00:33:08Si vais a [community.vercel.com/events](https://www.google.com/search?q=https://community.vercel.com/events), veréis un calendario estupendo donde
00:33:14publicamos todos nuestros eventos, tanto presenciales como online.
00:33:21Decidnos: ¿qué próxima integración os gustaría ver en nuestra sesión comunitaria?
00:33:24Y sin duda intentaremos traerlos.
00:33:31Increíble.
00:33:33Bueno, muchas gracias a todos por acompañarnos hoy.
00:33:34Espero veros en nuestra próxima sesión en vivo.
00:33:39¡Adiós!

Key Takeaway

La integración de PostHog con v0 y Vercel revoluciona el ciclo de desarrollo al permitir la detección, diagnóstico y corrección autónoma de errores mediante IA, junto con la validación rápida de funciones a través de experimentos basados en datos.

Highlights

La integración directa entre PostHog y v0 permite a los desarrolladores pasar de una idea a un experimento en vivo sin salir de su entorno de desarrollo.

El uso del Protocolo de Contexto de Modelo (MCP) otorga al agente de v0 la capacidad de recopilar datos, gestionar errores y llamar a funciones de PostHog de forma autónoma.

PostHog facilita la implementación de pruebas A/B y 'feature flags' multivariantes para validar hipótesis de producto mediante métricas reales en producción.

La integración con Vercel simplifica la gestión de variables de entorno y claves de API, eliminando la configuración manual tediosa y propensa a errores.

El seguimiento de errores y las grabaciones de sesiones en PostHog proporcionan una visibilidad crítica sobre fallos que los usuarios experimentan pero no siempre reportan.

La visión futura del desarrollo se inclina hacia sistemas autónomos donde la IA identifica y corrige errores automáticamente basándose en datos de observabilidad.

PostHog se mantiene como una plataforma de código abierto que fomenta la colaboración comunitaria a través de Pull Requests, foros y eventos en vivo.

Timeline

Introducción y bienvenida a la sesión comunitaria

Pauline Navas, del equipo de comunidad de Vercel, inicia la sesión dando la bienvenida a los asistentes de diversas plataformas como X, YouTube y LinkedIn. Explica que estas sesiones en vivo son fundamentales para conectar directamente con los usuarios y entender qué están construyendo sobre la infraestructura de Vercel. Se fomenta la participación activa invitando a los espectadores a compartir su ubicación y unirse al chat oficial en la plataforma de la comunidad. Este segmento establece un ambiente colaborativo y resalta la importancia de las integraciones dentro del Marketplace de Vercel. Es el punto de partida para presentar la colaboración especial con PostHog enfocada en la velocidad de lanzamiento y validación.

Presentación de PostHog y su integración con v0

Pauline introduce a PostHog como una plataforma de análisis de productos de código abierto que abarca herramientas de 'feature flags', pruebas A/B y rastreo de eventos. La gran novedad destacada es la integración directa con v0, lo que permite configurar analíticas y experimentos durante el proceso de construcción inicial en lugar de hacerlo a posteriori. Esta sinergia busca que los desarrolladores no tengan que salir de su flujo de trabajo para entender el comportamiento de los usuarios. Se menciona que esta capacidad de pasar de la idea al experimento en vivo es un cambio de paradigma en el desarrollo ágil. La sección concluye preparando el terreno para la intervención técnica de Brooker, ingeniero de PostHog.

Casos de uso: Visibilidad en producción y manejo de errores

Brooker, ingeniero de producto en PostHog, explica por qué es vital tener visibilidad sobre cómo los usuarios reales interactúan con una aplicación recién desplegada. Plantea el escenario común donde una app funciona perfectamente en el entorno de vista previa pero presenta fallos inesperados una vez que llega a producción. Destaca que PostHog permite llevar ese contexto de error directamente al agente de v0 para que la IA entienda el problema y proponga soluciones inmediatas. Esto elimina la necesidad de buscar manualmente en logs complejos o intentar reproducir errores mediante las herramientas de desarrollo del navegador. Brooker subraya que tener esta visibilidad centralizada ahorra tiempo crítico y mejora la calidad del producto final.

Demostración de instalación e integración con Vercel

Durante esta demostración técnica, se muestra el proceso paso a paso para instalar la integración de PostHog desde el Marketplace de Vercel. Brooker enfatiza que uno de los mayores beneficios es la gestión automática de variables de entorno y claves de API, evitando que el desarrollador deba manejarlas manualmente. Se explica cómo la integración vincula el proyecto de Vercel con un proyecto de PostHog de forma transparente y segura. Brooker también menciona la existencia de un plan gratuito generoso que permite a los nuevos proyectos despegar sin costos iniciales de análisis. La fluidez del proceso demuestra el compromiso de ambas plataformas por ofrecer una experiencia de desarrollador (DX) excepcional y sin fricciones.

Corrección de errores en vivo mediante el MCP de PostHog en v0

Brooker presenta un juego llamado 'Hog Hop' que tiene un error de congelación al recolectar ciertos puntos de datos en producción. Utiliza el Protocolo de Contexto de Modelo (MCP) en v0 para conectar la cuenta de PostHog y permitir que la IA analice los fallos reportados automáticamente. El agente de v0 identifica el error, propone una corrección en el código y el problema se resuelve en cuestión de segundos tras el despliegue de la vista previa. Se mencionan funciones adicionales como la grabación de sesiones, que permite ver visualmente lo que el usuario estaba haciendo antes del fallo. Este segmento demuestra el poder de la IA cuando tiene acceso a datos de observabilidad en tiempo real para mantener la salud de la aplicación.

Configuración de experimentos y 'feature flags' multivariantes

En esta sección, se explora cómo crear funcionalidades experimentales, como dar al personaje del juego la capacidad de disparar láseres o pisar enemigos. Brooker utiliza el MCP para configurar una 'feature flag' multivariante y establecer hipótesis de éxito basadas en la tasa de finalización del juego. Se discute la importancia de definir métricas principales y secundarias para entender los efectos colaterales de cualquier cambio en el producto. El agente de v0 ayuda a implementar estas variantes y a definir los objetivos del experimento directamente desde el chat. También se aborda la capacidad de segmentar usuarios por regiones o atributos específicos para dirigir las pruebas de forma más granular. Brooker aconseja mantener los experimentos organizados para evitar conflictos entre diferentes pruebas concurrentes.

Visión futura: Desarrollo autónomo y recursos comunitarios

La sesión concluye con una reflexión sobre el futuro del desarrollo de software, donde Brooker predice un entorno cada vez más autónomo. La visión es que sistemas integrados de observabilidad y desarrollo, como PostHog y Vercel, puedan corregir errores y optimizar métricas sin intervención humana constante. Se invita a la comunidad a participar en PostHog, destacando que es un proyecto de código abierto que acepta contribuciones y ofrece foros de soporte. Pauline cierra el evento invitando a los usuarios a consultar el calendario de sesiones comunitarias y a sugerir futuras integraciones para analizar. Se resalta que el objetivo final es cerrar el ciclo entre despliegue, observación y mejora automática del producto.

Community Posts

View all posts