Cómo desplegar una app Codex

Cómo desplegar una app Codex

Puedes desplegar una app creada con Codex de varias formas, por ejemplo con herramientas de CLI y plataformas basadas en contenedores, canalizaciones de CI/CD o despliegues basados en Git, según la plataforma de hosting que elijas.

Con Hostinger, puedes desplegar una aplicación Codex basada en Node.js importando un repositorio de GitHub o subiendo un archivo ZIP mediante el flujo de configuración de aplicaciones web de Node.js en hPanel. Hostinger se encarga automáticamente de detectar el framework, del proceso de compilación y del despliegue, así que no necesitas configurar el servidor manualmente.

Así puedes desplegar una app creada con Codex en Hostinger:

  1. Prepara tu proyecto de Codex para su despliegue. Exporta tu proyecto desde Codex a través de GitHub o como archivo ZIP y asegúrate de que incluya un archivo package.json antes de desplegarlo.
  2. Despliega tu app. Después de contratar un plan de hosting para Node.js, conecta un repositorio de GitHub para automatizar los nuevos despliegues o sube un archivo ZIP para una configuración única más rápida.
  3. Añade variables de entorno. Si tu aplicación depende de claves de API, URL de bases de datos o secretos de autenticación, puedes añadirlos como variables de entorno en hPanel en lugar de dejarlos codificados directamente en tu proyecto.
  4. Prueba la versión online de tu aplicación Codex. Abre la URL online y comprueba que tu app se carga correctamente y que las funciones principales funcionan como esperas.
  5. Gestiona la aplicación que has desplegado. Supervisa el uso de recursos, actualiza las variables de entorno, corrige vulnerabilidades y vuelve a desplegar nuevas versiones a medida que tu aplicación evoluciona.
  6. Supervisa las vulnerabilidades y actualiza las dependencias. Hostinger analiza automáticamente tu app desplegada para detectar paquetes npm vulnerables. En las aplicaciones conectadas a GitHub, puedes usar la función de corrección automática para solucionar vulnerabilidades sin revisar manualmente cada dependencia.

Una vez que tu proyecto se haya desplegado, conviene revisar la base de código con regularidad, ya que Codex es un agente de IA que puede generar y modificar código rápidamente. Revisar lo que genera antes de cada despliegue te ayuda a detectar errores o cambios no deseados antes de que lleguen a tu público.

1. Prepara tu aplicación creada con Codex para el despliegue

Si conectaste un repositorio de GitHub durante tu sesión de compilación, Codex puede subir tu código directamente a él. También puedes descargar los archivos del proyecto desde Codex y empaquetarlos en un archivo ZIP si prefieres no conectarte a un repositorio.

En cualquier caso, asegúrate de que el proyecto exportado incluya un archivo package.json antes de desplegarlo. Hostinger usa este archivo para detectar tu framework, identificar las dependencias y determinar el proceso de compilación correcto.

Sin esto, la detección automática del framework puede fallar y puede que tengas que especificar manualmente valores como el directorio de salida, el comando de compilación o el punto de entrada de la aplicación. Puedes encontrar estos valores en tu archivo package.json o en los archivos de configuración del framework.

Hostinger es compatible con varios frameworks de Node.js: Angular, Astro, Next.js, Nuxt, Parcel, React, React Router, Svelte, SvelteKit, Vite, Vue.js, Express, Fastify y Hono. Las versiones compatibles de Node.js son 18.x, 20.x, 22.x y 24.x.

Verificar la compatibilidad de antemano puede ayudarte a evitar problemas cuando despliegues una aplicación de Node.js.

Además, reúne todas las variables de entorno necesarias, las claves de API, las credenciales de la base de datos y cualquier otro valor de configuración que necesites antes de empezar.

2. Publica tu aplicación creada con Codex

Para empezar, necesitarás hosting para aplicaciones web de Node.js. Si ya tienes un plan de hosting Business o Cloud de Hostinger, solo tienes que iniciar sesión en hPanel. Luego, ve a Páginas webAñadir página webAplicación web Node.js.

También puedes visitar nuestra página de hosting para la app Codex para comprar un plan si es la primera vez que alojas una aplicación web con Hostinger.

Cuando estés en el proceso de hosting de aplicaciones Node.js, se te pedirá que elijas un nombre de dominio para conectarlo con tu proyecto o que uses un nombre de dominio temporal aleatorio.

Después, elige el método que prefieras para desplegar una aplicación de Codex:

  • Repositorio de GitHub. Conecta tu repositorio directamente a Hostinger. Después de la configuración inicial, al enviar cambios a la rama conectada se activa automáticamente un nuevo despliegue. Ideal para proyectos que seguirás actualizando.
  • Carga de archivos ZIP. Sube los archivos de tu proyecto de Codex como un archivo comprimido. No necesitas conectar GitHub. Ideal para prototipos o implementaciones puntuales.

Elijas el método que elijas, Hostinger leerá tu archivo package.json y detectará automáticamente tu framework y la configuración de compilación. Para la mayoría de los proyectos, la configuración sugerida funciona tal como está, así que solo tienes que hacer clic en Desplegar.

Si no se detecta tu framework y se clasifica como “Otro“, tendrás que introducir manualmente el directorio de salida y el archivo de entrada antes de hacer el despliegue.

Para ver el proceso completo paso a paso, consulta nuestra guía sobre cómo desplegar apps creadas con Codex en Hostinger.

3. Añade variables de entorno

Muchas apps creadas con Codex dependen de variables de entorno para funcionar, sobre todo las que se conectan a bases de datos externas, gestionan la autenticación de usuarios, procesan pagos o llaman a API de terceros.

Si tu aplicación hace cualquiera de estas cosas, esperará que valores como claves de API, URL de bases de datos o secretos de autenticación estén disponibles en tiempo de ejecución.

Puedes añadir estos valores desde hPanel en lugar de codificarlos directamente en tu proyecto. Esto mantiene los datos sensibles fuera de tu base de código y facilita actualizar los valores sin volver a desplegar.

Comprueba en el código generado por Codex los nombres de las variables que espera tu app. En las aplicaciones de Next.js, algunos ejemplos habituales son DATABASE_URL, API_KEY y NEXT_PUBLIC_*.

Añade cualquier variable que necesites desde la sección de variables de entorno del menú lateral izquierdo de tu panel de Node.js y haz clic en Añadir variable de entorno. A partir de ahí, se te pedirá que añadas la clave y el valor.

En concreto, para las conexiones de bases de datos, el panel de Node.js de Hostinger incluye un asistente de conexión integrado para Supabase y MongoDB Atlas. Abre tu panel de Node.js, busca el menú Base de datos, haz clic en Conectar y elige el proveedor de base de datos que quieras.

Luego, sigue las instrucciones en pantalla para introducir los datos de tu conexión. Hostinger los guarda automáticamente como variables de entorno y vuelve a compilar tu proyecto para que la configuración actualizada se aplique de inmediato.

4. Prueba la app creada con Codex

Cuando termine el despliegue y las variables de entorno estén conectadas, accede a la URL en vivo de tu aplicación y comprueba que todo funcione como esperas.

Empieza por comprobar si la app se carga correctamente y si se puede acceder a todas las páginas. Después, prueba la funcionalidad principal de tu aplicación, incluidos los formularios, los botones, los flujos de autenticación, las integraciones de API, las funciones basadas en bases de datos y otras interacciones críticas de los usuarios.

Si tu app usa variables de entorno o servicios externos, confirma que esas conexiones también funcionen correctamente. Si surge algún problema, revisa los registros de despliegue en hPanel para obtener más información. Revísalos para identificar el mensaje de error concreto, actualiza la configuración de tu proyecto o de compilación según sea necesario y vuelve a desplegar la aplicación.

Sigue haciendo pruebas después de cada despliegue para confirmar que el problema se ha resuelto.

5. Gestiona tu aplicación creada con Codex

Después del despliegue, puedes gestionar tu aplicación de Codex desde el panel de control de Node.js en hPanel. Este panel te ofrece un lugar central desde el que puedes supervisar tu app, actualizar su configuración, solucionar problemas y volver a desplegarla cuando haga falta.

Desde el panel de control, puedes acceder a:

  • Enlace rápido al repositorio de GitHub. Si hiciste el despliegue a través de GitHub, verás un enlace directo al repositorio que conectaste.
  • Estado del último despliegue. Comprueba si el despliegue más reciente se completó correctamente o falló, junto con la marca de tiempo y acceso a los registros del despliegue.
  • Registros de despliegue. Revisa el resultado detallado de la compilación y el despliegue para solucionar problemas.
  • Variables de entorno. Añade, edita o elimina las variables de entorno que usa tu aplicación.
  • Configuración y redespliegue. Actualiza la configuración de compilación y vuelve a desplegar la aplicación después de hacer los cambios.
  • Administrador de archivos. Explora y gestiona los archivos desplegados directamente desde hPanel.
  • Gráficos de uso de recursos. Supervisa el consumo de CPU, RAM y E/S.

También habrá una opción de reinicio para las aplicaciones del lado del servidor que ejecutan un proceso persistente, como las apps de Express.js, Next.js y NestJS.

Es buena idea controlar el uso de recursos a medida que tu aplicación crece. Si aumenta el tráfico o tu aplicación empieza a gestionar cargas de trabajo más intensivas, revisa con regularidad los gráficos de CPU, RAM y E/S en el panel de control.

Cuando el uso se acerque a los límites de tu plan de hosting, plantéate optimizar tu aplicación o ampliar tus recursos de hosting para mantener un rendimiento fiable.

6. Supervisa las vulnerabilidades y actualiza las dependencias

Desplegar tu app es solo el comienzo. Como las aplicaciones creadas con Codex suelen depender de paquetes de npm, es importante supervisar las vulnerabilidades y mantener las dependencias actualizadas con regularidad.

Hostinger analiza las aplicaciones de Codex desplegadas para detectar vulnerabilidades conocidas de npm y genera informes que muestran los nombres de los paquetes afectados, los niveles de gravedad y las versiones corregidas disponibles.

Puedes acceder a estos informes si vas a SeguridadVulnerabilidades en tu panel de control de Node.js.

Cuando se detecte una vulnerabilidad, actualiza la dependencia afectada a la versión recomendada y vuelve a desplegar la app. Actualizar las dependencias con regularidad te ayuda a reducir los riesgos de seguridad, mejorar la estabilidad y mantener tu aplicación funcionando sin problemas.

Si no hay ninguna corrección automatizada disponible para una vulnerabilidad concreta, tendrás que actualizar manualmente el paquete afectado y volver a desplegarlo.

Para las aplicaciones desplegadas a través de GitHub, en Hostinger también ofrecemos una función de corrección automática que simplifica el proceso de actualización. En lugar de actualizar los paquetes manualmente, puedes generar un pull request de GitHub con las correcciones recomendadas directamente desde hPanel.

Una vez que se cree el pull request, podrás revisar los cambios propuestos, fusionarlos si estás conforme y activar automáticamente un nuevo despliegue.

Ten en cuenta que la corrección automática solo está disponible para las aplicaciones de Codex desplegadas a través de GitHub. Esta función también requiere que la aplicación de GitHub de Hostinger tenga acceso de escritura a tu repositorio.

Si no te han concedido los permisos necesarios, verás un error al intentar crear una solicitud de extracción. En ese caso, GitHub enviará un email en nombre de Hostinger para pedirte que apruebes la actualización de permisos.

Hostinger nunca fusiona cambios ni envía actualizaciones directamente a tus ramas. Cada corrección se envía como una solicitud de incorporación de cambios para que tú la revises y apruebes.

El proceso de corrección automática se limita a las actualizaciones de dependencias y no da acceso a los secretos de tu repositorio ni a tus variables de entorno, para que sigas teniendo el control de tu código y tu configuración.

Problemas comunes al desplegar una app creada con Codex

Si la aplicación que has creado con Codex no se despliega o no funciona correctamente, el problema suele estar relacionado con la configuración del proyecto, los ajustes de compilación, las dependencias o la falta de variables de entorno.

La tabla de abajo recoge los problemas más comunes al implementar Codex con Hostinger y cómo resolverlos:

Posible problema

Solución

Falta el archivo package.json

Asegúrate de que package.json esté en la raíz de tu proyecto antes de subirlo o enviarlo a GitHub

La aplicación se compila correctamente, pero no sirve los archivos esperados debido a un directorio de salida incorrecto

Revisa el archivo de configuración de tu framework o package.json para encontrar la ruta de salida correcta y actualízala en la configuración de compilación

Faltan variables de entorno, lo que hace que la aplicación cargue, pero las funciones que dependen de API o bases de datos fallen

Asegúrate de que hayas añadido todas las variables de entorno necesarias y luego vuelve a desplegar.

Archivo de entrada incorrecto, por lo que es posible que las aplicaciones del lado del servidor no se inicien después del despliegue

Confirma el archivo de entrada correcto en tu package.json y actualízalo en la configuración de compilación

Las dependencias no se instalan ni se compilan por una versión de Node.js incompatible o que no coincide con la requerida

Selecciona una versión compatible de Node.js en la configuración de compilación que se ajuste a los requisitos de tu proyecto

Archivo ZIP demasiado grande o incompleto

Asegúrate de que el archivo ZIP contenga la estructura completa del proyecto o excluye node_modules para mantener un tamaño de archivo manejable

Error 403 tras volver a desplegar

Un error 403 después de volver a desplegar puede producirse por un problema de caché. Volver a desplegar la aplicación lo soluciona.

Despliegue con GitHub o carga mediante ZIP: ¿qué método te conviene elegir?

Ambos métodos ponen online tu app creada con Codex. La elección adecuada depende de cómo planees gestionar y actualizar la app.

El despliegue con GitHub es la mejor opción para cualquier proyecto que planees ir mejorando. Subir un archivo ZIP es una opción totalmente válida para casos de uso más sencillos, ya que se configura más rápido y no requiere una cuenta de GitHub.

La tabla de abajo muestra con más detalle en qué se diferencia el despliegue con GitHub de subir un archivo ZIP:

Función

Despliegue en GitHub

Subida de archivos ZIP

Facilidad para actualizarla

El redespliegue y las actualizaciones pueden iniciarse automáticamente

Sube un nuevo archivo ZIP cada vez que hagas cambios en la aplicación

Redespliegue automático

Sí, cuando haces push en la rama conectada

No, es necesario volver a desplegarlo manualmente

Compatibilidad con repositorios privados

No aplica

Corrección automática de vulnerabilidades

No aplica: no hay conexión con el repositorio

Caso de uso ideal

Proyectos en curso, aplicaciones que se actualizarán con regularidad o flujos de trabajo de Codex que suben código a GitHub

Prototipos rápidos, implementaciones puntuales o proyectos en los que no hace falta integrar GitHub

¿Qué puedes hacer después de desplegar una app creada con Codex?

Desplegar tu aplicación creada con Codex es el momento en que el código generado por IA se convierte en un producto real con una URL activa. Puedes compartir la app con usuarios reales y empezar a recopilar feedback en un entorno real y en funcionamiento.

Si tu app está conectada a GitHub, puedes seguir mejorándola directamente en Codex. Puede encargarse de varias tareas de mejora en paralelo, confirmar cambios y abrir pull requests para que las revises.

Con Hostinger, al fusionar una PR se activa automáticamente un nuevo despliegue, así tu ciclo de desarrollo y lanzamiento se mantiene ágil. También puedes conectar bases de datos externas y API, supervisar el uso de recursos y solucionar vulnerabilidades en las dependencias con las herramientas de análisis integradas en hPanel.

El código generado por Codex es un buen punto de partida, pero revisa siempre tu código antes de pasarlo a producción. Usa el entorno en vivo para hacer pruebas exhaustivas y trata cada despliegue como parte de un ciclo de desarrollo continuo, no como una entrega puntual.

Todo el contenido de los tutoriales en este sitio web está sujeto a los rigurosos estándares y valores editoriales de Hostinger.

Author
El autor

Rafael L.

Rafael es un especialista en localización de software y marketing con más de 10 años de experiencia. Forma parte del equipo de localización de Hostinger. En su tiempo libre, le gusta disfrutar de la música, los videojuegos y estar al tanto de las últimas tendencias tecnológicas.

Lo que dicen nuestros clientes

Comentarios

0 responses

Write a respond

Llena los campos obligatorios, por favor.Acepta la casilla de verificación Privacidad, por favor.Por favor, llena los campos requeridos y acepta la casilla de verificación de privacidad.

Thank you! Your comment has been successfully submitted. It will be approved within the next 24 hours.