Antes de empezar
Instala Node.js 20 o una versión posterior, npm, Git y la CLI de Adios. También necesitarás una cuenta de Adios y un repositorio Git de destino si quieres subir el código fuente terminado.
Crea el proyecto Next.js
Este comando especifica todas las opciones: TypeScript, Tailwind, ESLint, App Router, el src directorio, el alias de importación predeterminado, y npm.
npx create-next-app@latest ./my-project \
--ts \
--tailwind \
--eslint \
--app \
--src-dir \
--import-alias "@/*" \
--use-npm
cd my-project
npm run devAbierto http://localhost:3000 y confirma que carga la página inicial. Detén el servidor de desarrollo antes de continuar si quieres reutilizar la terminal.
Sustituye la página inicial
Sustituye src/app/page.tsx por una pequeña página renderizada en el servidor. Mantener los metadatos en la página completa el ejemplo sin modificar el layout raíz generado.
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>
);
}Crea la ruta de estado
Añadir src/app/api/health/route.ts. Adios solicitará esta ruta antes de pasar la versión candidata a producción.
export function GET() {
return Response.json({ status: "ok" });
}Mantén esta ruta rápida. Si tu aplicación no puede atender tráfico sin una base de datos u otro servicio necesario, decide si la comprobación de disponibilidad también debe verificar esa dependencia.
Añade las rutas de sitemap y robots
Los archivos de metadatos de Next.js generan las respuestas públicas de /sitemap.xmly /robots.txt . El valor alternativo local permite seguir trabajando en desarrollo; en producción debe utilizarse la URL pública definitiva.
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",
};
}Crea adios.yaml en la raíz del proyecto
Este archivo debe ir junto a package.json. Registra cómo debe Adios instalar, compilar, iniciar y comprobar el proyecto actual.
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: 1024Mantén el nombre de host de ejemplo para el primer despliegue. Cuando Adios devuelva la ruta generada, sustitúyelo por el origen HTTPS real y vuelve a desplegar para que el mapa del sitio contenga la URL correcta.
Ejecuta las comprobaciones de producción en local
No basta con que una página cargue en desarrollo. Ejecuta el linter y la misma compilación de producción que se utilizará en el despliegue.
npm run lint
npm run buildSi falla cualquiera de los comandos, corrige el primer error y vuelve a ejecutar ambas comprobaciones antes de desplegar.
Inicia sesión y despliega el código fuente actual
Ejecuta los comandos desde el directorio que contiene adios.yaml. Revisa los permisos solicitados antes de permitir que continúe el despliegue.
adios login
adios upAdios sube el código fuente actual, ejecuta la compilación, inicia el proceso de producción, comprueba /api/health, y devuelve una ruta HTTPS generada cuando la versión supera las comprobaciones de estado.
Visita y verifica la aplicación en producción
Abre el nombre de host generado y comprueba las cuatro respuestas:
/renderiza la nueva página./api/healthdevuelve{"status":"ok"}./robots.txtpermite el rastreo e indica el mapa del sitio./sitemap.xmlcontiene la URL de producción pública.
Sustituye el valor de ejemplo de NEXT_PUBLIC_SITE_URL en adios.yaml por el nombre de host generado o tu dominio personalizado, ejecuta adios up de nuevo y repite las comprobaciones. Usa Dominios y redirecciones al asociar un nombre de host de producción.
Revisa, haz un commit y sube el código fuente que funciona
Revisa los cambios antes de guardarlos en el historial. Las diferencias deben mostrar la página, la ruta de estado, las rutas de metadatos de búsqueda y el manifiesto que acabas de verificar.
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 mainConfirma el remoto y la rama antes del último comando. Si git remote -v está vacío, crea primero el repositorio remoto y añade su URL como origin.
Proyecto terminado
Comprueba los archivos antes de añadir la siguiente función.
my-project/
├── adios.yaml
├── package.json
├── package-lock.json
└── src/
└── app/
├── api/
│ └── health/
│ └── route.ts
├── page.tsx
├── robots.ts
└── sitemap.tsProblemas comunes
¿Por qué necesita una ruta de estado la aplicación Next.js?
Adios utiliza la ruta de estado para confirmar que el proceso de producción está listo antes de pasar la versión a producción. Mantén la respuesta rápida y devuelve un estado de éxito solo cuando la aplicación pueda atender tráfico.
¿Por qué necesito reemplazar la URL del sitio después del primer despliegue?
Un mapa del sitio necesita URL absolutas de producción. El primer despliegue en Adios crea el nombre de host generado, así que sustituye el marcador de posición de adios.yaml por ese nombre y vuelve a desplegar antes de dar el mapa del sitio por definitivo.
¿Qué pasa si falla npm run build?
Corrige la compilación local de producción antes de desplegar. Empieza por el primer error, confirma la versión de Node y el archivo de bloqueo de dependencias y no des por hecho que la compilación de producción funciona solo porque el servidor de desarrollo funciona.
¿Qué pasa si la versión arranca pero nunca supera las comprobaciones de estado?
Confirma que package.json tiene un script de inicio que ejecuta next start, que la aplicación escucha en el puerto 3000 y que adios.yaml utiliza el mismo puerto y la ruta /api/health. Después consulta los registros del entorno de ejecución para localizar el primer error de inicio o de comprobación de estado antes de volver a desplegar.
¿Qué pasa si el proyecto no tiene un remoto Git?
Crea un repositorio vacío con tu proveedor de Git, añádelo como origin, confirma el nombre de la rama y después sube el código. No ejecutes el comando push del ejemplo hasta que git remote -v muestre el destino que esperas.
Sigue creando
Usa el mismo contrato con un agente de programación con IA.
La guía de IA convierte estos mismos archivos y comprobaciones en instrucciones para Codex, ChatGPT, Gemini y Claude.
Abre el flujo de trabajo con IA