Comment publier un site web créé avec ChatGPT ou Claude

Pour publier un site web que ChatGPT ou Claude a écrit pour vous, enregistrez le code dans un fichier appelé index.html, envoyez ce fichier sur GitHub, puis sélectionnez le dépôt dans le panneau Coolify de votre serveur et déployez-le. Votre site se retrouve sur une adresse HTTPS publique, et vous pouvez raccorder votre propre domaine si vous en avez un. Ce guide part du principe que c'est votre première fois et détaille chaque étape depuis le début.

Commencez par vérifier ce que vous avez. Un site écrit dans un chat est généralement un seul fichier HTML sans rien à compiler, et c'est ce que couvre ce guide. Si la réponse mentionne npm install, package.json ou Next.js, vous avez plutôt une application, et notre guide de l'outil de code est le meilleur endroit où aller.

1. Demandez un seul fichier

Envoyez ceci dans le chat pour ne pas avoir à jongler avec plusieurs fichiers :

Give me this site as one index.html file. Keep the CSS and JavaScript inside that file. If you use images, tell me their file names.

2. Enregistrez le fichier sur votre ordinateur

• ChatGPT : le code arrive généralement dans un bloc de code du chat : copiez ce bloc. Si vous voyez un bouton de téléchargement, vous pouvez aussi l'utiliser.
• Claude : le site s'ouvre souvent comme un artefact à côté du chat. La documentation d'Anthropic décrit des commandes en haut de l'artefact pour afficher, copier ou télécharger le code. Les designs créés à partir d'un modèle ont Export, qui vous donne du HTML autonome ou un .zip.

Si vous avez copié le code, collez-le dans un éditeur de texte et enregistrez-le sous le nom index.html. Dans le Bloc-notes de Windows, réglez le type de fichier sur Tous les fichiers, sinon le nom se terminera par .txt. Dans TextEdit sur Mac, passez d'abord en texte brut. Double-cliquez sur le fichier et votre site devrait s'ouvrir dans le navigateur. Placez les images éventuelles dans le même dossier.

3. Envoyez les fichiers sur GitHub

Le serveur récupère votre site depuis un dépôt sur GitHub, qui fonctionne comme un dossier pour vos fichiers.

1. Créez un compte GitHub. En haut à droite, choisissez New repository.
2. Donnez-lui un nom court, réglez la visibilité sur Public, activez Add README et appuyez sur Create repository.
3. Au-dessus de la liste des fichiers, ouvrez le menu Add file, choisissez Upload files, glissez-y index.html et vos images, puis appuyez sur Commit changes.

Tout le monde peut voir un dépôt public, et une page HTML est de toute façon visible par chaque visiteur. N'y mettez donc jamais de mot de passe ni de clé d'API.

4. Commandez le serveur

Commandez depuis la page VPS Next.js ou la page VPS Coolify. Les deux sont livrées avec le panneau de déploiement Coolify. Un site HTML simple n'a pas d'étape de compilation : il n'a donc pas besoin de la mémoire que demande Next.js, et vous pouvez choisir une taille plus petite sur la page Coolify. Après le paiement, ouvrez votre serveur depuis Mes serveurs dans votre panneau Seturack et attendez que la ligne Application de l'onglet Vue d'ensemble indique qu'il est prêt.

5. Déployez depuis le panneau

1. Dans l'onglet Vue d'ensemble, ouvrez le lien Adresse du panneau et connectez-vous à Coolify avec les lignes E-mail et Mot de passe.
2. Sur la page Projects, ouvrez My first project et production, puis cliquez sur New resource.
3. Choisissez Public Git Repository, saisissez l'adresse de votre dépôt GitHub et appuyez sur Check repository.
4. Sous Build pack, choisissez Static, laissez Base Directory sur / et appuyez sur Continue. Cette option publie les fichiers tels quels, sans compilation.
5. Appuyez sur Deploy. Quand c'est terminé, ouvrez l'adresse HTTPS sur la page Domains.

Voilà, votre site est en ligne. Vous avez l'accès root, et vous pouvez tout gérer depuis le panneau si vous préférez.

Un outil de code peut le faire pour vous

Si vous comptez modifier souvent le site, un outil de code comme Claude Code ou Cursor vous simplifie la vie. Ouvrez dans l'outil le dossier contenant index.html, copiez la ligne Collez dans votre outil d'IA de votre panneau Seturack et collez-la. L'outil crée le dépôt, déploie le site et vous donne l'adresse. Notre guide de l'outil de code donne les détails. Les fenêtres de chat de ChatGPT et de Claude ne peuvent pas envoyer de commandes à un serveur : ne collez donc pas ce texte là-bas.

Quatre choses à savoir

• Formulaires : un formulaire de contact en HTML simple ne peut pas envoyer d'e-mail tout seul. Pour recevoir des messages, il doit se connecter à un service de formulaires ou à du code serveur.
• Comptes et paiements : la connexion, les enregistrements stockés et les paiements demandent du code serveur et une base de données. À ce stade, votre site est une application.
• Noms de fichiers : le serveur distingue majuscules et minuscules. Si le code dit logo.png et que le fichier est Logo.PNG, l'image ne s'affichera pas.
• Sauvegardes : la sauvegarde quotidienne est incluse dans le prix, et la copie principale de votre site reste sur GitHub.

Questions fréquentes

De combien de RAM un site HTML simple a-t-il besoin ?

Sans compilation, le site lui-même demande très peu : c'est donc Coolify qui fixe le plancher. Sa documentation demande au moins 2 cœurs et 2 Go de RAM. L'option Next.js en recommande plus à cause de ses compilations : au moins 4 Go de RAM, 2 vCores et 40 Go de disque.

Combien cela coûte-t-il par mois ?

Le minimum recommandé pour l'option Next.js est d'environ $6 par mois (TVA incluse), et hors de Turquie, vous payez en dollars américains. Vous trouverez des tailles plus petites sur la page des tarifs. La sauvegarde quotidienne est incluse dans le prix et le trafic est illimité. Un domaine est un coût à part, et vous l'achetez ailleurs.

Comment raccorder mon propre domaine ?

Faites pointer un enregistrement A vers l'adresse IP du serveur chez votre fournisseur de domaine. Dans Coolify, appuyez sur Add domain sur la page Domains, saisissez votre domaine avec https, enregistrez et appuyez sur Redeploy. Le certificat est émis automatiquement. Notre article sur les domaines explique l'enregistrement A.

Comment mettre à jour le site plus tard ?

Demandez la modification à ChatGPT ou Claude, envoyez le nouvel index.html sur GitHub sous le même nom et appuyez sur Redeploy dans Coolify. Pour publier à chaque envoi, ajoutez sur GitHub l'adresse de la page Webhooks de l'application, comme l'explique notre guide Next.js.

Ai-je besoin d'une base de données ?

Pas pour un site HTML simple. Pour stocker des données de visiteurs, vous pouvez créer PostgreSQL dans Coolify sur le même serveur, mais il vous faudra aussi du code serveur pour l'utiliser. À ce stade, passez à notre guide de déploiement d'application.

Prêt à l'emploi chez Seturack : Next.js, Coolify.