Aller à l'article
Aniq-UI

3D LandingMettre le site en ligne

Mettre le site en ligne

Déployez sur Vercel, sur n'importe quel serveur avec Node.js, ou sous forme d'image Docker.

Le site est une simple application Next.js, sans base de données, sans API et sans secrets. Vérifiez d'abord qu'il se construit sur votre ordinateur :

Terminaldans juicy
yarn build

Puis choisissez l'une des trois façons ci-dessous.

Variables d'environnement

Aucune n'est nécessaire, ni au build ni à l'exécution. La seule variable que lit le code est un commutateur de build facultatif :

VariableQuandRôle
BUILD_STANDALONEBuildtrue fait écrire à yarn build un serveur autonome dans .next/standalone. Le Dockerfile la définit ; laissez-la non définie partout ailleurs.

Vercel

  1. Mettez le dossier dans un dépôt Git

    Poussez le dossier juicy sur GitHub, GitLab ou Bitbucket. .gitignore exclut déjà node_modules et le résultat du build.

  2. Importez-le dans Vercel

    Dans Vercel, ajoutez un nouveau projet à partir de ce dépôt. Il détecte Next.js ; gardez les réglages de build par défaut.

  3. Laissez Vercel utiliser Yarn 4

    Avant le premier déploiement, ajoutez une variable d'environnement au projet, pour que Vercel installe avec la version de Yarn figée dans package.json :

    Variable d'environnement Vercel
    ENABLE_EXPERIMENTAL_COREPACK=1
  4. Déployez

    Lancez le déploiement. Chaque push sur le dépôt redéploie le site.

    Résultat attendu: Le site répond sur son adresse Vercel, puis sur votre domaine une fois que vous l'avez ajouté dans les réglages du projet.

N'importe quel serveur avec Node.js

Sur un serveur avec Node.js 22 ou plus récent, copiez le dossier juicy, puis installez-le, construisez-le et démarrez-le :

Terminaldans juicy
corepack enable
yarn install
yarn build
yarn start

Il écoute sur le port 3030. Faites pointer votre domaine vers lui via un reverse proxy comme Nginx ou Caddy, et gardez-le en marche avec un gestionnaire de processus comme pm2 ou un service systemd.

yarn start ignore une variable PORT. Sur un hébergeur qui attribue lui-même le port, indiquez-lui que l'application écoute sur 3030, ou démarrez-la avec yarn next start -p $PORT.

Le site ne répond pas sur un service d'hébergement

Docker

La même image que vous lancez en local tourne sur un serveur. Elle sert un build autonome sur le port 3030 et n'a besoin d'aucune variable. Sur le serveur, depuis le dossier juicy :

Terminaldans juicy
docker build -t juicy .
docker run -d --restart unless-stopped --name juicy -p 3030:3030 juicy

--restart unless-stopped le redémarre après un redémarrage du serveur. Faites pointer votre domaine vers le port 3030 via un reverse proxy. Tout hébergeur qui lance un conteneur à partir d'un Dockerfile peut le construire de la même façon.

Pour mettre à jour le site, reconstruisez l'image, puis remplacez le conteneur :

Terminaldans juicy
docker build -t juicy .
docker rm -f juicy
docker run -d --restart unless-stopped --name juicy -p 3030:3030 juicy

Étapes suivantes

Bloqué sur une étape ?

Trouvez une solution avant de tout recommencer.

Dépannage

Préférences des Cookies

Nous utilisons des cookies pour améliorer votre expérience de navigation, analyser le trafic du site et personnaliser le contenu. En cliquant sur "Accepter Tout", vous consentez à notre utilisation des cookies pour l'analyse et la publicité personnalisée.