Déployer une app Google AI Studio gratuitement (sans Cloud Run)

En bref

Vous avez créé une app dans Google AI Studio, elle tourne bien dans l'aperçu, et vous voulez maintenant une vraie URL à partager. Le bouton Deploy vous pousse vers Google Cloud Run — un serveur que vous devez configurer et payer dès que vous dépassez le palier gratuit. Pour la plupart des apps AI Studio, c'est disproportionné.

Voici l'essentiel : une app AI Studio est un projet React + Vite, et les projets Vite se compilent en simples fichiers statiques (HTML, CSS, JavaScript). Ces fichiers peuvent être hébergés gratuitement sur Netlify, Cloudflare Pages ou GitHub Pages — sans serveur, sans démarrage à froid, sans rien à maintenir. Ce guide vous accompagne depuis le code exporté depuis AI Studio jusqu'à la mise en ligne du site, sans rien installer. Le build tourne dans votre navigateur avec React2Static, donc votre code n'est jamais envoyé sur un serveur.

Ce que Google AI Studio vous donne réellement

Quand vous récupérez le code depuis AI Studio, vous obtenez un dossier de projet : un package.json, un vite.config.ts, un index.html et un dossier src/. C'est du code source, pas un site web. Si vous le décompressez et double-cliquez sur index.html, vous obtenez une page blanche — le navigateur ne sait pas exécuter directement du TypeScript et du JSX. Vite doit d'abord tout compiler en fichiers prêts pour le navigateur. Cette étape de compilation, c'est le build, et c'est la seule pièce qui manque entre « ça marche dans AI Studio » et « ça marche sur internet ».

Tout le travail tient donc en trois étapes : exporter le projet, le compiler en fichiers statiques, poser ces fichiers sur un hébergeur.

Comment exporter mon app depuis Google AI Studio ?

AI Studio propose deux façons de récupérer le code : connecter votre projet à un dépôt GitHub, ou télécharger le projet. Dans les deux cas, ce que vous voulez, c'est le dossier de projet complet, avec le package.json — pas seulement le contenu copié d'un seul fichier. Si vous avez exporté un ZIP, laissez-le compressé ; c'est exactement ce que l'étape suivante attend.

Comment le compiler en fichiers statiques ?

React2Static lance un vrai build Vite dans votre navigateur grâce à WebContainers. Rien n'est envoyé : l'environnement Node.js, l'installation des dépendances et le build restent entièrement en local, sur votre propre machine.

Le dossier téléchargé est votre site web. Chaque fichier qu'il contient est du HTML, du CSS ou du JavaScript pur.

Comment lancer mon app Google AI Studio en local ?

Vous ne pouvez pas juste ouvrir index.html — le projet doit d'abord être compilé ou servi. La méthode sans installation, c'est de le compiler et de le prévisualiser dans le navigateur avec React2Static. Si Node.js est installé chez vous, décompressez le projet et lancez npm install puis npm run dev, ce qui démarre un serveur local et affiche une URL localhost.

Où l'héberger gratuitement ?

N'importe quel hébergeur statique fait l'affaire. Tous les services ci-dessous sont gratuits et acceptent un simple glisser-déposer de votre dossier compilé :

Cloudflare Pages - hébergement gratuit avec CDN mondial, HTTPS automatique et un domaine .pages.dev gratuit.

Netlify - déploiement par glisser-déposer, très accessible aux débutants.

Vercel - créez un projet, envoyez les fichiers, c'est fait.

GitHub Pages - gratuit, mais il ne peut pas envoyer d'en-têtes de réponse personnalisés, donc quelques projets se comportent mal. Suffisant pour la plupart des apps simples.

Déployer sur Cloudflare Pages, étape par étape

Vous obtenez le HTTPS et un CDN mondial gratuitement. Ajoutez un domaine personnalisé plus tard dans les paramètres du projet si vous le souhaitez.

Pourquoi ne pas simplement utiliser Google Cloud Run ?

Cloud Run fait tourner un conteneur — vous louez un serveur qui reste prêt à répondre aux requêtes. Vous choisissez une région, et au-delà du palier gratuit vous payez à l'usage. C'est le bon outil quand votre app a un back-end : une base de données, des pages rendues côté serveur, ou une clé d'API secrète que vous ne pouvez pas exposer dans le navigateur.

Un front-end AI Studio qui ne fait qu'appeler l'API Gemini depuis le navigateur n'a rien de tout ça. Ce sont des fichiers statiques. L'hébergement statique est gratuit, n'a pas de démarrage à froid, encaisse n'importe quel trafic, et il n'y a aucun serveur à maintenir. N'utilisez Cloud Run (ou n'importe quel serveur) que lorsque vous ajoutez réellement du code côté serveur.

Une mise en garde : si votre app appelle Gemini avec une clé secrète, cette clé se retrouvera dans votre JavaScript statique, lisible par n'importe qui. C'est le seul cas où il vaut mieux intercaler une petite fonction serverless devant l'API plutôt que de l'appeler directement depuis le navigateur.

Est-ce que ça marche aussi avec Claude Code, Cursor et Codex ?

Oui. Claude Code, Cursor, GitHub Copilot / Codex, Bolt et Lovable génèrent tous le même type de projet Vite + React (ou Vue / Svelte). Les trois étapes sont identiques : récupérer le dossier de projet, le compiler en fichiers statiques, les déposer sur un hébergeur. Rien dans ce guide n'est propre à AI Studio, sauf l'écran d'export.

Mon app est blanche ou cassée après le déploiement

Les quatre coupables habituels, de la plus rapide à vérifier à la plus longue :

FAQ

Comment exporter une app depuis Google AI Studio ?

Utilisez l'option d'AI Studio pour télécharger le projet ou le connecter à un dépôt GitHub, et gardez tout le dossier de projet, package.json compris. C'est ce dossier, et non le contenu d'un seul fichier, que vous compilez en site web.

Ai-je besoin de Google Cloud Run pour déployer une app AI Studio ?

Non. Cloud Run sert aux apps avec un back-end. Un front-end AI Studio se compile en fichiers statiques, qui peuvent être hébergés gratuitement sur Netlify, Cloudflare Pages ou GitHub Pages, sans serveur.

Puis-je déployer une app Google AI Studio gratuitement ?

Oui. La compilation en fichiers statiques puis l'hébergement de ces fichiers sont gratuits de bout en bout. React2Static la compile dans votre navigateur sans frais, et les hébergeurs statiques ont des paliers gratuits généreux.

Comment lancer une app Google AI Studio en local ?

Soit vous la compilez et la prévisualisez dans le navigateur avec React2Static, soit, si Node.js est installé, vous lancez npm install puis npm run dev dans le dossier du projet. Ouvrir index.html directement ne marchera pas — le projet doit d'abord être compilé.

Pourquoi mon app Google AI Studio est-elle blanche après le déploiement ?

C'est presque toujours parce que le code source a été envoyé au lieu du dossier dist/ compilé, ou parce que le chemin de base du build ne correspond pas à l'hébergeur. Les variables d'environnement manquantes et le routage d'application monopage sont les deux autres causes fréquentes.

Mon code est-il envoyé sur un serveur quand j'utilise React2Static ?

Non. React2Static lance le build Node.js dans votre navigateur avec WebContainers. Vos fichiers ne quittent jamais votre machine.

Guides associés