Desplegar su aplicación

Vamos a usar el servicio Catalyst Pipelines para desplegar y mantener su aplicación tanto en la consola de Catalyst como en su repositorio de GitHub requerido.

Usar el servicio Pipelines nos permite utilizar un paquete dependiente de la plataforma como Sharp. Necesitamos el paquete Sharp para convertir y renderizar las imágenes cargadas como miniaturas en el cliente.

Catalyst se ejecuta en una máquina Linux. Para usar el paquete sharp y alojarlo en Catalyst, podría instalar la biblioteca de paquetes basada en Linux para el paquete sharp y desplegar la aplicación. Alternativamente, podría desplegar fácilmente la aplicación usando el servicio Catalyst Pipelines y todas las dependencias requeridas se manejarán automáticamente. Usar el servicio Pipelines le permite sincronizar de manera fluida los archivos de su aplicación entre su repositorio de GitHub y la consola de Catalyst.

Para desplegar la aplicación usando Pipelines:

1. Haga clic en el ícono de Pipelines presente en la barra lateral de la consola para acceder al servicio Pipelines.
   

2. Haga clic en Create Pipelines.
   

3. Nombre su pipeline como “PhotoStore-pipeline” y seleccione GitHub como la fuente de integración.
   

4. Agregue su cuenta de GitHub desde el menú desplegable. Si no la ha agregado previamente, puede hacer clic en el botón +Add Account y seguir los pasos de inicio de sesión para agregar la cuenta de GitHub al servicio Catalyst Pipelines.
   

5. Seleccione su Organización de GitHub requerida y el repositorio que creó anteriormente para mantener los archivos de la aplicación.
   

6. Ahora será dirigido a la vista de código del archivo catalyst-pipelines.yaml.
   También puede hacer clic en la pestaña Builder para configurar el archivo .yaml usando la interfaz de usuario.
   

7. Copie y pegue el siguiente fragmento para definir la secuencia de etapas y configurar el flujo de su Pipeline.

version: 1
jobs:
  deploy:
    steps:
      - cd photo-store-app
      - npm install
      - npm run build
      - cd ..
      - cd server
      - npm install
      - cd ..
      - cd scripts
      - npm install
      - cd ..
      - node ./scripts/filesHelper.js -c ./server/ ./build/server/
      - node ./scripts/filesHelper.js -c ./photo-store-app/build/ ./build/photo-store-app/
      - npm install -g zcatalyst-cli@beta
      - catalyst deploy
stages:
  - name: build
    jobs:
      - deploy

8. Haga clic en Commit para ejecutar su Pipeline.
   

9. Proporcione un mensaje de commit y haga clic en Commit.
   

Será dirigido a la sección de resumen, donde se mostrará el estado del pipeline junto con otros detalles generales.

Con este paso, el Pipeline ha sido configurado y comenzará automáticamente su ejecución.

Agregar variables globales

Agregaremos dos Variables Globales para este Pipeline.

• CATALYST_TOKEN: Esta variable necesita ser agregada para apuntar su CLI local al Pipeline. Los pasos para generar el token requerido se enumeran a continuación.

• CI: Necesitará establecer el valor como False. Esto asegurará que el Pipeline no falle incluso si hay advertencias en su código.

Generar token de Catalyst

Necesitamos generar un token para permitir que la CLI de Catalyst ejecute comandos de la CLI desde su sistema local al Pipeline.

Para generar un token:

1. Ejecute el siguiente comando en su CLI

2. Navegue a la URL mostrada en su CLI, ingrese el código de verificación generado en la CLI y haga clic en Verify.
   

Una vez que la CLI sea verificada, se generará el token.

Ahora, comencemos a agregar las variables globales requeridas.

Para agregar Variables Globales:

1. Haga clic en Global Variables.
   

2. Ingrese CATALYST_TOKEN como clave y el token generado como valor. Haga clic en el ícono + para agregar el siguiente token.
   

3. Ingrese CI como la clave y False como su valor. Haga clic en Save para agregar las variables.
   

Las variables requeridas han sido agregadas.

Puede verificar el estado del pipeline haciendo clic en el pipeline ejecutado para obtener más detalles.

Haga clic en la pestaña Advanced para obtener más detalles sobre el proceso.

En unos momentos, el pipeline se ejecutará exitosamente.

La aplicación ahora estará sincronizada en GitHub y la consola de Catalyst.

Ahora podrá acceder a la versión desplegada de la aplicación usando la App URL generada en el componente AppSail presente en el servicio Catalyst Serverless.

Puede ejecutar esta URL en el navegador para acceder a la versión desplegada de su aplicación.