Pour déployer un site web depuis Cursor, envoyez votre code vers un dépôt GitHub, puis connectez ce dépôt à un hébergeur qui se chargera de la compilation et de la mise en ligne.
Cursor est un éditeur de code axé sur l’IA, basé sur le code source de Visual Studio Code (VS Code). Il vous permet d’écrire et de modifier du code, mais aussi de créer la structure de projets entiers à l’aide de prompts en langage naturel. Il ne dispose toutefois pas de fonctionnalité d’hébergement intégrée.
Voici comment mettre en ligne un site créé avec Cursor en six étapes :
- Préparez votre projet pour la production en exécutant une commande de compilation et en corrigeant les erreurs signalées par l’IA de Cursor.
- Envoyez votre code vers un dépôt GitHub depuis Cursor.
- Connectez le dépôt à votre hébergeur.
- Configurez les paramètres de compilation pour que l’hébergeur sache comment compiler votre projet et le mettre en ligne.
- Déployez votre site web et attendez que l’hébergeur le mette en ligne.
- Testez votre site en ligne sur différents appareils pour vérifier que tout fonctionne comme prévu.
Si vous êtes client Hostinger, l’extension Hostinger Connector vous permet de déployer votre site directement depuis Cursor Chat avec un seul prompt, sans avoir à gérer séparément Git, les paramètres de compilation et les tableaux de bord d’hébergement.
Si aucune de ces deux méthodes ne convient à votre configuration, vous pouvez également déployer votre site web depuis Cursor à l’aide d’un outil en ligne de commande (CLI), comme celui de Vercel ou de Netlify, pour un déploiement rapide avec une seule commande. Vous pouvez aussi utiliser GitHub Pages pour héberger gratuitement un site statique ou téléverser manuellement les fichiers générés par Cursor à l’aide du gestionnaire de fichiers de votre hébergeur.
Quelle que soit la méthode choisie, si une erreur survient pendant le déploiement, copiez le message d’erreur dans Cursor Chat. L’IA l’analysera et vous proposera une solution ou réécrira le fichier à l’origine du problème.
Prérequis pour déployer un site web depuis Cursor
Pour déployer un site web depuis Cursor, vous devez avoir installé Cursor et Git sur votre ordinateur, disposer d’un compte GitHub actif et d’un pack d’hébergement web. Les prérequis sont similaires à ceux du déploiement de sites web depuis d’autres environnements de développement intégrés (IDE).
Vous devez installer les outils suivants :
- Cursor. Téléchargez l’application de bureau depuis cursor.com pour Windows, macOS ou Linux, puis connectez-vous à votre compte.
- Git. Cet outil de gestion de versions vous permet d’envoyer votre code depuis Cursor vers GitHub. Installez Git si ce n’est pas déjà fait.
Vous aurez également besoin des comptes et services suivants :
- Compte GitHub. GitHub permet de stocker votre projet dans un dépôt auquel votre hébergeur pourra accéder pour publier votre site. Un compte gratuit suffit.
- Pack d’hébergement web. Il vous permet d’héberger votre site web et de le rendre accessible aux visiteurs.
Comment déployer un site web depuis Cursor avec GitHub
Pour déployer un site web depuis Cursor à l’aide de GitHub, envoyez votre code vers un dépôt GitHub, puis connectez celui-ci à un hébergeur. Ce dernier récupérera le code pour mettre votre site en ligne.
Si vous avez déjà déployé un site web depuis VS Code, la procédure est presque identique, car les deux éditeurs utilisent le même système Git.
Les deux éditeurs disposent également de leur propre chat IA, que vous pouvez utiliser pour des tâches similaires, notamment préparer votre projet, envoyer votre code sur GitHub et résoudre les problèmes rencontrés.
La principale différence est que Cursor place l’IA au cœur de ses fonctionnalités, tandis que VS Code l’utilise comme un outil complémentaire. Cursor est donc particulièrement adapté si vous avez principalement développé votre projet à l’aide de prompts, une approche appelée vibe coding.
1. Préparez votre projet pour le déploiement
Pour préparer votre projet, ouvrez Cursor Chat et demandez à l’IA de vérifier que tout est prêt avant d’envoyer votre code sur GitHub :
Vérifiez que ce projet est prêt pour le déploiement, corrigez les éventuels problèmes et exécutez la compilation de production.
Si votre projet utilise un outil de compilation, notamment avec React, Vue, Next.js ou un autre framework basé sur Node.js, Cursor analyse votre code, corrige les problèmes courants, comme l’absence de configuration de compilation ou les références à localhost codées en dur, puis exécute npm run build à votre place. Si la compilation échoue, l’IA analyse l’erreur et propose une solution.
Pour un site composé uniquement de fichiers HTML et CSS, vous pouvez également demander à Cursor de rechercher les liens rompus, les ressources manquantes ou les chemins d’accès incorrects avant d’envoyer votre code.
2. Envoyez votre code sur GitHub
Pour envoyer votre code, indiquez à Cursor votre nom d’utilisateur GitHub et le nom souhaité pour le dépôt dans le chat :
Envoyez ce projet vers un nouveau dépôt GitHub nommé my-website sur mon compte your-username.
Cursor exécute les commandes Git, crée le commit et envoie votre code vers GitHub. Si vous effectuez cette opération pour la première fois, GitHub ouvre une fenêtre dans votre navigateur pour vous demander de vous connecter et d’autoriser l’accès.
Si vous préférez exécuter les commandes vous-même, ouvrez le terminal depuis Affichage → Terminal, puis exécutez :
git init git add . git commit -m "Initial commit" git remote add origin https://github.com/your-username/my-website.git git push -u origin main
Remplacez your-username par votre nom d’utilisateur GitHub. Si vous choisissez cette méthode, créez au préalable un dépôt vide sur GitHub, sans fichier README.
3. Connectez votre dépôt GitHub à un hébergeur
En général, la connexion d’un dépôt GitHub à un hébergeur s’effectue depuis le tableau de bord de ce dernier. Recherchez les paramètres de déploiement, les paramètres Git ou le menu d’intégration GitHub. Autorisez ensuite l’accès à GitHub pour permettre à l’hébergeur d’accéder à votre dépôt.
Chez Hostinger, par exemple, vous pouvez connecter GitHub de deux façons selon le type de projet, à condition de disposer du pack d’hébergement web Business ou d’une offre supérieure.
Pour déployer une application Node.js, notamment une application développée avec un framework basé sur Node.js comme React ou Express, accédez à Tableau de bord Hostinger → Sites web → Créer un site → Application web Node.js.
Vous devrez ensuite saisir votre nom de domaine personnalisé ou utiliser un nom de domaine temporaire gratuit, puis choisir l’emplacement de votre hébergement. Une fois ces informations renseignées, cliquez sur Se connecter avec GitHub pour autoriser l’accès.
Pour un site statique créé avec HTML, CSS et JavaScript, un projet PHP ou un site WordPress, accédez à Tableau de bord Hostinger → Sites web → sélectionnez le site → Tableau de bord → Avancé → GIT. Cliquez ensuite sur Connectez-vous avec GitHub et autorisez l’intégration.
4. Configurez les paramètres de compilation
Une fois votre dépôt GitHub connecté à l’hébergeur, vous devrez généralement définir les paramètres nécessaires à la compilation et à la mise en ligne de votre projet. Vous pouvez ignorer cette étape pour les sites statiques.
Pour les projets utilisant un framework, trois champs doivent être renseignés :
- Commande de compilation. Cette commande compile votre code pour générer les fichiers de production. React et Vite utilisent npm run build, tandis que Next.js utilise next build.
- Répertoire de sortie. Il s’agit du dossier dans lequel la commande de compilation enregistre les fichiers générés. Vite utilise dist, Create React App utilise build et Next.js utilise .next. Si vous indiquez un répertoire incorrect, votre hébergeur risque de publier une page vide.
- Commande de démarrage. Pour une application Node.js, la commande permettant de démarrer le serveur est généralement npm start ou node server.js.
Chez Hostinger, le système détecte automatiquement les paramètres de compilation et de démarrage appropriés. Vous pouvez toutefois les modifier si nécessaire.
Si vous ne savez pas quelles valeurs renseigner, vous pouvez poser cette question à Cursor Chat : « Quelles sont la commande de compilation, le répertoire de sortie et la commande de démarrage de mon projet ? » L’IA analyse votre fichier package.json et la configuration de votre framework pour vous fournir les valeurs appropriées.
5. Déployez votre site web
Une fois les paramètres de compilation configurés, suivez les instructions affichées dans le tableau de bord de votre hébergeur et attendez la fin de la compilation. La plupart des hébergeurs affichent des journaux en temps réel pour vous permettre de suivre son avancement.
Si la compilation réussit, un message de confirmation s’affiche avec l’URL de votre site en ligne, comme dans l’exemple suivant :
Si la compilation échoue, le journal indique ce qui a posé problème. Copiez le message d’erreur dans Cursor Chat, laissez l’IA corriger le problème, puis envoyez les modifications vers GitHub. Redéployez ensuite votre projet depuis le tableau de bord de votre hébergeur.
6. Testez votre site en ligne
Votre site web est désormais déployé, mais il est important de vérifier que tout fonctionne comme prévu. Ouvrez l’URL dans votre navigateur et parcourez toutes les pages pour vous assurer que les images s’affichent, que l’envoi des formulaires fonctionne correctement et que les liens mènent aux bonnes destinations.
Effectuez également des tests sur un téléphone et une tablette, car la mise en page peut varier sur les petits écrans. Vérifiez aussi que votre certificat SSL est actif : le site doit se charger en HTTPS et le navigateur doit indiquer que la connexion est sécurisée dans la barre d’adresse.
Si vous constatez un problème, décrivez-le dans Cursor Chat et joignez une capture d’écran si nécessaire pour que l’IA puisse l’analyser et le corriger. Demandez-lui ensuite d’envoyer les modifications vers GitHub.
Certains hébergeurs, dont Hostinger, prennent en charge le redéploiement automatique, ce qui permet de mettre à jour votre site chaque fois que vous envoyez du nouveau code sur GitHub. Vérifiez auprès de votre hébergeur si cette fonctionnalité est disponible avec votre pack.
Comment déployer un site web depuis Cursor avec Hostinger Connector
Pour déployer un site web depuis Cursor avec Hostinger Connector, installez l’extension dans Cursor, connectez-la à votre compte Hostinger à l’aide d’un jeton API, puis demandez à l’IA de Cursor de publier votre projet sur votre pack d’hébergement.
Hostinger Connector est une extension, appelée plugin dans Cursor, qui donne à votre agent IA un accès direct à plus de 100 outils Hostinger. Ces outils permettent notamment de déployer des sites web, de gérer les noms de domaine, de configurer les paramètres DNS, de surveiller les VPS et de gérer la facturation du compte.
Avec Hostinger Connector, vous pouvez gérer l’ensemble du déploiement depuis Cursor Chat à l’aide d’un seul prompt, sans envoyer votre code sur GitHub ni ouvrir le tableau de bord Hostinger pour connecter le dépôt et déployer votre site.
Pour utiliser l’extension, un compte Hostinger actif suffit. Toutefois, pour effectuer des opérations comme le déploiement d’un site web, vous devez également disposer d’un service Hostinger actif, tel qu’un pack d’hébergement.
1. Configurez Hostinger Connector dans Cursor
Pour configurer Hostinger Connector, ouvrez Cursor Chat et saisissez :
/add-plugin https://github.com/hostinger/hostinger-cursor-plugin
Cursor télécharge l’extension et configure le serveur MCP Hostinger dans votre projet. Une fois l’installation terminée, un message de confirmation récapitule les éléments installés, notamment les skills de déploiement et la configuration du serveur MCP.
Ce message vous indique également les prochaines étapes, notamment comment configurer votre jeton API Hostinger et redémarrer Cursor pour appliquer la nouvelle configuration.
2. Connectez votre compte Hostinger
Une fois Hostinger Connector installé, connectez l’extension à votre compte Hostinger à l’aide d’un jeton API. Voici comment en obtenir un :
- Connectez-vous au Tableau de bord Hostinger, puis accédez à Outils de développement → API dans la barre latérale gauche.
- Cliquez sur Générer un nouveau jeton, saisissez un nom et choisissez une date d’expiration.
- Cliquez sur Générer et copiez immédiatement le jeton, car le tableau de bord Hostinger ne l’affiche qu’une seule fois.
Une fois le jeton copié, ouvrez le terminal de votre ordinateur (et non celui de Cursor), puis enregistrez-le dans une variable d’environnement.
Sur macOS ou Linux :
export HOSTINGER_API_TOKEN=your-token-here
Sur Windows :
setx HOSTINGER_API_TOKEN "your-token-here"
Remplacez your-token-here par le jeton que vous venez de copier.
Fermez ensuite complètement Cursor avec Cmd+Q sur macOS ou Fichier → Quitter sous Windows, puis relancez l’application.
Ouvrez une nouvelle conversation et saisissez /hostinger-status pour vérifier que la connexion fonctionne. Si la réponse affiche la liste de vos services actifs, cela confirme que la connexion est établie.
Vous pouvez également vérifier la connexion dans Paramètres → Outils et MCP, en vous assurant que le serveur hostinger affiche un indicateur d’état vert.
3. Déployez votre projet sur Hostinger
Pour déployer votre projet sur Hostinger, ouvrez-le dans Cursor, puis demandez à l’IA de le mettre en ligne avec un prompt comme celui-ci :
Déployez ce projet sur mon pack d’hébergement Hostinger Business avec le domaine domain.tld.
Cursor analyse votre projet, lance la compilation si nécessaire et transfère les fichiers vers votre compte Hostinger. Une fois le déploiement terminé, un lien vers votre site en ligne apparaît directement dans le chat.
Comme Cursor vous permet de créer des projets entiers grâce au vibe coding, vous pouvez également développer et déployer un site avec un seul prompt :
Créez un site portfolio personnel avec une section principale de présentation, une page « À propos » et un formulaire de contact. Déployez-le sur l’un de mes packs d’hébergement Hostinger actifs en utilisant un nom de domaine temporaire.
Cette méthode convient bien aux projets simples. Pour les projets plus complexes, vous devrez probablement échanger plusieurs fois avec l’IA et affiner votre projet avant de le déployer, mais la procédure reste la même.
Si une erreur survient pendant le déploiement, saisissez :
Analysez l’échec de ma dernière compilation.
L’extension récupère les journaux de compilation depuis Hostinger et identifie le problème. Vous pouvez ensuite demander à l’IA de le corriger et de redéployer le projet.
Autres méthodes pour déployer un site web depuis Cursor
Vous pouvez également publier un site web depuis Cursor à l’aide d’un outil en ligne de commande, comme celui de Vercel ou de Netlify, en utilisant GitHub Pages pour les sites statiques ou en téléversant manuellement les fichiers à l’aide du gestionnaire de fichiers de votre hébergeur.
Ces méthodes sont utiles si votre hébergeur ne prend pas en charge l’intégration GitHub ou si vous n’êtes pas client Hostinger et ne pouvez donc pas utiliser Hostinger Connector.
Comment déployer un site directement depuis le terminal de Cursor avec un outil en ligne de commande
Certaines plateformes d’hébergement, comme Vercel et Netlify, permettent de déployer directement un site sur leurs serveurs à l’aide de leurs propres outils en ligne de commande.
Avec Vercel, ouvrez le terminal de Cursor depuis Affichage → Terminal, puis exécutez :
npm i -g vercel vercel login vercel
Pour Netlify, la procédure est similaire :
npm i -g netlify-cli netlify login netlify deploy
Lors de leur première exécution, ces outils ouvrent une fenêtre dans votre navigateur pour vous permettre de vous connecter.
Une fois le déploiement terminé, vous obtenez l’URL de votre site en ligne. Les deux plateformes permettent également de connecter un dépôt Git après leur configuration, afin que les prochains envois de code puissent déclencher des redéploiements automatiques.
Comment publier un site statique sur GitHub Pages depuis Cursor
GitHub Pages permet d’héberger gratuitement un site statique directement depuis un dépôt GitHub.
Ce service convient particulièrement aux portfolios, aux sites de documentation et aux landing pages. En revanche, il ne convient pas aux projets nécessitant du code côté serveur ou une base de données.
Pour configurer GitHub Pages, envoyez votre code vers GitHub depuis Cursor comme d’habitude, puis ouvrez le dépôt sur GitHub. Accédez à Paramètres → Code et automatisation → Pages, puis choisissez votre branche dans la section Création et déploiement. Pour consulter votre site en ligne, cliquez sur Visiter le site.
Comment déployer un site depuis Cursor en téléversant manuellement les fichiers
Si vous ne souhaitez pas configurer Git ni installer d’outils supplémentaires, vous pouvez téléverser les fichiers de votre site web directement à l’aide du gestionnaire de fichiers de votre hébergeur.
Vous pouvez demander à Cursor de préparer votre projet dans un format adapté au téléversement, comme une archive .zip, selon les formats acceptés par votre hébergeur. Cursor enregistrera le fichier directement dans le dossier de votre projet.
Il vous suffira ensuite de téléverser le fichier à l’aide du gestionnaire de fichiers de votre hébergeur. Vous devrez répéter cette procédure à chaque mise à jour de votre site, car cette méthode ne prend pas en charge le redéploiement automatique.
Que faire après votre premier déploiement ?
Après votre premier déploiement depuis Cursor, associez un nom de domaine personnalisé à votre site si ce n’est pas déjà fait, configurez des sauvegardes pour le protéger au fil de son développement et mettez en place un suivi des erreurs pour détecter les problèmes rencontrés par les visiteurs.
- Associez un nom de domaine personnalisé. Si votre site utilise encore une URL temporaire ou un sous-domaine par défaut, achetez un nom de domaine et configurez ses paramètres DNS pour qu’il pointe vers votre hébergeur. Si votre nom de domaine et votre hébergement proviennent du même prestataire, la connexion s’effectue généralement automatiquement.
- Continuez à améliorer votre site. La procédure de déploiement reste la même à chaque mise à jour. Vous pouvez donc continuer à faire évoluer votre site, même une fois en ligne. Demandez à Cursor d’ajouter des pages, de repenser certaines sections ou de développer de nouvelles fonctionnalités, puis envoyez vos modifications.
- Configurez des sauvegardes. Créez des sauvegardes de votre site pour pouvoir revenir à une version précédente si un prochain déploiement introduit un bogue. La plupart des hébergeurs, dont Hostinger, proposent des sauvegardes quotidiennes automatiques. Certains permettent également de créer un snapshot manuel avant des modifications importantes.
- Mettez en place un suivi des erreurs. Des outils comme Sentry peuvent détecter les erreurs rencontrées par les visiteurs, y compris celles que vous ne parvenez pas à reproduire sur votre ordinateur. Vous pouvez ensuite copier les rapports d’erreur dans Cursor Chat pour bénéficier de l’aide de l’IA lors du débogage.
Cet article est une version localisée de How to deploy a website from Cursor, initialement publié en anglais.
Tout le contenu des tutoriels de ce site est soumis aux normes éditoriales et aux valeurs rigoureuses de Hostinger.
Faradilla, plus connue sous le nom de Ninda, possède 10 ans d’expérience en tant que linguiste et 5 ans en tant que spécialiste du marketing de contenu chez Hostinger. Elle aime suivre les tendances technologiques et aider les autres à résoudre leurs problèmes. Pendant son temps libre, Ninda aime apprendre de nouvelles langues et s’intéresser aux sciences de la vie, ainsi que regarder des vidéos d’animaux. Pour en savoir plus sur Ninda, retrouvez-la sur LinkedIn.
