Avant de commencer
Installez Node.js 20 ou une version plus récente, npm, Git et la CLI Adios. Vous aurez aussi besoin d’un compte Adios et d’un dépôt Git de destination pour pousser le code source terminé.
Créer le projet Next.js
Cette commande explicite les choix : TypeScript, Tailwind, ESLint, App Router, un src répertoire, l'alias d'importation par défaut, et npm.
npx create-next-app@latest ./my-project \
--ts \
--tailwind \
--eslint \
--app \
--src-dir \
--import-alias "@/*" \
--use-npm
cd my-project
npm run devOuvert http://localhost:3000 et confirmez le chargement de la page de démarrage. Arrêtez le serveur de développement avant de continuer si vous voulez réutiliser le terminal.
Remplacer la page initiale
Remplacer src/app/page.tsx par une petite page rendue côté serveur. Conserver les métadonnées dans la page rend l’exemple complet sans modifier le layout racine généré.
import type { Metadata } from "next";
export const metadata: Metadata = {
title: "Northstar — A small app ready to ship",
description:
"A production-ready Next.js example with health and search metadata routes.",
};
const checks = [
"Responsive App Router page",
"Production health endpoint",
"Sitemap and robots routes",
"Repeatable Adios deployment",
];
export default function Home() {
return (
<main className="min-h-screen bg-slate-950 px-6 py-20 text-white">
<div className="mx-auto max-w-5xl">
<p className="text-sm font-semibold uppercase tracking-[0.18em] text-cyan-300">
Next.js on Adios
</p>
<h1 className="mt-5 max-w-3xl text-5xl font-bold tracking-tight sm:text-7xl">
Build the app. Keep the deployment clear.
</h1>
<p className="mt-6 max-w-2xl text-lg leading-8 text-slate-300">
This project has the files a production release needs, from a health
check to the runtime contract stored beside the source.
</p>
<div className="mt-12 grid gap-4 sm:grid-cols-2">
{checks.map((check) => (
<div
key={check}
className="rounded-xl border border-white/10 bg-white/5 p-5 text-base text-slate-200"
>
{check}
</div>
))}
</div>
<a
href="/api/health"
className="mt-10 inline-flex rounded-lg bg-white px-5 py-3 font-semibold text-slate-950"
>
Check application health
</a>
</div>
</main>
);
}Créer la route de santé
Ajouter src/app/api/health/route.ts. Adios appelle cette route avant de promouvoir la version candidate.
export function GET() {
return Response.json({ status: "ok" });
}Cette route doit répondre rapidement. Si votre application ne peut pas servir le trafic sans une base de données ou un autre service requis, déterminez si le contrôle de disponibilité doit aussi vérifier cette dépendance.
Ajouter les routes sitemap et robots
Les fichiers de métadonnées Next.js génèrent les fichiers publics /sitemap.xmlet /robots.txt en réponse. La valeur de repli locale permet de travailler en développement ; la production doit utiliser l’URL publique définitive.
import type { MetadataRoute } from "next";
const siteUrl =
process.env.NEXT_PUBLIC_SITE_URL ?? "http://localhost:3000";
export default function sitemap(): MetadataRoute.Sitemap {
return [
{
url: siteUrl + "/",
lastModified: new Date(),
changeFrequency: "weekly",
priority: 1,
},
];
}import type { MetadataRoute } from "next";
const siteUrl =
process.env.NEXT_PUBLIC_SITE_URL ?? "http://localhost:3000";
export default function robots(): MetadataRoute.Robots {
return {
rules: {
userAgent: "*",
allow: "/",
},
sitemap: siteUrl + "/sitemap.xml",
};
}Créer adios.yaml à la racine du projet
Ce fichier se place à côté de package.json. Il décrit comment Adios doit installer, compiler, démarrer et vérifier le projet actuel.
name: my-nextjs-app
region: de
replicas: 1
build_cmd: npm ci && npm run build
start_cmd: npm start
env:
NEXT_PUBLIC_SITE_URL: https://replace-with-your-route.adios.run
runtime:
name: node@24
port: 3000
health_path: /api/health
memory_mb: 1024Gardez le nom d’hôte provisoire pour le premier déploiement. Une fois qu’Adios renvoie la route générée, remplacez-le par l’origine HTTPS réelle et déployez à nouveau pour que le sitemap contienne la bonne URL.
Exécuter les contrôles de production localement
Le chargement d’une page en développement ne suffit pas. Exécutez le linter et la même compilation de production que celle utilisée pour le déploiement.
npm run lint
npm run buildSi l'une ou l'autre commande échoue, corrigez la première erreur et réexécutez les deux vérifications avant de déployer.
Se connecter et déployer le code source actuel
Exécutez les commandes du répertoire qui contient adios.yaml. Examinez les autorisations demandées avant de laisser le déploiement se poursuivre.
adios login
adios upAdios envoie le code source actuel, lance la compilation, démarre le processus de production, vérifie /api/health, puis renvoie une route HTTPS générée lorsque la version est saine.
Ouvrir et vérifier l’application en production
Ouvrez le nom d'hôte généré et vérifiez les quatre réponses :
/affiche la nouvelle page./api/healthrenvoie{"status":"ok"}./robots.txtautorise l’exploration par les robots et indique le sitemap./sitemap.xmlcontient l'URL de production publique.
Remplacer la valeur provisoire NEXT_PUBLIC_SITE_URL dans adios.yaml avec le nom d'hôte généré ou votre domaine personnalisé, lancez adios up à nouveau, puis répétez les vérifications. Utilisez Domaines et redirections lors de l’ajout d’un nom d’hôte de production.
Examiner le code source fonctionnel, créer un commit et le pousser
Examinez les changements avant de les inscrire dans l’historique. Le diff doit montrer la page, la route de santé, les routes de métadonnées pour les moteurs de recherche et le manifeste que vous venez de vérifier.
git status
git diff
git add src/app/page.tsx src/app/api/health/route.ts \
src/app/sitemap.ts src/app/robots.ts adios.yaml
git diff --cached
git commit -m "Build and deploy the Next.js app"
git remote -v
git push -u origin mainVérifiez le dépôt distant et la branche avant la commande finale. Si git remote -v est vide, créez d’abord le dépôt distant et ajoutez son URL comme origin.
Projet achevé
Vérifiez les fichiers avant la prochaine fonctionnalité.
my-project/
├── adios.yaml
├── package.json
├── package-lock.json
└── src/
└── app/
├── api/
│ └── health/
│ └── route.ts
├── page.tsx
├── robots.ts
└── sitemap.tsProblèmes courants
Pourquoi l’application Next.js a-t-elle besoin d’une route de santé ?
Adios utilise la route de santé pour confirmer que le processus de production est prêt avant de promouvoir la version. Répondez rapidement et ne renvoyez un statut de réussite que si l’application peut servir le trafic.
Pourquoi dois-je remplacer l'URL du site après le premier déploiement ?
Un sitemap nécessite des URL de production absolues. Le premier déploiement Adios crée le nom d’hôte généré : remplacez donc la valeur provisoire dans adios.yaml par ce nom d’hôte, puis déployez une nouvelle fois avant de considérer le sitemap comme définitif.
Que faire si npm run build échoue ?
Corrigez la compilation de production locale avant de déployer. Commencez par la première erreur, vérifiez la version de Node et le fichier de verrouillage, et ne prenez pas le bon fonctionnement d’un serveur de développement comme preuve que la compilation de production fonctionne.
Que faire si la version démarre mais ne devient jamais saine ?
Vérifiez que package.json contient un script start exécutant next start, que l’application écoute sur le port 3000 et qu’adios.yaml utilise le même port et le chemin /api/health. Consultez ensuite les journaux d’exécution pour trouver la première erreur de démarrage ou de contrôle de santé avant de redéployer.
Que faire si le projet n’a pas de dépôt Git distant ?
Créez un dépôt vide chez votre fournisseur Git, ajoutez-le comme origin, vérifiez le nom de la branche, puis poussez. N’exécutez pas la commande push d’exemple tant que git remote -v n’affiche pas la destination attendue.
Continuez à développer.
Utilisez le même contrat avec un agent de programmation IA.
Le guide IA transforme ces mêmes fichiers et vérifications en prompts pour Codex, ChatGPT, Gemini et Claude.
Ouvrir le workflow IA