Ir al artículo
Aniq-UI

SaaS TemplatePublícala en internet

Publícala en internet

Publica el sitio en Vercel, en cualquier servidor que ejecute Node.js o como una imagen de Docker.

Antes de desplegar

Define NEXT_PUBLIC_SITE_URL con la dirección que tendrá el sitio, como https://www.your-domain.com. Se compila en el sitio cuando se construye, así que hay que definirlo donde se hace la construcción, no solo donde se ejecuta el sitio.

No se necesita nada más: no hay base de datos ni secretos.

  • Conecta los formularios que conserves a tu propio servicio. Hasta entonces muestran un mensaje de éxito y no envían nada.
  • Reemplaza el contenido de ejemplo: los textos, cifras, testimonios, logotipos de empresas, datos de contacto y artículos del blog.
  • Haz que revisen las cuatro páginas legales para tu negocio. Son texto de ejemplo.

Vercel

  1. Pon la carpeta en un repositorio de Git privado

    Sube la carpeta Nextjs-landing-page-template-2 a un repositorio privado en GitHub, GitLab o Bitbucket. Tu licencia no permite compartir el código fuente públicamente. La descarga ya incluye un .gitignore que deja fuera node_modules, la versión construida y tus archivos .env.

  2. Impórtala en Vercel

    En Vercel, añade un proyecto nuevo a partir de ese repositorio. Detecta Next.js; conserva los ajustes de construcción por defecto.

  3. Añade las variables de entorno

    En las Environment Variables del proyecto, añade NEXT_PUBLIC_SITE_URL con tu dirección y ENABLE_EXPERIMENTAL_COREPACK con el valor 1 para que Vercel instale con la versión de Yarn que fija package.json.

  4. Despliega

    Inicia el despliegue y luego añade tu dominio en los ajustes Domains del proyecto.

    Resultado esperado: Tu dominio abre la página de inicio.

Después de cambiar una variable, vuelve a desplegar: el sitio en ejecución conserva los valores con los que se construyó.

Cualquier servidor con Node.js

En un servidor con Node.js 20.9 o posterior, copia la carpeta y luego instala, construye con tu dirección e inicia:

Terminalen Nextjs-landing-page-template-2
corepack enable
yarn install
NEXT_PUBLIC_SITE_URL=https://www.your-domain.com yarn build
yarn start

También puedes poner el valor en un archivo .env.local en la carpeta antes de yarn build. El sitio responde en el puerto 3030. Pon delante un servidor web como Nginx o Caddy para tu dominio y HTTPS, y mantén yarn start en marcha con un gestor de procesos o un servicio del sistema.

Proveedores que eligen el puerto

yarn start siempre escucha en 3030, aunque el proveedor de alojamiento defina una variable PORT. En un proveedor que te asigna un puerto, usa como comando de inicio yarn start -p $PORT.

Una imagen de Docker

El Dockerfile construye una imagen pequeña que sirve el sitio con Node.js en el puerto 3030, con un usuario sin derechos de administrador. Pasa tu dirección al construirla y luego ejecútala en segundo plano para que se reinicie con el servidor:

Terminalen Nextjs-landing-page-template-2
docker build -t analytics-landing --build-arg NEXT_PUBLIC_SITE_URL=https://www.your-domain.com .
docker run -d --restart unless-stopped -p 3030:3030 analytics-landing

Cualquier hosting que ejecute un Dockerfile puede construirlo tal como está. Pon un servidor web delante del puerto 3030 para tu dominio y HTTPS, como con Node.js.

Cuando ya está en internet

  • Abre tu dirección con /en y /ar y comprueba ambos idiomas.
  • Abre /sitemap.xml y /robots.txt. Todas las direcciones deben empezar por tu dominio, no por localhost. Si alguna no lo hace, NEXT_PUBLIC_SITE_URL no estaba definido cuando se construyó el sitio.

¿Te atascaste en un paso?

Busca una solución antes de empezar de nuevo.

Solución de problemas

Preferencias de Cookies

Utilizamos cookies para mejorar tu experiencia de navegación, analizar el tráfico del sitio y personalizar el contenido. Al hacer clic en "Aceptar Todo", consientes nuestro uso de cookies para análisis y publicidad personalizada.