Transferencia de Conocimiento del Stack Tecnológico CUIDASOFT

Deploy, Configuración, Mantenimiento e Integración con Superset y JasperReport

Marcelo Denis

Líder de Proyecto

mdenis@codelab.com.py

odelab S.A 

17 de diciembre del 2024

Overview

1. Introducción

2. Arquitectura del Sistema

3. Estructura del Código

4. Proceso de Implementación

6. Mantenimiento

8. Reportes y Dashboard

5. Configuración de Servidores

7. Integración con SuperSet

9. Resumen

1. Introducción

CUIDASOFT

Sistema empleado para el registro y monitoreo de pacientes diagnosticados con cáncer de mama.

Puntos a Detallar

Arquitectura del sistema

​Descripción de la estructura del backend, frontend y la comunicación entre ambos componentes.

Estructura del código

​​Localización de la definición de los componentes y la organización de los proyectos.

Puntos a Detallar

Proceso de despliegue

​Procedimientos detallados para la configuración y despliegue del sistema en un servidor.

Configuración de servidores y mantenimiento

​Requerimientos mínimos, copias de seguridad automáticas y gestión de logs.

Integración con SuperSet y reportes

​Procedimiento para la configuración e integración de dashboards y reportes en el sistema.

2. Arquitectura del Sistema

2. Arquitectura del Sistema

La arquitectura del sistema se basa en el patrón de arquitectura orientada a servicios web, donde se tienen proyectos backend y frontend independientes.

2. Arquitectura del Sistema

  • Frontend: Vue.js, Quasar, HTML5, CSS.
  • Backend: Python (Flask), Swagger.
  • Base de datos: PostgreSQL.

Tecnologías utilizadas

2. Arquitectura del Sistema

  • Docker: Contenedores.
  • Nginx: Servidor web.
  • GIT/GitLab: Control de versiones.
  • Superset: Dashboards.
  • JasperReports: Repotes.

Herramientas

3. Estructura del Código

3. Estructura del Código

Repositorio

​https://gitlab.com/citycancerdigital/backend-service.

Backend

​Carpetas principales:

  • models: Representación de las tablas de la base de datos.
  • resources: Lógica de negocio.
  • swagger: Documentación de la API.
  • dao: Acceso a los datos.
  • database: Scripts SQL iterativos.

Archivos clave:

  • app.py: Arranque principal del backend.
  • requirements.txt: Dependencias del sistema.
  • Dockerfile: Definición para el despliegue y construcción de imágenes.

3. Estructura del Código

Repositorio

https://gitlab.com/citycancerdigital/frontend-service​.

Frontend

​Carpetas principales:

  • src: Código fuente del frontend (Vue.js y Quasar).
  • public: Recursos estáticos (imágenes, íconos)

Archivos clave:

  • quasar.config.js: Configuración del framework.
  • Dockerfile: Despliegue del frontend.
  • index.html: Punto de entrada principal.
  • package.json: Dependencias y scripts del proyecto.

4. Proceso de Implementación

4. Proceso de Implementación

Servidor

El servidor debe tener instalado las siguientes herramientas:

  • Docker
  • Nginx
  • Git

4. Proceso de Implementación

Una vez seleccionado el directorio de trabajo, se debe seguir los siguientes pasos para arrancar el sistema:

1. Generar Nombre de Dominio para el Acceso al Sistema.

EJemplo: https://www.cuidasoft.org

Deploy

4. Proceso de Implementación

2. Generar Imágenes Docker de Backend y Frontend.

1. Backend

 > git clone https://gitlab.com/citycancerdigital/backend-service.git

> pip install - requirements.txt

> docker build -t registry.gitlab.com/citycancerdigital/backend-service:<RELEASE|BRANCH> 

Para la generación de imágenes se debe clonar los repositorios, restaurar las dependencias y generar las imágenes docker.

2. Frontend

 > git clone https://gitlab.com/citycancerdigital/frontend-service.git

> npm install

> docker build -t registry.gitlab.com/citycancerdigital/frontend-service:<RELEASE|BRANCH> 

 

4. Proceso de Implementación

3. Disponibilización de las Imágenes Docker al Servidor

Si no se tiene configurado CI/CD en gitlab, se debe realizar lo siguiente para disponibilizar las imágenes docker al servidor que levantará los servicios de BD, backend y frontend.

GitLab provee un mecanismo para automatizar la creación de las imágenes docker emplenado  su repositorio. Mas detalle de como implementarlo en:

https://docs.gitlab.com/ee/ci/

Tipos de Generación de Imágenes

  1. Interna: La generación de imágenes se realiza en el propio servidor.
  2. Externa: La generación se realiza en un entorno externo al servidor. Es necesario realizar acciones para disponibilizar las imágenes.

4. Proceso de Implementación

Backend

> docker save -o ccan_backend.tar registry.gitl ab.com/citycancerdigital/backend-service:<RELEASE|BRANCH> 

> scp ccan_backend.tar <USER>@<IP_O_DNS_SERVER>:/home/docker_images

> ssh <USER>@<IP_O_DNS_SERVER>

> sudo docker load -i /home/docker_images/ccan_backend.tar

 

Frontend

> docker save -o ccan_backend.tar registry.gitlab. com/citycancerdigital/frontend-service:<RELEASE|BR ANCH>

> scp ccan_frontend.tar <USER>@<IP_O_DNS_SERVER>:/home/docker_images

> ssh <USER>@<IP_O_DNS_SERVER>

> sudo docker load -i /home/docker_images/ccan_frontend.tar

4. Generación Externa de las Imágenes Docker

4. Proceso de Implementación

services:

 db:
   image: postgres:14
   environment:
     #POSTGRES_USER: cuidasoft
     POSTGRES_PASSWORD: cuidasot123
     POSTGRES_DB: cuidasoft
     TZ: America/Bogota
   ports:
     - "5432:5432"
   volumes:
     - ./postgres:/var/lib/postgresql/data
     - ./database/:/docker-entrypoint-initdb.d/:ro
   networks:
     - backend

5. Configurar docker compose

En el fichero docker-compose.yml...

4. Proceso de Implementación

backend:
   image: registry.gitlab.com/citycancerdigital/backend-service:<RELEASE|BRANCH>
   environment:
     DB_USERNAME: 'postgres'
     DB_PASSWORD: 'cuidasoft123'
     DB_HOST: 'db'
     DB_DATABASE: 'cuidasoft'
     DB_SCHEMA: 'public'
     DB_PORT: '5432'
     TZ: America/Bogota

   ports:
     - "5000:5000"
   networks:
     - backend
     - frontend
   depends_on:
     - db
   links:
     - db
   volumes:
     - uploaded_files:/usr/src/app/static/uploaded_files

5. Configurar docker compose

4. Proceso de Implementación

frontend:
   image: registry.gitlab.com/citycancerdigital/frontend-service:<RELEASE|BRANCH>
   environment:
     TZ: America/Bogota
     BACKEND_URL: <NOMBRE_DOMINIO_SERVIDOR>/api
   # Port 9000 mapped to the web server to avoid conflicts with the host's
   ports:
     - "9000:80"
   networks:
     - frontend
   depends_on:
     - backend
   volumes:
     - "./nginx/default.conf:/etc/nginx/conf.d/default.conf:ro"
     - "./bin/40-process-envars.sh:/docker-entrypoint.d/40-process-envars.sh:ro"

 

5. Configurar docker compose

4. Proceso de Implementación

en el fichero ./nginx/default.conf...


server {
    listen       80;
    server_name  localhost;

    client_body_buffer_size 50M;
    client_max_body_size 50M;
    large_client_header_buffers 4 16k;

 

    location / {
        root   /usr/share/nginx/html;
        index  index.html index.htm;
    }

    error_page   500 502 503 504  /50x.html;
    location = /50x.html {
        root   /usr/share/nginx/html;
    }

    location /api {
      proxy_pass http://backend:5000/api;
    }

}

5. Configurar docker compose

4. Proceso de Implementación

en el fichero ./bin/40-process-envars.sh...

 

#!/bin/bash

if [ "$STATIC_BACKEND_URL" != "" ]; then
  sed -i 's|STATIC_BACKEND_URL:"[a-zA-Z0-9\/:-_.&?]\+",|STATIC_BACKEND_URL:"'"$STATIC_BACKEND_URL"'",|g' /usr/share/nginx/html/assets/auth.*.js
fi

if [ "$BACKEND_URL" != "" ]; then
  sed -i 's|BACKEND_URL:"[a-zA-Z0-9\/:-_.&?]\+",|BACKEND_URL:"'"$BACKEND_URL"'",|g' /usr/share/nginx/html/assets/auth.*.js
fi

 

5. Configurar docker compose

4. Proceso de Implementación

networks:
 frontend:
 backend:

volumes:
 uploaded_files:
   driver: local
   driver_opts:
     type: none
     o: bind
     device: /home/cuidasoft/uploaded-deploy/uploaded_file

5. Configurar docker compose

4. Proceso de Implementación

Una vez verificadas las configuraciones deseadas se debe iniciar los contenedores con el siguiente comando:

> docker compose up -d

El servicio podrá ser accedido a través de: http://<IP_SERVIDOR|NOMBRE_DOMINIO>:80

 

Los contenedores se pueden detener con el siguiente comando:

> docker compose down

5. Administración de Contenedores

5. Configuración de Servidores

5. Configuración de Servidores

Test Producción
Memoria 4GB 8GB
CPU Compartido 2 núcleos Dedicado 4 nucleos
Almacenamiento 250GB 1TB
Sistema Operativo Linux compatible con Docker Linux compatible con Docker
Dominios 2 dominios (aplicación y superset) 2 dominios (aplicación y superset)
Certificado SSL 2 2

Especificaciones mínimas

6. Mantenimiento

6. Mantenimiento

Backups

Se recomienda realizar un backup semanal de los datos, esto incluye:

  • Backup de Base de Datos
  • Backup de archivos físicos levantados al sistema.

Se puede implementar mediante un script que se ejecute periódicamente vía crontab.

> sudo su
> crontab -e
> 0 3 * * 5 /home/cuidasoft/cuidasoft-deploy/script_backup_db_files.sh

 

6. Mantenimiento

#!/bin/bash

# Variables del fichero destino
DATE=$(date +%Y%m%d)
BACKUP_PATH="/home/cuidasoft/cuidasoft-deploy/backups/${DATE}/"

# Ejecutar creación del directorio
mkdir $BACKUP_PATH

# Variables para el backup de BD
CONTAINER_NAME="cuidasoft-deploy-db-1"
DB_USER="postgres"
DB_NAME="cuidasoft"
BACKUP_FILE="${BACKUP_PATH}backup_${DB_NAME}_${DATE}.sql"

# Variables para la compresión del directorio
DIRECTORY_PATH="/home/cuidasoft/cuidasoft-deploy/uploaded_files"
DIRECTORY_BACKUP_FILE="${BACKUP_PATH}directory_backup_${DATE}.tar.gz"

# Ejecutar copia de seguridad
docker exec $CONTAINER_NAME pg_dump -U $DB_USER -d $DB_NAME > $BACKUP_FILE

# Verificar el Éxito de la copia de seguridad
if [ $? -eq 0 ]; then
   echo "Copia de seguridad de BD exitosa. Archivo: $BACKUP_FILE"
else
   echo "¡Error! La copia de seguridad de BD ha fallado."
fi

# Comprimir el directorio
tar -czvf $DIRECTORY_BACKUP_FILE $DIRECTORY_PATH

# Verificar el éxito de la compresión del directorio
if [ $? -eq 0 ]; then
   echo "Compresión del directorio exitosa. Archivo: $DIRECTORY_BACKUP_FILE"
else
   echo "¡Error! La compresión del directorio ha fallado."
fi

6. Mantenimiento

Logs

Se pueden visualizar a través de los logs de cada contenedor mediante:

 

Frontend
> docker logs -f <NOMBRE_CONTENEDOR_FRONTEND>

 

Backend
> docker logs -f <NOMBRE_CONTENEDOR_BACKEND>

 

Para el caso del backend, los logs se almacenan en un fichero diario en un directorio llamado “logs” ubicado en la raíz del código fuente del contenedor backend.

7. Integración con SuperSet

7. Integración con SuperSet

Implementación con docker compose

services:
  superset:
    build:
      context: ./superset
      dockerfile: dockerfile
    environment:
      - ADMIN_USERNAME=admin
      - ADMIN_EMAIL=admin@superset.com
      - ADMIN_PASSWORD=admin
    ports:
      - '8088:8088'
    volumes:
      - superset:/app/superset_home

volumes:
  superset:
    external: false

En el fichero docker-compose.yml...

7. Integración con SuperSet

Configuración de SuperSet

En el folder superset se encuentran los siguientes ficheros:

  • dockerfile
  • superset-init.sh
  • superset_config.py

 

7. Integración con SuperSet

Configuración de SuperSet

En el fichero dockerfile...

FROM apache/superset:3.1.0

USER root

ENV ADMIN_USERNAME $ADMIN_USERNAME
ENV ADMIN_EMAIL $ADMIN_EMAIL
ENV ADMIN_PASSWORD $ADMIN_PASSWORD

COPY ./superset-init.sh /superset-init.sh
RUN  chmod +x /superset-init.sh

COPY superset_config.py /app/
ENV SUPERSET_CONFIG_PATH /app/superset_config.py

USER superset

ENTRYPOINT [ "/superset-init.sh" ]

7. Integración con SuperSet

Configuración de SuperSet

En el fichero superset-init.sh...

#!/bin/bash

 

# create Admin user, you can read these values from env or anywhere else possible
superset fab create-admin --username "$ADMIN_USERNAME" --firstname Superset --lastname Admin --email "$ADMIN_EMAIL" --password "$ADMIN_PASSWORD"

 

# Upgrading Superset metastore
superset db upgrade

 

# Load examples
superset load_examples

 

# setup roles and permissions
superset superset init

 

# Starting server
/bin/sh -c /usr/bin/run-server.sh

7. Integración con SuperSet

Configuración de SuperSet

En el fichero superset_config.py...

SESSION_COOKIE_SAMESITE = None
ENABLE_PROXY_FIX = True
PUBLIC_ROLE_LIKE_GAMMA = True
FEATURE_FLAGS = {
    "EMBEDDED_SUPERSET": True,
    "HORIZONTAL_FILTER_BAR": True,
    "SSH_TUNNELING": True,
    "ENABLE_TEMPLATE_PROCESSING": True
}

CORS_OPTIONS = {
  'supports_credentials': True,
  'allow_headers': ['*'],
  'resources':['*'],
  'origins': ['*']
}
SECRET_KEY='q8FfRww3uCBD/XI/qdAw3JwNJfkLsK1CqXTNEJx3fRYj3b+Nz6TfKIJa'
CSRF_ENABLED = False
WTF_CSRF_ENABLED = False
TALISMAN_ENABLED = False
LANGUAGES = {
    "en": {"flag": "us", "name": "English"},
    "es": {"flag": "es", "name": "Spanish"},
}

7. Integración con SuperSet

Integración con CUIDASOFT

# Variables de entorno desde el backend


SUPERSET_URL: https://dashboard.cuidasoft.org
SUPERSET_USERNAME: cuidasoftco
SUPERSET_PASSWORD: cuidasoftco
SUPERSET_DASHBOARD_ID: 01868858-898b-413f-9fc7-cd9f3a59f019

8. Reportes y Dashboard

8. Reportes y Dashboard

Reportes

Los reportes son diseñados en JasperReports.

 

Las fuentes de los reportes se encuentran en el fichero "reports" de las fuentes del backend.

 

Los reportes son generados por el proyecto del backend en tiempo de ejecución.

 

Nuevos reportes deberán ser agregados en esa ubicación.

8. Reportes y Dashboard

Dashboards

Los dashboard deberán ser diseñados en la herramienta de SuperSet.

 

Cada dashboard genera un codigo identificador que deberá ser usado en la aplicación del frontend para integrarlo a CUIDASOFT.

9. Resumen

9. Resumen

Puntos Clave

  • Arquitectura modular y escalable.
  • Estructura del código organizada.
  • Posibilidad de deploy automatizado con Docker y GitLab.
  • Integración de Superset para análisis de datos y dashboards.
  • Integración con JasperReports.

Beneficios

  • Facilidad del despliegue y mantenimiento del sistema con docker.
  • Gestión eficiente de la información y reportes.
Made with Slides.com