Comment déployer une application Codex

Vous pouvez déployer une application créée avec Codex de plusieurs façons, notamment à l’aide d’outils en ligne de commande, de plateformes basées sur des conteneurs, de pipelines CI/CD ou de déploiements basés sur Git, selon la plateforme d’hébergement que vous choisissez.

Avec Hostinger, vous pouvez déployer une application Codex basée sur Node.js en important un dépôt GitHub ou un fichier ZIP via le processus de configuration de l’application web Node.js dans hPanel. Hostinger gère automatiquement la détection du framework, le processus de compilation et le déploiement. Aucune configuration manuelle du serveur n’est donc nécessaire.

Voici comment déployer une application créée avec Codex sur Hostinger :

1. Préparez votre projet Codex pour le déploiement. Exportez votre projet depuis Codex via GitHub ou sous forme de fichier ZIP, et assurez-vous qu’il inclut un fichier package.json avant de le déployer.
2. Déployez votre application. Après avoir choisi un pack d’hébergement Node.js, connectez un dépôt GitHub pour des redéploiements automatiques ou importez un fichier ZIP pour une configuration unique plus rapide.
3. Ajoutez des variables d’environnement. Si votre application utilise des clés d’API, des URL de base de données ou des secrets d’authentification, vous pouvez les ajouter comme variables d’environnement dans hPanel au lieu de les coder en dur dans votre projet.
4. Testez la version en direct de votre application Codex. Ouvrez l’URL en ligne et vérifiez que votre application se charge correctement et que ses fonctionnalités principales fonctionnent comme prévu.
5. Gérez votre application déployée. Surveillez l’utilisation des ressources, mettez à jour les variables d’environnement, corrigez les vulnérabilités et redéployez de nouvelles versions à mesure que votre application évolue.
6. Surveillez les vulnérabilités et mettez à jour les dépendances. Hostinger analyse automatiquement votre application déployée afin de détecter les packages npm vulnérables. Pour les applications connectées à GitHub, vous pouvez utiliser la fonctionnalité de correction automatique pour corriger les vulnérabilités sans avoir à vérifier chaque dépendance manuellement.

Une fois votre projet déployé, pensez à vérifier régulièrement votre base de code. Codex étant un agent IA capable de générer et de modifier du code rapidement, il est recommandé d’examiner les changements qu’il propose avant chaque déploiement. Vous pourrez ainsi repérer d’éventuelles erreurs ou modifications involontaires avant qu’elles n’affectent vos utilisateurs.

1. Préparez votre application Codex pour le déploiement

Si vous avez connecté un dépôt GitHub pendant votre session de compilation, Codex peut y envoyer votre code directement. Vous pouvez aussi télécharger les fichiers du projet depuis Codex et les regrouper dans une archive ZIP si vous préférez ne pas vous connecter à un dépôt.

Dans tous les cas, assurez-vous que votre projet exporté inclut un fichier package.json avant de le déployer. Hostinger utilise ce fichier pour détecter votre framework, identifier les dépendances et déterminer le bon processus de compilation.

Sans cela, la détection automatique du framework peut échouer, et vous devrez peut-être indiquer manuellement des valeurs comme le répertoire de sortie, la commande de compilation ou le point d’entrée de l’application. Vous trouverez ces valeurs dans votre fichier package.json ou dans les fichiers de configuration du framework.

Hostinger prend en charge différents frameworks Node.js : Angular, Astro, Next.js, Nuxt, Parcel, React, React Router, Svelte, SvelteKit, Vite, Vue.js, Express, Fastify et Hono. Les versions de Node.js prises en charge sont 18.x, 20.x, 22.x et 24.x.

Vérifier la compatibilité en amont peut vous éviter bien des problèmes lors du déploiement de votre application Node.js.

Pensez également à rassembler tous les éléments nécessaires avant de commencer : variables d’environnement, clés d’API, identifiants de base de données et autres paramètres de configuration. Les avoir à portée de main vous permettra de gagner du temps et de limiter les risques d’erreur pendant le processus de déploiement.

2. Déployez votre application Codex

Pour commencer, vous aurez besoin d’un hébergement pour application web Node.js. Si vous avez déjà un pack d’hébergement Business ou Cloud chez Hostinger, il vous suffit de vous connecter à hPanel. Ensuite, rendez-vous dans Sites web → Ajouter un site web → Application web Node.js.

Vous pouvez également consulter notre page d’hébergement pour l’application Codex et acheter un pack si vous hébergez une application web avec Hostinger pour la première fois.

Lors de la configuration de l’hébergement Node.js, il vous sera demandé de choisir un nom de domaine à associer à votre projet. Vous pouvez aussi opter pour un nom de domaine temporaire généré aléatoirement.

Ensuite, sélectionnez la méthode de votre choix pour déployer une application Codex :

• Dépôt GitHub. Connectez votre dépôt directement à Hostinger. Après la configuration initiale, chaque modification envoyée vers la branche connectée déclenche automatiquement un nouveau déploiement. Idéal pour les projets que vous continuerez à mettre à jour.
• Importation d’un fichier ZIP. Importez les fichiers de votre projet Codex sous forme d’archive compressée. Aucune connexion à GitHub n’est nécessaire. Idéal pour les prototypes ou les déploiements ponctuels.

Quelle que soit la méthode choisie, Hostinger lira votre fichier package.json et détectera automatiquement votre framework ainsi que vos paramètres de compilation. Pour la plupart des projets, la configuration suggérée fonctionne telle quelle. Vous pouvez donc simplement cliquer sur Deploy (Déployer).

Si votre framework n’est pas détecté et est classé dans la catégorie Autre, vous devrez saisir manuellement le répertoire de sortie et le fichier d’entrée avant de déployer.

Pour un tutoriel complet étape par étape, consultez notre guide sur le déploiement d’applications créées avec Codex sur Hostinger (en anglais).

3. Ajoutez des variables d’environnement

De nombreuses applications créées avec Codex s’appuient sur des variables d’environnement pour fonctionner, en particulier celles qui se connectent à des bases de données externes, gèrent l’authentification des utilisateurs, traitent des paiements ou interagissent avec des API tierces.

Si votre application remplit l’une de ces fonctions, elle s’attendra à ce que certaines valeurs, telles que des clés d’API, des URL de base de données ou des secrets d’authentification, soient disponibles au moment de l’exécution.

Vous pouvez ajouter ces valeurs depuis le hPanel plutôt que de les intégrer directement dans votre projet. Cette approche permet de conserver les données sensibles hors de votre base de code et de mettre à jour les valeurs plus facilement, sans avoir à redéployer l’application.

Vérifiez le code généré par Codex afin d’identifier les noms des variables attendues par votre application. Pour les applications Next.js, les exemples courants incluent DATABASE_URL, API_KEY, et NEXT_PUBLIC_*.

Pour ajouter une variable d’environnement, ouvrez la section Environment variables (Variables d’environnement) dans le menu latéral gauche du tableau de bord de votre hébergement Node.js, puis cliquez sur Add environment variable (Ajouter une variable d’environnement). Vous serez ensuite invité à renseigner la clé et sa valeur.

Pour les connexions à une base de données, le tableau de bord Node.js de Hostinger inclut un assistant de configuration intégré pour Supabase et MongoDB Atlas. Ouvrez votre tableau de bord Node.js, accédez au menu Database (Base de données), cliquez sur Connect (Connecter), puis sélectionnez le fournisseur de base de données de votre choix.

Suivez ensuite les instructions affichées à l’écran pour renseigner les informations de connexion. Hostinger les enregistre automatiquement en tant que variables d’environnement et redéploie votre projet afin que la nouvelle configuration soit prise en compte immédiatement.

4. Testez votre application Codex

Une fois le déploiement terminé et les variables d’environnement connectées, accédez à l’URL en ligne de votre application et vérifiez que tout fonctionne comme prévu.

Commencez par vérifier que l’application se charge correctement et que toutes les pages sont accessibles. Testez ensuite les fonctionnalités principales de votre application, notamment les formulaires, les boutons, les flux d’authentification, les intégrations d’API, les fonctionnalités liées à la base de données et les autres interactions utilisateur essentielles.

Si votre application utilise des variables d’environnement ou des services externes, vérifiez également que ces connexions fonctionnent correctement. Si vous rencontrez un problème, consultez les journaux de déploiement dans hPanel pour obtenir plus d’informations. Recherchez le message d’erreur correspondant, mettez à jour votre projet ou vos paramètres de compilation si nécessaire, puis redéployez l’application.

Après chaque déploiement, poursuivez vos tests afin de vérifier que le problème a bien été résolu.

5. Gérez votre application Codex

Après le déploiement, vous pouvez gérer votre application Codex depuis le tableau de bord Node.js dans hPanel. Ce tableau de bord vous offre un espace centralisé pour surveiller votre application, mettre à jour sa configuration, résoudre les problèmes et redéployer l’application si nécessaire.

Depuis le tableau de bord, vous pouvez accéder aux éléments suivants :

• Lien rapide vers le dépôt GitHub : si vous avez déployé votre application via GitHub, un lien direct vers le dépôt connecté s’affiche.
• Statut du dernier déploiement : vérifiez si le déploiement le plus récent a réussi ou échoué, avec la date et l’heure correspondantes ainsi qu’un accès aux journaux de déploiement.
• Journaux de déploiement : consultez les détails des étapes de compilation et de déploiement pour faciliter le diagnostic des problèmes.
• Variables d’environnement : ajoutez, modifiez ou supprimez les variables d’environnement utilisées par votre application.
• Paramètres et redéploiement : mettez à jour les paramètres de compilation et redéployez l’application après avoir effectué des modifications.
• Gestionnaire de fichiers : parcourez et gérez les fichiers déployés directement depuis le hPanel.
• Graphiques d’utilisation des ressources : surveillez la consommation du processeur (CPU), de la mémoire (RAM) et des entrées/sorties (I/O).

Vous trouverez également une option Redémarrer pour les applications côté serveur qui exécutent un processus persistant, comme les applications Express.js, Next.js ou NestJS.

À mesure que votre application évolue, il est recommandé de surveiller régulièrement l’utilisation des ressources. Si le trafic augmente ou que votre application commence à exécuter des charges de travail plus exigeantes, consultez fréquemment les graphiques d’utilisation du CPU, de la RAM et des I/O dans le tableau de bord.

Lorsque l’utilisation se rapproche des limites de votre pack d’hébergement, envisagez d’optimiser votre application ou d’augmenter les ressources allouées afin de maintenir des performances fiables.

6. Surveillez les vulnérabilités et mettez à jour les dépendances

Déployer votre application n’est qu’un début. Comme les applications créées avec Codex s’appuient souvent sur des packages npm, il est important de surveiller les vulnérabilités et de mettre régulièrement les dépendances à jour.

Hostinger analyse les applications Codex déployées à la recherche de vulnérabilités npm connues et génère des rapports indiquant les noms des packages concernés, les niveaux de gravité et les versions corrigées disponibles.

Vous pouvez accéder à ces rapports en allant dans Security (Sécurité) → Vulnerabilities (Vulnérabilités) dans votre tableau de bord Node.js.

Lorsqu’une vulnérabilité est détectée, mettez à jour la dépendance concernée vers la version recommandée, puis redéployez l’application. Des mises à jour régulières des dépendances permettent de réduire les risques de sécurité, d’améliorer la stabilité et d’assurer le bon fonctionnement de votre application.

Si aucun correctif automatisé n’est disponible pour une vulnérabilité donnée, vous devrez mettre à jour manuellement le package concerné, puis redéployer.

Pour les applications déployées via GitHub, Hostinger propose également une fonctionnalité de correction automatique qui simplifie le processus de mise à jour. Au lieu de mettre à jour les paquets manuellement, vous pouvez générer directement depuis hPanel une pull request GitHub contenant les correctifs recommandés.

Une fois la pull request créée, vous pouvez examiner les modifications proposées, les fusionner si elles vous conviennent et déclencher automatiquement un nouveau déploiement.

Gardez à l’esprit que la correction automatique est disponible uniquement pour les applications Codex déployées via GitHub. Cette fonctionnalité nécessite également que l’application Hostinger GitHub dispose d’un accès en écriture à votre dépôt.

Si les autorisations nécessaires n’ont pas été accordées, vous verrez une erreur lorsque vous tenterez de créer une pull request. Dans ce cas, GitHub enverra un email au nom de Hostinger pour vous demander d’approuver la mise à jour des autorisations.

Hostinger ne fusionne jamais de modifications et n’envoie jamais de mises à jour directement vers vos branches. Chaque correction est soumise sous forme de pull request pour que vous puissiez l’examiner et l’approuver.

Le processus de correction automatique se limite aux mises à jour des dépendances et ne donne pas accès aux secrets de votre dépôt ni à vos variables d’environnement, ce qui vous permet de garder le contrôle total de votre code et de votre configuration.

Pour découvrir d’autres bonnes pratiques en matière de sécurité, consultez notre guide sur la sécurisation de votre application web.

Problèmes fréquents lors du déploiement d’une application Codex

Si votre application créée avec Codex ne se déploie pas ou ne s’exécute pas correctement, le problème est souvent lié à la configuration du projet, aux paramètres de compilation, aux dépendances ou à des variables d’environnement manquantes.

Le tableau ci-dessous présente les problèmes les plus courants lors du déploiement de Codex avec Hostinger, ainsi que les solutions pour les résoudre :

Déploiement via GitHub ou importation d’un fichier ZIP : quelle méthode choisir ?

Les deux méthodes permettent de mettre en ligne votre application créée avec Codex. Le bon choix dépend de la façon dont vous prévoyez de gérer et de mettre à jour l’application.

Le déploiement via GitHub est le meilleur choix pour les projets que vous prévoyez de faire évoluer. L’importation d’un fichier ZIP est une option tout à fait valable pour les cas d’usage les plus simples, car elle est plus rapide à mettre en place et ne nécessite pas de compte GitHub.

Le tableau ci-dessous présente plus en détail les différences entre le déploiement via GitHub et l’importation d’une archive ZIP :

Que pouvez-vous faire après avoir déployé une application Codex ?

Déployer votre application créée avec Codex, c’est transformer du code généré par l’IA en véritable produit accessible via une URL en ligne. Vous pouvez ainsi partager votre application avec de vrais utilisateurs et commencer à recueillir leurs retours dans un environnement réel.

Si votre application est connectée à GitHub, vous pouvez continuer à l’améliorer directement dans Codex. L’outil peut gérer plusieurs tâches d’amélioration en parallèle, valider les changements et ouvrir des pull requests à examiner.

Avec Hostinger, la fusion d’une PR déclenche un redéploiement automatique, ce qui vous permet de garder un cycle de création et de livraison fluide. Vous pouvez aussi connecter des bases de données et des API externes, surveiller l’utilisation des ressources et corriger les vulnérabilités des dépendances grâce aux outils d’analyse intégrés au hPanel.

Le code généré par Codex constitue un excellent point de départ, mais veillez toujours à le vérifier avant le passage en production. Utilisez l’environnement en ligne pour tester votre application en profondeur et considérez chaque déploiement comme une étape d’un cycle d’amélioration continu, et non comme une livraison ponctuelle.

Besoin d’inspiration pour votre prochain projet ? Consultez notre guide des meilleurs cas d’utilisation d’applications avec Codex.

Tout le contenu des tutoriels de ce site est soumis aux normes éditoriales et aux valeurs rigoureuses de Hostinger.

L'auteur

Suzy Keller

Spécialiste de la localisation et du marketing digital depuis plus de dix ans, Suzy se passionne pour les nouvelles technologies et cultive également un penchant très français pour les arts de la table, les vins et les spiritueux. Le reste du temps, elle se consacre aux voyages et aux promenades avec son chien.

Plus d'informations sur Suzy Keller