Este es un ejemplo de cómo configurar una aplicación React o un sitio estático con Vite para desplegar en los servicios de alojamiento de Aplicaciones o Sitios Estáticos de Kinsta desde un repositorio de GitHub.
Vite es una herramienta que te ayuda a crear aplicaciones descentralizadas; proporciona herramientas para desarrolladores y APIs para simplificar el proceso de desarrollo y es compatible con múltiples lenguajes de programación. Puedes encontrar más información en el sitio web de Vite.
React es una popular biblioteca JavaScript para construir interfaces de usuario. Permite a los desarrolladores crear componentes de interfaz de usuario reutilizables y actualizar eficazmente la interfaz de usuario en respuesta a los cambios de datos. Puedes encontrar más información en el sitio web de React.
Kinsta instala automáticamente las dependencias definidas en tu archivo package.json durante el proceso de despliegue.
Alojamiento de Sitios Estáticos
- Inicia sesión en GitHub y crea un nuevo repositorio desde esta plantilla (Usar esta plantilla > Crear un nuevo repositorio): Kinsta – Hello World – Vite + React.
- En MyKinsta, añade un sitio estático con el repositorio Hello World – Vite + React y la siguiente Configuración de construcción:
- Comando de construcción:
npm run build - Versión de Node: 18.16.0
- Directorio de publicación: dist
- Comando de construcción:
- El sitio estará disponible tan pronto como finalice la construcción, y la página de Bienvenida de Kinsta se cargará en la URL de tu sitio.
Alojamiento de la Aplicación
- Accede a GitHub y crea un nuevo repositorio a partir de esta plantilla (Utilizar esta plantilla > Crear un nuevo repositorio): Kinsta — Hola Mundo — Vite + React.
- En MyKinsta, añade una aplicación con el repositorio Hola Mundo — Vite + React. El Comando Inicio puede dejarse en blanco para el proceso web, ya que Kinsta detecta automáticamente el comando necesario durante el primer despliegue
- La aplicación estará disponible tan pronto como finalice la construcción y la página de Bienvenida de Kinsta se cargue en la URL de tu aplicación.
Configuración del Servidor Web
Puerto
Kinsta establece automáticamente la variable de entorno PORT. No debes definirla tú mismo, ni tampoco programarla en la aplicación.
Comando de Inicio
Kinsta crea automáticamente un proceso web basado en el comando npm start del archivo package.json al desplegar una aplicación.
Ciclo de Vida del Despliegue
Cada vez que se inicia un despliegue (mediante la creación de una aplicación o el redespliegue debido a un commit entrante), se ejecutan los comandos npm install y npm build.
Página de Bienvenida
La aplicación o sitio está disponible tan pronto como finaliza la construcción, y la página de Bienvenida de Kinsta se carga en la URL de tu aplicación o en la URL de tu sitio estático.
