Déployez votre propre plateforme d'IA de Vibe Coding en un seul clic : Cloudflare met en open source sa plateforme de codage IA complète de bout en bout "VibeSDK"

C'est une période passionnante pour créer des applications. Avec l'essor récent du « codage Vibe » alimenté par l'IA, n'importe qui peut créer un site web ou une application en décrivant simplement ce qu'il souhaite en quelques phrases. Nous voyons déjà des organisations mettre cette fonctionnalité à la disposition de leurs utilisateurs et de leurs employés internes, permettant ainsi à chacun de créer ce dont il a besoin.

Nom : 1.jpg Affichages : 41189 Taille : 16,6 Ko

Aujourd'hui, nous sommes ravis de mettre en open source une plateforme d'IA de Vibe Coding, VibeSDK, qui permet à tout un chacun d'exécuter lui-même une plateforme de codage complète, de bout en bout, en un seul clic.

Vous voulez vous en rendre compte par vous-même ? Découvrez notre plateforme de démonstration que vous pouvez utiliser pour créer et déployer des applications. Mieux encore, cliquez sur le bouton ci-dessous pour déployer votre propre plateforme alimentée par l'IA et plongez-vous dans le référentiel pour découvrir comment elle est construite.

Déployer sur Cloudflare

Le déploiement de VibeSDK configure tout ce dont vous avez besoin pour exécuter votre propre plateforme de développement alimentée par l'IA :

  • Intégration avec les modèles LLM pour générer du code, créer des applications, déboguer les erreurs et itérer en temps réel, grâce à Agents SDK.

  • Environnements de développement isolés qui permettent aux utilisateurs de créer et de prévisualiser leurs applications en toute sécurité dans des sandbox sécurisées.

  • Une évolutivité infinie qui vous permet de déployer des milliers, voire des millions d'applications que les utilisateurs finaux déploient, toutes servies sur le réseau mondial de Cloudflare.

  • Observabilité et mise en cache sur plusieurs fournisseurs d'IA, vous donnant un aperçu des coûts et des performances avec une mise en cache intégrée pour les réponses courantes.

  • Modèles de projet que le LLM peut utiliser comme point de départ pour créer des applications courantes et accélérer le développement.

  • Exportation de projet en un clic vers le compte Cloudflare ou le dépôt GitHub de l'utilisateur, afin que les utilisateurs puissent récupérer leur code et poursuivre le développement par eux-mêmes.


Nom : 2.jpg Affichages : 1950 Taille : 47,6 Ko

Création d'une plateforme d'IA de Vibe coding de A à Z

  • Étape 0 : Commencez immédiatement avec VibeSDK

Nous voyons des entreprises créer leurs propres plateformes de codage IA vibe pour permettre aux utilisateurs internes et externes de les utiliser. Grâce à une plateforme de codage vibe, les équipes internes telles que le marketing, les produits et le support peuvent créer leurs propres pages d'accueil, prototypes ou outils internes sans avoir à dépendre de l'équipe d'ingénieurs. De même, les entreprises SaaS peuvent intégrer cette fonctionnalité à leur produit pour permettre aux utilisateurs de créer leurs propres personnalisations.

Chaque plateforme a des exigences et des spécialisations uniques. En créant la vôtre, vous pouvez écrire une logique personnalisée pour demander aux LLM de répondre à vos besoins spécifiques, offrant ainsi à vos utilisateurs des résultats plus pertinents. Cela vous permet également de contrôler entièrement l'environnement de développement et l'hébergement des applications, vous offrant ainsi une plateforme sécurisée qui préserve la confidentialité de vos données et vous permet de les contrôler.

Nous voulions permettre à tout le monde de créer facilement sa propre plateforme. C'est pourquoi nous avons développé une plateforme complète qui comprend des modèles de projet, des aperçus et le déploiement de projets. Les développeurs peuvent réutiliser l'ensemble de la plateforme ou simplement prendre les composants dont ils ont besoin et les personnaliser en fonction de leurs besoins.

  • Étape 1 : trouver un environnement sûr et isolé pour exécuter du code non fiable généré par l'IA

L'IA peut désormais créer des applications entières, mais il y a un hic : vous avez besoin d'un endroit sûr pour exécuter ce code non fiable généré par l'IA. Imaginez qu'un LLM écrive une application qui nécessite d'installer des paquets, d'exécuter des commandes de compilation et de démarrer un serveur de développement. Vous ne pouvez pas simplement l'exécuter directement sur votre infrastructure, où elle pourrait affecter d'autres utilisateurs ou systèmes.

Avec Cloudflare Sandboxes, vous n'avez pas à vous en soucier. Chaque utilisateur dispose de son propre environnement isolé où le code généré par l'IA peut faire tout ce qu'un environnement de développement normal peut faire : installer des paquets npm, exécuter des builds, démarrer des serveurs, mais il est entièrement contenu dans un environnement sécurisé, basé sur des conteneurs, qui ne peut affecter quoi que ce soit en dehors de son bac à sable.

Nom : 3.jpg Affichages : 1937 Taille : 102,9 Ko

La plateforme attribue à chaque utilisateur son propre bac à sable en fonction de sa session, de sorte que si un utilisateur revient, il peut continuer à accéder au même conteneur avec ses fichiers intacts :

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
// Creating a sandbox client for a user session
const sandbox = getSandbox(env.Sandbox, sandboxId);
 
// Now AI can safely write and execute code in this isolated environment
await sandbox.writeFile('app.js', aiGeneratedCode);
await sandbox.exec('npm install express');
await sandbox.exec('node app.js');


  • Étape 2 : Génération du code

Une fois le bac à sable créé, vous disposez d'un environnement de développement qui peut donner vie au code. VibeSDK orchestre l'ensemble du workflow, de l'écriture du code à l'installation des paquets nécessaires, en passant par le démarrage du serveur de développement. Si vous lui demandez de créer une application de tâches à faire, il générera l'application React, écrira les fichiers de composants, exécutera bun install pour obtenir les dépendances et démarrera le serveur, afin que vous puissiez voir le résultat final.

Une fois que l'utilisateur a soumis sa demande, l'IA génère tous les fichiers nécessaires, qu'il s'agisse d'une application React, d'une API Node.js ou d'une application full-stack, et les écrit directement dans le bac à sable :

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
async function generateAndWriteCode(instanceId: string) {
    // AI generates the application structure
    const aiGeneratedFiles = await callAIModel("Create a React todo app");
 
    // Write all generated files to the sandbox
    for (const file of aiGeneratedFiles) {
        await sandbox.writeFile(
            `${instanceId}/${file.path}`,
            file.content
        );
        // User sees: "✓ Created src/App.tsx"
        notifyUser(`✓ Created ${file.path}`);
    }
}


Pour accélérer encore davantage le processus, nous avons fourni un ensemble de modèles, stockés dans un compartiment R2, que la plateforme peut utiliser et personnaliser rapidement, au lieu de générer chaque fichier à partir de zéro. Il ne s'agit que d'un ensemble initial, mais vous pouvez l'étendre et ajouter d'autres exemples.

  • Étape 3 : obtenir un aperçu de votre déploiement

Une fois que tout est prêt, la plateforme démarre le serveur de développement et utilise le SDK Sandbox pour l'exposer sur Internet avec une URL d'aperçu public qui permet aux utilisateurs de voir instantanément leur application générée par l'IA fonctionner en direct :

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
// Start the development server in the sandbox
const processId = await sandbox.startProcess(
    `bun run dev`, 
    { cwd: instanceId }
);
 
// Create a public preview URL 
const preview = await sandbox.exposePort(3000, { 
    hostname: 'preview.example.com' 
});
 
// User instantly gets: "https://my-app-xyz.preview.example.com"
notifyUser(`✓ Preview ready at: ${preview.url}`);


  • Étape 4 : Tester, consigner, corriger, répéter

Mais ce n'est pas tout ! Tout au long de ce processus, la plateforme capture les sorties de la console, les journaux de compilation et les messages d'erreur, puis les renvoie au LLM pour qu'il effectue des corrections automatiques. À mesure que la plateforme effectue des mises à jour ou des corrections, l'utilisateur peut voir tout ce qui se passe en direct : l'édition des fichiers, la progression de l'installation et la résolution des erreurs.

Déploiement d'applications : du bac à sable à la région Terre

Une fois l'application développée, elle doit être déployée. La plateforme regroupe tout dans le bac à sable, puis utilise un « bac à sable de déploiement » spécialisé distinct pour déployer l'application sur Cloudflare Workers. Ce bac à sable de déploiement exécute wrangler deploy dans un environnement sécurisé afin de publier l'application sur le réseau mondial de Cloudflare.

Étant donné que la plateforme peut déployer jusqu'à des milliers, voire des millions d'applications, Workers for Platforms est utilisé pour déployer les Workers à grande échelle. Bien que tous les Workers soient déployés dans le même espace de noms, ils sont tous isolés les uns des autres par défaut, ce qui garantit qu'il n'y a pas d'accès inter-locataires. Une fois déployée, chaque application reçoit sa propre instance Worker isolée avec une URL publique unique telle que my-app.vibe-build.example.com.

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
async function deployToWorkersForPlatforms(instanceId: string) {
    // 1. Package the app from development sandbox
    const devSandbox = getSandbox(env.Sandbox, instanceId);
    const packagedApp = await devSandbox.exec('zip -r app.zip .');
 
    // 2. Transfer to specialized deployment sandbox
    const deploymentSandbox = getSandbox(env.DeployerServiceObject, 'deployer');
    await deploymentSandbox.writeFile('app.zip', packagedApp);
    await deploymentSandbox.exec('unzip app.zip');
 
    // 3. Deploy using Workers for Platforms dispatch namespace
    const deployResult = await deploymentSandbox.exec(`
        bunx wrangler deploy \\\\
        --dispatch-namespace vibe-sdk-build-default-namespace
    `);
 
    // Each app gets its own isolated Worker and unique URL
    // e.g., https://my-app.example.com
    return `https://${instanceId}.example.com`;
}



Applications exportables

La plateforme permet également aux utilisateurs d'exporter leur application vers leur propre compte Cloudflare et leur dépôt GitHub, afin qu'ils puissent poursuivre le développement par eux-mêmes.

Nom : 4.jpg Affichages : 1348 Taille : 85,5 Ko

Observabilité, mise en cache et prise en charge multi-modèles intégrées !

Ce n'est un secret pour personne que les modèles LLM ont leurs spécificités, ce qui signifie que lorsque vous créez une plateforme alimentée par l'IA, vous pouvez finir par utiliser plusieurs modèles différents pour différentes opérations. Par défaut, VibeSDK exploite les modèles Gemini de Google (gemini-2.5-pro, gemini-2.5-flash-lite, gemini-2.5-flash) pour la planification de projets, la génération de code et le débogage.

VibeSDK est automatiquement configuré avec AI Gateway, de sorte que, par défaut, la plateforme est capable de :

  • Utiliser un point d'accès unifié pour acheminer les requêtes entre les fournisseurs LLM, ce qui vous permet d'utiliser des modèles provenant de différents fournisseurs (OpenAI, Anthropic, Google, etc.)

  • Mettre en cache les réponses courantes, de sorte que lorsqu'une personne demande de « créer une application de liste de tâches », la passerelle peut fournir une réponse mise en cache au lieu de s'adresser au fournisseur (ce qui permet d'économiser des coûts d'inférence)

  • Obtenir une visibilité sur les requêtes, les jetons utilisés et les temps de réponse de tous les fournisseurs en un seul endroit

  • Suivre les coûts pour tous les modèles et toutes les intégrations

Open source, pour que vous puissiez créer votre propre plateforme !

Nous mettons VibeSDK en open source pour la même raison que Cloudflare a mis en open source le runtime Workers : nous pensons que le meilleur développement se fait en open source. C'est pourquoi nous voulions faciliter au maximum la création de sa propre plateforme de codage IA, que ce soit pour un usage interne à l'entreprise, pour votre créateur de site web ou pour la prochaine grande plateforme de codage vibe. Nous avons rassemblé tous les éléments pour vous, afin que vous puissiez vous lancer en un clic au lieu de passer des mois à essayer de comprendre comment tout connecter vous-même. Pour en savoir plus, consultez notre architecture de référence pour les plateformes de codage vibe.

Déployer sur Cloudflare

Auteurs : Ashish Kumar Singh, Abhishek Kankani, Dina Kozlov

Source : Cloudflare

Et vous ?

Quel est votre avis sur le sujet ?

Voir aussi :

Cloudflare annonce des améliorations à sa plateforme de développement permettant aux développeurs de gagner en rapidité et en puissance

Tout le monde parle de vibe coding : guide pour générer rapidement une application avec les modèles d'instructions génératives exacts, par Jay Gordon

L'IA aurait radicalement transformé le codage au point de remplacer bientôt tous les développeurs ? Il n'y a pas de "Vibe Engineering", par Sergey Tselovalnikov