▲ Session communautaire : Déployez et validez plus vite avec PostHog + v0

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

Transcript

00:00:00[SILENCE]
00:00:30[SILENCE]
00:01:00[SILENCE]
00:01:29>> Bonjour à tous.
00:01:32Bienvenue à la session communautaire Versailles de cette semaine.
00:01:36Nous sommes ravis de vous accueillir.
00:01:41C'est vraiment agréable de faire ces sessions en direct, car j'ai l'impression
00:01:44de ne pas en avoir fait depuis un moment.
00:01:46Alors, salut tout le monde.
00:01:47[RIRES] Si c'est votre première fois dans l'une de nos sessions,
00:01:53je suis Pauline Navas, de l'équipe communautaire ici chez Versailles.
00:01:57Vous m'avez peut-être croisée sur nos espaces communautaires,
00:02:03sur [www.versailles.com](https://www.google.com/search?q=https://www.versailles.com), ou sur X ou LinkedIn, où je réponds aux questions
00:02:08et j'échange avec la communauté pour comprendre ce que vous construisez
00:02:12sur Versailles.
00:02:13C'est donc toujours une opportunité pour nous de connecter en direct
00:02:18avec notre communauté, nos clients et nos utilisateurs.
00:02:22Génial, c'est super de vous voir déjà si nombreux.
00:02:25Je vois un “bonsoir” d'Adam dans le chat.
00:02:29Bonjour, bonjour, bonjour.
00:02:31N'hésitez pas à envoyer un message pour nous dire d'où vous nous suivez.
00:02:36Si vous regardez ceci sur X, YouTube ou LinkedIn
00:02:39et que vous voulez rejoindre le chat en direct, allez sur [community.versailles.com/live](https://www.google.com/search?q=https://community.versailles.com/live).
00:02:46Vous trouverez la session tout en haut et pourrez laisser un commentaire.
00:02:53Pour la session d'aujourd'hui, je suis toujours impatiente quand on parle
00:02:58des intégrations de la marketplace Versailles, car c'est fascinant de voir
00:03:03ce qu'on peut bâtir sur Versailles grâce à elles.
00:03:07Aujourd'hui, nous recevons Posthog.
00:03:11Si vous ne les connaissez pas encore, pour faire court, Posthog
00:03:16est une plateforme d'analyse de produits open source.
00:03:19C'est un mélange de feature flags, de tests A/B, de suivi d'événements...
00:03:25en gros, tous les outils nécessaires pour comprendre ce qui se passe réellement
00:03:29quand les gens utilisent votre produit.
00:03:31Ce qui rend la session d'aujourd'hui si spéciale, c'est que Posthog
00:03:36s'intègre désormais directement avec vZero.
00:03:38Cela signifie que vous pouvez passer d'une idée à une expérience en direct
00:03:43sans jamais quitter votre outil de création.
00:03:45Fini l'époque où l'on déploie d'abord pour s'occuper de l'analytique plus tard.
00:03:50Vous pouvez configurer les feature flags, lancer des tests et suivre les événements
00:03:55personnalisés directement pendant la phase de développement.
00:03:58Bon, j'arrête de bavarder, mais salut à tous, je vois que vous êtes nombreux.
00:04:06C'est top.
00:04:06Dites-nous d'où vous venez, les amis.
00:04:09Super.
00:04:10Sans plus attendre, j'aimerais accueillir notre invité, Brooker, de chez Posthog.
00:04:16Salut Brooker.
00:04:17- Salut.
00:04:17Ravi d'être ici.
00:04:19Comme Pauline l'a dit, je m'appelle Brooker.
00:04:21Je suis ingénieur produit dans l'équipe croissance.
00:04:25Pour commencer, je vais vous présenter un peu ce qu'offre Posthog,
00:04:30et pourquoi il est intéressant d'utiliser Posthog dans vZero.
00:04:34Ensuite, nous passerons en revue quelques cas d'usage dans Vercel et vZero.
00:04:41Je ferai une démo en direct.
00:04:42Nous allons concrètement implémenter certains de ces cas d'usage.
00:04:46Il y en a deux que je veux aborder en particulier. Mais d'abord,
00:04:49pourquoi s'intéresser à Posthog en tant qu'utilisateur de vZero
00:04:54et de Vercel ?
00:04:56Imaginons : vous utilisez vZero, vous créez l'app la plus cool au monde, vous la déployez...
00:05:02mais comment savoir si elle fonctionne bien ?
00:05:06Comment comprendre comment les gens l'utilisent, ce qu'ils aiment,
00:05:11ce qu'ils n'aiment pas ?
00:05:12Comment comprendre quand quelque chose ne va pas ?
00:05:15Souvent, on déploie une application qui fonctionne parfaitement
00:05:19en mode aperçu (preview).
00:05:20Vous avez fait vos propres tests, mais une fois en production,
00:05:26elle rencontre des problèmes que vous n'aviez pas prévus.
00:05:29C'est là qu'une exception peut survenir, et il est crucial pour vous
00:05:33d'avoir de la visibilité là-dessus, et surtout d'apporter cette visibilité
00:05:39et ce contexte directement dans vZero, dans l'agent. Ainsi, l'agent peut
00:05:45comprendre tout ce qui se passe en production et corriger le problème
00:05:50sans que vous ayez besoin de courir partout pour rassembler les infos,
00:05:55que ce soit dans vos logs, votre système d'erreurs, ou en essayant
00:05:59de reproduire le bug avec des copier-coller depuis les Chrome DevTools.
00:06:02Non pas que j'aie déjà dû faire ça, bien sûr.
00:06:04- On est tous passés par là, je pense.
00:06:07- C'est clair.
00:06:09Le premier cas d'usage que je veux montrer est la gestion des erreurs.
00:06:13Le second concerne les feature flags et les tests A/B.
00:06:17Personnellement, j'apprécie énormément cette méthode de développement.
00:06:23Imaginez : vous travaillez avec votre équipe.
00:06:26Vous discutez d'une fonctionnalité que vous voulez ajouter.
00:06:29Mais vous avez un avis différent de celui de votre collègue
00:06:33sur la manière de l'implémenter.
00:06:34Vous voulez faire comme ceci.
00:06:36Ils veulent faire comme cela.
00:06:39Une excellente façon de trancher est de faire les deux, puis de les tester
00:06:42en production pour voir laquelle donne les meilleurs résultats.
00:06:46C'est ce que nous allons explorer également.
00:06:48Sans plus tarder, je vais partager mon écran.
00:06:51Je vais vous montrer tout le processus de bout en bout.
00:06:55Une petite partie est déjà prête sur ce compte.
00:06:58Je vais donc basculer sur un compte où Posthog n'est pas encore installé.
00:07:06Dites-moi quand mon écran s'affiche.
00:07:09- On voit ton écran, Brooker.
00:07:11C'est parti.
00:07:11- Parfait.
00:07:12OK.
00:07:12Nous sommes dans Vercel.
00:07:14Nous allons dans les intégrations et nous cherchons Posthog.
00:07:18Je ne sais pas pourquoi il dit... ah, “Browse Marketplace”.
00:07:21Allons dans la Marketplace.
00:07:22On cherche Posthog, on le sélectionne et on clique sur “Install”.
00:07:29On me demande si je veux créer un compte ou lier un compte existant.
00:07:32Si vous avez déjà un compte Posthog, vous pouvez les lier.
00:07:35Et ce que cela va faire pour moi... installons-le ici.
00:07:39Ça va... laissez-moi juste... désolé, je n'arrive pas à cliquer et parler en même temps.
00:07:46Pourquoi dois-je saisir une adresse de facturation ?
00:07:48D'accord.
00:07:49Vous remplissez ce formulaire.
00:07:52Cliquez sur “Continue”.
00:07:53Cela va synchroniser vos... je vais vous montrer.
00:07:59Cela va synchroniser vos variables d'environnement. Si je vais dans Paramètres...
00:08:06Enfin, je vais aller dans l'aperçu (Overview).
00:08:09Ah, je pensais qu'il était déjà installé.
00:08:14Faisons ça rapidement.
00:08:15Nous allons l'installer pour un projet.
00:08:17Je choisis le projet sur lequel je veux l'installer.
00:08:20Continuer.
00:08:22Super.
00:08:23Voilà... j'ai choisi le projet.
00:08:25Voyons voir.
00:08:30Désolé, je pensais en avoir un ici.
00:08:32Ah, je sais ce que c'est.
00:08:33Je n'ai pas le bon compte d'affiché.
00:08:35Je crois que je suis sur celui-ci.
00:08:37- C'est ce qu'il y a de mieux : déboguer et montrer les étapes en direct.
00:08:41C'est génial.
00:08:42- Ouais.
00:08:44OK, c'est bien connecté ici.
00:08:47Ce que je voulais montrer, le point fort de cette intégration, c'est que vous
00:08:51n'avez pas à gérer les variables d'environnement vous-même.
00:08:55Si vous avez l'habitude, vous savez que ce n'est pas drôle, surtout quand
00:08:59il faut renouveler ses clés, ce qui est pourtant essentiel.
00:09:03L'intégration Vercel avec PostHog gère tout cela pour vous.
00:09:08Il suffit de suivre les étapes d'installation,
00:09:12comme je viens de le montrer.
00:09:13Elle gère aussi la facturation, et on a une offre gratuite très généreuse.
00:09:17J'espère donc que vous n'aurez pas à vous en soucier au début, jusqu'à ce
00:09:21que votre produit décolle, et là, ce sera le cadet de vos soucis.
00:09:24Mais voilà, cela va synchroniser vos variables d'environnement.
00:09:28Les éléments principaux ici sont l'hôte PostHog... je ne vais pas les montrer
00:09:33pour ne pas me faire gronder, mais l'hôte est juste une URL.
00:09:39Ce sera quelque chose comme us.i.posthog.com.
00:09:43La clé PostHog est la partie importante : elle va dire à PostHog,
00:09:48elle va identifier votre projet auprès de PostHog.
00:09:50Quand votre application tourne en production et que les erreurs, l'usage
00:09:58et les feature flags sont renvoyés à PostHog, c'est cette clé qui va
00:10:02faire le lien entre votre produit et un projet PostHog.
00:10:07C'est vraiment utile que tout soit configuré automatiquement ici.
00:10:12Des questions sur la partie Vercel ?
00:10:16C'est assez simple.
00:10:17Je suis passé un peu vite et j'ai eu quelques soucis, désolé pour ça.
00:10:21En gros, vous l'installez, vous le liez au projet Vercel souhaité,
00:10:25et c'est parti.
00:10:28Nous avons aussi des guides de démarrage ici.
00:10:32Vous pouvez voir vos feature flags ici s'ils sont configurés.
00:10:35Je n'en ai pas encore sur celui-ci, mais ça viendra dans une minute.
00:10:40- Oui, c'est super.
00:10:41Il n'y a pas de questions pour l'instant, ce qui prouve que c'est très fluide.
00:10:47J'ai demandé dans le chat si quelqu'un avait déjà testé cette intégration.
00:10:51Si c'est le cas, dites-le nous et posez vos questions au fur et à mesure.
00:10:54- Oui, et n'hésitez pas à m'interrompre.
00:10:58Passons maintenant à la démo.
00:10:59J'ai une application qui tourne.
00:11:01J'ai créé un petit jeu.
00:11:02Il s'appelle Hog Hop.
00:11:04Voici un petit PostHog.
00:11:06Il y a des insectes qui courent partout, et je dois collecter des données.
00:11:12Max saute partout pour ramasser les points de données.
00:11:15Mais j'ai un bug.
00:11:16Quand je collecte certains points, tout se fige.
00:11:21Je ne peux plus rien faire.
00:11:23J'ai rencontré ça en production et j'ai besoin d'aide pour comprendre.
00:11:28Comme je l'ai dit, je pourrais ouvrir les DevTools.
00:11:32Je pourrais regarder les logs Vercel pour essayer de trouver des erreurs.
00:11:41Mais je vais vous montrer comment vous en passer.
00:11:44Dans v0, vous pouvez rassembler tout le contexte nécessaire sur l'erreur
00:11:50et la corriger directement.
00:11:51D'abord, je montre comment ajouter le MCP.
00:11:54En bas à gauche de votre chat dans v0, il y a un petit bouton “+”
00:12:01qui permet d'accéder aux MCP.
00:12:04Cliquez simplement sur “Add MCP”.
00:12:06PostHog est configuré comme un MCP prédéfini.
00:12:10Je l'ai déjà connecté, donc je ne vais pas le déconnecter.
00:12:13Mais vous cliquez sur le bouton plus, et on vous demandera de vous
00:12:18connecter à votre compte PostHog.
00:12:19Une chose que je n'ai pas montrée : quand vous créez cette intégration
00:12:25entre PostHog et Vercel, vous avez un bouton “Open in PostHog”.
00:12:30Cela me connecte directement à PostHog sans avoir à gérer d'identifiants.
00:12:36Je suis connecté ici, et dans v0, quand je veux connecter le MCP,
00:12:42je clique pour authentifier, et un onglet PostHog s'ouvrira pour valider
00:12:48le MCP.
00:12:50Je viens de réaliser que je n'ai pas défini ce qu'est un MCP, désolé.
00:12:52MCP signifie Model Context Protocol. C'est en gros un moyen de donner
00:12:58à l'agent v0 la capacité de rassembler des informations ou d'appeler
00:13:03des fonctions connectées à ce compte.
00:13:07Dans ce cas, on dit : “Hé v0, si tu as besoin de poser des questions ou
00:13:14de gérer des choses dans PostHog...” et c'est un produit très complet,
00:13:19le MCP de PostHog permet de faire énormément de choses.
00:13:24Je vais vous montrer... nous avons une doc... PostHog Docs, Model Context Protocol.
00:13:29Cela vous montre tout ce que vous pouvez faire.
00:13:33Ne soyez pas trop impressionné par cette liste.
00:13:35Tout cela est chargé dans l'agent.
00:13:36Vous pourriez d'ailleurs demander : "Que puis-je faire avec l'MCP de PostHog ?"
00:13:42Et il vous répondra.
00:13:43Assurez-vous simplement que ce petit bouton est bien activé ici.
00:13:50Et voilà. Ce que je voulais montrer ici, encore une fois,
00:13:55c'est que quand j'essaie de collecter ce troisième point de données, j'ai un bug.
00:14:00Ça freeze tout simplement.
00:14:01Je vais donc décrire cela ici.
00:14:04Il m'a indiqué tout ce que je pouvais faire avec l'MCP PostHog.
00:14:08Je vais donc décrire le problème à l'agent.
00:14:10Je vais lui dire : "Quand je collecte des points de données, parfois ça freeze.
00:14:23Peux-tu trouver le bug via les erreurs de l'MCP PostHog et le corriger pour moi ?"
00:14:35Pendant qu'il s'en occupe, je vais vous montrer le tableau de bord PostHog.
00:14:39Dans PostHog, je peux aller dans les applications, puis dans le suivi des erreurs.
00:14:47Comme je l'ai dit, PostHog permet de faire énormément de choses.
00:14:50Il y a donc beaucoup de fonctionnalités que vous pouvez explorer.
00:14:55Nous nous concentrons sur quelques-unes pour vous donner une idée concrète du potentiel.
00:15:01Si vous avez l'esprit technique et voulez voir ce qui se passe avec ces erreurs,
00:15:04vous pouvez ouvrir ceci et voir, par exemple,
00:15:11cliquer sur l'erreur pour voir une trace de la pile (stack trace).
00:15:14Vous pouvez voir combien de fois elle s'est produite.
00:15:17Et quoi d'autre ?
00:15:20Les problèmes similaires.
00:15:21Voyons si cela fonctionne toujours.
00:15:25Oh, il l'a corrigé !
00:15:26D'accord. Je vous montrerai autre chose la prochaine fois qu'on devra attendre l'agent.
00:15:30Il dit donc qu'il a corrigé le problème.
00:15:32Voyons si je peux déployer ou tester cela dans l'aperçu.
00:15:37Faisons ça.
00:15:39Très bien.
00:15:39Je vais bouger un peu, collecter quelque chose.
00:15:41Oh, ça marche !
00:15:42Génial. C'est aussi simple que ça.
00:15:46J'avais un bug.
00:15:48J'ai expliqué à l'agent ce que je voyais se passer.
00:15:51Même si vous n'avez pas beaucoup d'infos pour le reproduire,
00:15:55vous pourriez lui en donner moins et juste lui dire de chercher des erreurs.
00:15:59Je pourrais demander : "Y a-t-il d'autres erreurs dans l'MCP PostHog à corriger ?"
00:16:09Je vais préciser "aujourd'hui" pour ne pas remonter trop loin dans l'historique.
00:16:12L'autre chose que je voulais montrer, c'est le replay de session, une fonction super cool.
00:16:21Je peux voir concrètement... oh, le rendu n'est pas terrible ici.
00:16:27C'est intéressant.
00:16:28Bon, on va passer ça, mais je vais regarder de plus près.
00:16:33Normalement, vous pouvez voir exactement ce que font les utilisateurs.
00:16:36C'est probablement dû à la technologie utilisée pour ce jeu,
00:16:42l'enregistrement semble avoir un problème.
00:16:44Mais sur d'autres types d'applications, ça fonctionne parfaitement.
00:16:50Je n'avais jamais vu ça sur une autre appli.
00:16:51On peut voir comment les gens utilisent l'appli et les obstacles qu'ils rencontrent.
00:16:58Voir cette vidéo en direct de leurs actions aide vraiment à contextualiser.
00:17:04C'est bien plus informatif que d'essayer d'analyser
00:17:08l'activité, les événements ou les logs.
00:17:13Bien, nous avons quelques autres erreurs.
00:17:16C'est un point sur lequel je veux insister.
00:17:18En tant que développeur, vous ne savez pas forcément tout ce que les gens vivent en production.
00:17:25Ils ne vous font pas toujours de rapport.
00:17:26Et vous n'avez peut-être jamais rencontré le bug vous-même.
00:17:28Avoir une visibilité sur toutes les erreurs est donc extrêmement précieux.
00:17:34Dans ce cas précis, nous avons quelques autres erreurs en cours.
00:17:40Oh, on dirait qu'elles ont toutes les deux été corrigées.
00:17:43Génial. Des questions là-dessus ?
00:17:47Je voudrais passer aux feature flags (drapeaux de fonctionnalités).
00:17:51Pas de questions dans le chat pour l'instant, mais il y a des commentaires.
00:17:54Quelqu'un dit qu'avoir tous ces outils au même endroit, une offre gratuite généreuse
00:18:01et une super expérience développeur sur leur plateforme, c'est top.
00:18:05J'avais une question d'ailleurs, tu vas sûrement l'aborder après.
00:18:11Mais à part les erreurs, quelles sont les autres fonctions à haute valeur ajoutée
00:18:19de l'MCP PostHog que les utilisateurs de v0 ont tendance à ignorer ?
00:18:23Pour moi, les feature flags et les expérimentations sont parmi les plus bénéfiques.
00:18:30Beaucoup d'équipes et d'applications devraient les utiliser mais ne le font pas.
00:18:38Je vais vous montrer ça rapidement.
00:18:40Oui, absolument.
00:18:41Transition parfaite.
00:18:42Oui. Alors, ajoutons... dans ce cas, j'ai ce jeu.
00:18:46Je n'ai pas encore de moyen d'éliminer les insectes.
00:18:48Surtout celui-là, il y a ce bug qui fait des va-et-vient sur cette plateforme.
00:18:52J'ai beaucoup de mal à récupérer ce point de données.
00:18:55Et mes utilisateurs aussi.
00:18:57Je veux donc créer une fonctionnalité supplémentaire.
00:19:01On va donner à mon hérisson la capacité de tirer des lasers par les yeux.
00:19:16Mais je veux tester cela par rapport à une autre fonctionnalité.
00:19:22Je réfléchis... lasers.
00:19:24On pourrait faire le classique à la Mario.
00:19:27Commençons par créer un feature flag multivarié avec les lasers comme variante
00:19:43et la capacité de sauter sur les insectes pour les tuer comme autre variante.
00:19:52Et donc... ce que je veux montrer ici, ce sont deux choses.
00:19:59L'MCP est très puissant.
00:20:02Vous pouvez l'utiliser pour presque tout ce que vous feriez dans le tableau de bord.
00:20:07Vous pouvez le faire via le tableau de bord.
00:20:10Je vous montre si on va dans les applications.
00:20:17Puis feature flags.
00:20:21Presque tout ce qui est faisable dans l'MCP peut aussi se faire via le chat ici.
00:20:25Si vous utilisez... je vais ouvrir un nouvel onglet.
00:20:29Oh, on ne peut pas chatter dans cet onglet.
00:20:33Oups.
00:20:34Je l'ai perdu.
00:20:37Ouvrons un nouveau chat, voilà.
00:20:39Je pourrais donner un prompt similaire.
00:20:43La seule différence, c'est que ce chat ne pourra pas mettre à jour mon code v0.
00:20:48Je dois accepter.
00:20:52Mais je pourrais quand même l'utiliser pour gérer les feature flags.
00:20:55Ou ici, je peux créer un feature flag en utilisant... et il devrait être en train de le créer.
00:21:01On y est.
00:21:02Ici.
00:21:03Expérience, créer.
00:21:04Je pourrais le créer via l'interface utilisateur.
00:21:07Mais je montre comment le faire via l'agent v0 avec l'MCP car je trouve que
00:21:16plus je peux faire de choses directement dans mon agent comme v0, mieux c'est.
00:21:20Je ne veux pas perdre de temps à cliquer partout ou à apprendre une nouvelle interface.
00:21:24Même si le tableau de bord est super cool et que j'adore l'interface,
00:21:31je préfère passer mon temps à construire directement dans v0.
00:21:35Cool.
00:21:36L'expérience est donc en place.
00:21:39Et nous avons défini des métriques.
00:21:40C'est l'un des points clés : quelle est l'hypothèse que vous testez ?
00:21:47v0 a carrément formulé une hypothèse pour nous.
00:21:49C'est plutôt sympa.
00:21:53Je pourrais la lire et éventuellement la mettre à jour.
00:21:55Ici, on teste laquelle des options donne le meilleur taux de complétion du jeu.
00:21:58C'est bien.
00:22:02Peut-être que mon objectif est le taux de complétion.
00:22:03Ou alors simplement le temps passé à jouer.
00:22:05Je pense que le taux de complétion est assez logique.
00:22:09Il l'a donc défini comme métrique principale.
00:22:13D'abord, vous posez une hypothèse.
00:22:16Qu'est-ce que je teste ?
00:22:18Ici, je teste si le "stomp" ou le "laser" est le plus engageant.
00:22:19Ensuite, on configure les métriques principales.
00:22:26Puis il y a ce concept de métriques secondaires, que je trouve très important.
00:22:29Les métriques principales sont les objectifs majeurs que vous voulez atteindre.
00:22:33Mais chaque fonctionnalité ajoutée peut avoir des effets secondaires.
00:22:38Ici, peut-être qu'ils tuent plus ou moins d'insectes par session.
00:22:43Peut-être qu'ils finissent plus le jeu mais tuent moins d'insectes.
00:22:44C'est peu probable, mais possible.
00:22:49Ou encore le nombre de morts par session.
00:22:52Quand on lance une expérience, il faut se demander : "Quel est mon but ?"
00:22:53Et : "Quels sont les éléments que cela pourrait impacter,"
00:22:57même si ce n'est pas le but premier, pour en être conscient lors de la décision.
00:23:02Petite question ici, Brooker.
00:23:03Si quelqu'un se trompe de métrique au début, est-ce facile dans PostHog
00:23:09d'ajuster l'expérience sans tout perdre sur v0 ?
00:23:14Oui, tu peux le faire via l'MCP, le chat ou directement dans l'interface.
00:23:17Il y a une petite icône de crayon à côté de la métrique.
00:23:23Tu cliques dessus.
00:23:30Et si tu veux passer de "jeu terminé" à "temps passé dans l'appli",
00:23:36tu cliques et tu cherches un événement. On peut aussi décider
00:23:39de vérifier si le taux d'abandon augmente.
00:23:41Je pourrais changer pour "page quittée".
00:23:46Dans ce cas, mon but serait de diminuer cette valeur.
00:23:47Je veux que les gens quittent la page moins souvent.
00:23:53C'est aussi simple que ça.
00:23:58On peut aussi utiliser l'MCP, ce que je trouve personnellement bien plus simple.
00:24:00Mais c'est bien de voir les deux méthodes.
00:24:03Oui.
00:24:08Super.
00:24:10D'accord.
00:24:16Et il va recalculer tout ça.
00:24:19Parfois, en voyant les résultats d'une expérience, cela m'aide à réaliser
00:24:20que j'ai une autre question à poser.
00:24:21Comme tu disais, je veux mettre à jour les métriques suivies.
00:24:22Il arrive que je n'aie pas encore d'événement ou de moyen de suivi en place.
00:24:23C'est là que l'MCP est vraiment utile.
00:24:27Tu peux dire quelque chose comme "ajoute un événement".
00:24:32Par exemple... je ne sais pas, les sauts.
00:24:33Je pourrais dire : "ajoute un événement chaque fois que le hérisson saute".
00:24:36Dans ce cas, ces événements ne seront probablement suivis
00:24:43qu'à partir du moment où tu les ajoutes à l'application.
00:24:46Et là, tu peux modifier la durée de ton expérience pour qu'elle commence
00:24:48à un moment précis.
00:24:53Tu pourrais aussi cibler... oh, pardon.
00:25:02Je m'excuse.
00:25:08Et si on change cela en pleine expérience, y a-t-il une bonne pratique ?
00:25:10Faut-il redémarrer le test ou peut-on continuer à collecter les données
00:25:15dans la même expérience ?
00:25:21C'est une bonne question.
00:25:22Tant que tu es conscient des changements qui peuvent impacter ce que tu fais,
00:25:24je ne vois pas de problème à continuer la même expérience.
00:25:25Il peut y avoir des scénarios où d'autres changements simultanés
00:25:31pourraient influencer tes résultats.
00:25:38Il faut donc bien surveiller tous les tests en cours
00:25:40et comprendre comment ils pourraient interférer les uns avec les autres.
00:25:42C'est pour ça que généralement, ici, on a fait un test multivarié
00:25:48avec le "stomp" et le "laser". Je crois que le laser est le groupe de contrôle.
00:25:49Mais je pourrais vouloir un contrôle type "aucune arme".
00:25:55Il est utile de tout grouper dans une seule expérience pour éviter
00:25:59que différents tests n'entrent en compétition. Tu vois ?
00:26:02Oui, ça se tient.
00:26:06Tout à fait.
00:26:09Voyons où on en est... ah, je ne l'ai pas ajouté à la file d'attente.
00:26:15Ok, c'est fait.
00:26:20On a les yeux laser.
00:26:30Voyons ce qui se passe quand on utilise l'appli maintenant.
00:26:35Ok, cool.
00:26:38J'ai un laser, mais ça ne tue pas les ennemis.
00:26:39C'est naze.
00:26:41Bref, ça peut arriver.
00:26:42Je n'ai pas donné un prompt efficace à v0, on ne va pas le blâmer.
00:26:45C'est bon, c'est fait.
00:26:47On a donc les yeux laser.
00:26:48Voyons ce qui se passe si on utilise l'application maintenant.
00:26:51D'accord, super.
00:26:52J'ai un laser, mais il ne tue pas les ennemis.
00:26:57C'est nul.
00:26:58Bref, vous pourriez aussi rencontrer ce genre de problème.
00:27:02C'est parce que je n'ai pas bien formulé mon prompt pour v0.
00:27:05On ne va pas blâmer v0 pour ça.
00:27:07J'ai juste dit : “tire des lasers par les yeux”.
00:27:10Mais je n'ai pas précisé de tuer les insectes avec le laser.
00:27:12On peut aussi cibler différents utilisateurs.
00:27:16Je pourrais dire : “cible mon utilisateur pour la fonction d'écrasement”, par exemple.
00:27:23On verra s'il arrive à identifier qui est mon utilisateur.
00:27:26On pousse un peu l'agent et l'MCP dans leurs retranchements, mais l'MCP
00:27:31a tout à fait la capacité de trouver un utilisateur.
00:27:35Et ensuite de définir la variante de l'expérience pour cet utilisateur.
00:27:41On peut cibler différentes cohortes pour différentes variantes.
00:27:46Si vous voulez que tous les Australiens aient des yeux laser, c'est possible.
00:27:51Et voilà.
00:27:53Je pense qu'on arrive bientôt à la fin du temps imparti, non ?
00:27:56J'ai oublié combien de temps...
00:27:57Oui, effectivement.
00:27:58Je viens juste de vérifier.
00:27:59Mais bon.
00:28:00D'accord, très bien.
00:28:02Je peux continuer encore un peu.
00:28:03Mais si vous avez d'autres questions ou des points que je n'ai pas abordés,
00:28:08ce serait intéressant.
00:28:09Oui, une autre question nous est parvenue : pour les utilisateurs de v0
00:28:15qui débutent en expérimentation, existe-t-il une liste de contrôle
00:28:21pour éviter de mettre en place une expérience “faussée” ou trompeuse ?
00:28:27Oui, c'est... Je ne suis pas sûr à 100 %.
00:28:31Je sais que nous avons des guides.
00:28:32Je ne veux pas essayer de les chercher ici en direct.
00:28:34Mais je pourrais certainement vous en transmettre un.
00:28:38On pourrait.
00:28:39Oui, on pourra l'ajouter à notre section ressources dans ce chat.
00:28:43Tout à fait, sans problème.
00:28:44Ouais.
00:28:45Et puis, on peut passer par l'IA. J'encourage les gens à
00:28:50poser des questions au chat, à explorer l'interface. Il y a beaucoup d'aide,
00:28:55comme pour l'hypothèse dont j'ai parlé et qu'on ne voyait pas dans v0.
00:28:58Ça peut aider d'ouvrir l'interface pour voir ce qu'il est possible de faire.
00:29:02Ou même de jouer avec.
00:29:05Ou simplement demander à v0 : “Qu'est-ce que je risque
00:29:10de rater ici ?”
00:29:11“Qu'est-ce qu'on peut faire d'autre avec ça ?”
00:29:13Je vous encourage à exploiter v0 au maximum pour ce genre de choses,
00:29:18ou l'IA de PostHog qui est aussi une option pour discuter directement.
00:29:23Waouh, je ne savais même pas que vous aviez ça.
00:29:26C'est vraiment génial.
00:29:27Je pose la question à chaque session d'intégration, mais à plus long terme,
00:29:35qu'est-ce que vous nous préparez ?
00:29:36Y a-t-il des choses que tu peux partager ?
00:29:38Oui, nous voyons l'avenir du développement logiciel et produit comme étant plus autonome.
00:29:45Et je pense que c'est déjà en train d'arriver.
00:29:47Mais je crois qu'il y a encore du chemin à parcourir.
00:29:53Des choses comme la résolution d'erreurs que j'ai montrée...
00:29:59Je pense que d'ici peu, ce sera la norme dans les applications.
00:30:04Avoir une application qui tourne avec un processus en arrière-plan
00:30:09qui corrige les erreurs sans que je doive lui dire, avec peut-être un rapport à la clé.
00:30:15Mais au final, je ne veux pas avoir à demander à une IA de vérifier les erreurs,
00:30:20je ne veux pas recevoir d'alerte en plein milieu de la nuit
00:30:24et me faire réveiller par un bug.
00:30:26Je pense qu'à l'avenir, un système — que ce soit PostHog,
00:30:35Vercel, ou les deux travaillant ensemble...
00:30:38Ils vont collecter des informations. Les erreurs ne sont qu'une partie.
00:30:43Il y a les replays de sessions, l'analyse produit, les expériences...
00:30:49Ai-je vraiment besoin de créer manuellement différents indicateurs ?
00:30:53D'ailleurs, c'était intéressant de voir ici que v0 avait déjà choisi
00:30:57des indicateurs pertinents pour nous.
00:31:00Mais j'aurai probablement un agent pour surveiller tout ça à l'avenir
00:31:05et mettre à jour le code sans que j'aie besoin de le guider avec autant de précision.
00:31:14Je garderai bien sûr le côté stratégique, comme le type d'expérience
00:31:19que je souhaite pour mon jeu,
00:31:20ou les objectifs que je cible.
00:31:22Mais pour tout ce qui est bas niveau, je pense que beaucoup de choses
00:31:26seront gérées de manière autonome.
00:31:28Oui, par le développement autonome.
00:31:30Tout à fait.
00:31:31J'adore cette vision parce qu'elle s'aligne exactement avec ce dont
00:31:37nous parlons chez Vercel et avec v0 également.
00:31:40L'idée est de boucler la boucle : du déploiement
00:31:43à l'observation dans PostHog, puis à la correction et l'itération automatique.
00:31:49C'est génial.
00:31:50Une dernière question avant de conclure, car je sais qu'on a atteint la limite.
00:31:56Comment peut-on s'impliquer dans la communauté PostHog ?
00:32:00J'ai dit au début que PostHog était open source.
00:32:03Est-ce que vous acceptez les contributions ?
00:32:05Je ne sais pas si je ne me suis pas trompé.
00:32:06C'est ce que j'ai lu.
00:32:07Oui.
00:32:08À 100 %.
00:32:09Nous recevons des Pull Requests d'un peu partout que nous examinons.
00:32:10Il y a aussi un forum PostHog où vous pouvez poser vos questions.
00:32:16Nous organisons des événements en direct.
00:32:21Encore une fois, j'aimerais avoir l'URL sous la main, mais je te la donnerai après.
00:32:22Oui, absolument.
00:32:26Oui, il y a des événements en direct.
00:32:27Et inscrivez-vous simplement.
00:32:29Utilisez l'application.
00:32:30Dites-nous ce que vous en pensez.
00:32:31Contactez-nous sur X, LinkedIn ou autre.
00:32:32Faites-nous part de vos retours, nous sommes très actifs sur ces plateformes.
00:32:37Parfait.
00:32:40Merci beaucoup, Brooker.
00:32:41C'était incroyable.
00:32:43Et pour tous ceux qui nous regardent, si vous avez d'autres questions,
00:32:44posez-les dans le chat et nous ferons en sorte que l'équipe PostHog y réponde.
00:32:49Mais oui, merci encore, Brooker.
00:32:54J'ai beaucoup apprécié ce moment.
00:32:56Merci.
00:32:58De rien.
00:32:59Merci de m'avoir invité.
00:33:00Formidable.
00:33:02Merci beaucoup à tous d'avoir suivi cet échange et notre session d'aujourd'hui.
00:33:03Si vous ne le savez pas, nous organisons une session communautaire
00:33:08quasiment toutes les semaines.
00:33:14Si vous allez sur [community.vercel.com/events](https://www.google.com/search?q=https://community.vercel.com/events), vous verrez un calendrier
00:33:21avec tous nos événements en présentiel et en ligne.
00:33:24Dites-nous quelle sera la prochaine intégration que vous aimeriez voir.
00:33:31Et nous ferons le nécessaire pour l'organiser.
00:33:33Incroyable.
00:33:34Eh bien, merci à tous de nous avoir rejoints aujourd'hui.
00:33:39Et j'espère vous revoir lors de notre prochaine session en direct.

Key Takeaway

L'alliance de PostHog et v0 révolutionne le cycle de développement en permettant une itération ultra-rapide basée sur l'analyse de données, le débogage assisté par IA et l'expérimentation directe en production.

Highlights

L'intégration directe entre PostHog et v0 permet de passer de l'idée à une expérience en direct sans quitter l'outil de création.

L'utilisation du Model Context Protocol (MCP) donne à l'agent v0 la capacité d'analyser les erreurs de production et de proposer des corrections automatiques.

PostHog simplifie la gestion des variables d'environnement et de la facturation via la Marketplace Vercel.

Les tests A/B et les feature flags multivariés permettent de trancher des décisions de design basées sur des données réelles plutôt que des opinions.

Le replay de session offre une visibilité précieuse sur le comportement des utilisateurs pour identifier les obstacles contextuels.

La vision future du développement logiciel tend vers des systèmes autonomes capables de s'auto-corriger grâce à l'analyse de données en continu.

Timeline

Introduction et présentation de l'intégration PostHog

Pauline Navas de l'équipe communautaire de Vercel ouvre la session en accueillant les participants sur diverses plateformes comme YouTube et LinkedIn. Elle présente PostHog comme une plateforme d'analyse de produits open source combinant des outils tels que les feature flags et les tests A/B. L'accent est mis sur la nouvelle intégration avec v0, qui permet d'intégrer l'analytique dès la phase de conception initiale. Cette synergie vise à éliminer l'époque où l'on déployait d'abord pour ne s'occuper de l'analytique que bien plus tard. La session promet de montrer comment configurer ces outils directement dans l'environnement de développement.

Installation et configuration dans la Marketplace Vercel

Brooker, ingénieur produit chez PostHog, rejoint la session pour détailler les avantages techniques de l'intégration pour les utilisateurs de Vercel. Il effectue une démonstration en direct de l'installation de PostHog via la Marketplace, soulignant la synchronisation automatique des variables d'environnement. Cette automatisation évite aux développeurs la gestion fastidieuse des clés API et de l'hôte, garantissant une connexion fluide entre le produit et le projet PostHog. Brooker mentionne également une offre gratuite généreuse pour permettre aux projets de décoller sans contrainte financière immédiate. Le processus est conçu pour être transparent, permettant de lier un compte existant ou d'en créer un nouveau en quelques clics.

Gestion des erreurs et utilisation du protocole MCP avec v0

Cette section présente une démo concrète utilisant un jeu appelé "Hog Hop" pour illustrer le débogage assisté par IA. Brooker explique le concept de Model Context Protocol (MCP), qui permet à l'agent v0 de lire les données de PostHog pour comprendre les bugs de production. En décrivant simplement un problème de gel de l'écran à l'agent, ce dernier parvient à identifier l'erreur via la stack trace et à proposer une correction immédiate. L'importance de la visibilité sur les erreurs vécues par les utilisateurs finaux est soulignée, car ces derniers ne font pas toujours de rapports de bugs. Le replay de session est également mentionné comme un outil puissant pour visualiser les interactions réelles des utilisateurs.

Expérimentation : Feature Flags et Tests A/B

L'intervenant explore les fonctionnalités à haute valeur ajoutée comme les tests A/B et les feature flags multivariés pour optimiser le produit. Il simule l'ajout de nouvelles capacités au personnage du jeu, telles que des lasers ou un saut d'écrasement, pour tester laquelle est la plus engageante. v0 aide à formuler des hypothèses et à définir des métriques de succès, comme le taux de complétion du jeu ou le temps passé dans l'application. Brooker insiste sur la distinction entre les métriques principales et secondaires pour surveiller les éventuels effets de bord indésirables. Cette approche permet de prendre des décisions basées sur des preuves tangibles plutôt que sur des débats internes au sein des équipes de développement.

Ciblage utilisateur et vision du développement autonome

Brooker démontre comment cibler des variantes spécifiques pour certains utilisateurs ou cohortes géographiques directement via l'interface v0. Il partage ensuite sa vision du futur du génie logiciel, où les applications pourraient s'auto-corriger de manière autonome grâce à des processus d'arrière-plan surveillant les données de PostHog. Selon lui, le développeur conservera un rôle stratégique tandis que les tâches de bas niveau, comme la résolution de bugs mineurs, seront gérées par des agents IA. Cette boucle de rétroaction entre déploiement, observation et itération automatique est au cœur de l'évolution des outils Vercel et PostHog. L'IA de PostHog est également citée comme un compagnon utile pour explorer l'interface et maximiser l'usage des données.

Clôture et engagement communautaire

La session se termine par un appel à l'engagement envers la communauté open source de PostHog, qui accepte activement les contributions via Pull Requests. Brooker invite les utilisateurs à rejoindre leur forum, à participer aux événements en direct et à donner leur avis sur les réseaux sociaux comme X ou LinkedIn. Pauline rappelle que Vercel organise des sessions communautaires hebdomadaires et encourage le public à consulter leur calendrier d'événements en ligne. Elle invite également les participants à suggérer les prochaines intégrations qu'ils aimeraient voir présentées dans ce format. Les intervenants se remercient mutuellement pour cet échange riche en démonstrations techniques et en perspectives d'avenir.

Community Posts

View all posts