Herramientas utilizadas y proceso de implementación¶

A continuación se verán las herramientas utilizadas para la implementación del proyecto, considerando una definición general de la herramienta.

Visual Studio Code

Editor de código fuente desarrollado por Microsoft. Entre las características más importantes, incluye soporte para la depuración, control integrado de Git, gratuito y de código abierto. Este será el editor y depurador principal para el código fuente del proyecto.

Node JS

Para el desarrollo backend del proyecto, se utiliza el entorno de desarrollo Node JS, un framework basado en javascript. Este entorno será el motor principal del backend del proyecto. En específico, los servicios realizados en node, son:

• Consola virtual: Permite la visualización de la consola virtual en el navegador, y mediante el servicio, se realiza una conexión SSH a la máquina virtual correspondiente del repositorio, para ejecutar los comandos correspondientes. Todo esto posible mediante un proyecto de código abierto, llamado “webssh2” [5], para más detalles ver las referencias.

• Gestión de máquinas virtuales: Servicio que se encarga de gestionar y coordinar las máquinas virtuales de los repositorios, mediante el frontend (React) y el motor de modelos en tiempo real (Convergence). Este servicio es una elaboración propia, debido a que no existe un sistema de este tipo en código abierto.

• Gestión de cuentas de usuario y repositorios: Encargado de la gestión de usuarios, mediante la creación y validación de sesiones. Además, se encarga de gestionar los repositorios de los usuarios, en conjunto trabaja con el motor Convergence para la definición de permisos. Creación propia, debido a la particularidad del sistema.
  Gestión de aula virtual: Permite la gestión de aulas virtuales, servicio principal para los usuarios profesores y alumnos.

Las librerías principales utilizadas en Node JS, son las siguientes:

• Express: Proporciona un conjunto sólido de características para la implementación de aplicaciones web.

• JWT: Conocido como JSON Web Token, es un estándar para la creación de tokens de acceso.

• SSH2: Módulo que permite la implementación de cliente y servidor SSH.

• Mysql2: Cliente Mysql que permite la conexión con un servidor de base de datos MySQL.

• WebSocket: Implementación de protocolo WebSocket, tanto cliente como servidor, utilizado para la conexión con Convergence.

• Convergence: Módulo que integra un cliente de Convergence, el cual permite utilizar la API para comunicarse con el servidor Convergence.

Postman

Aplicación que permite realizar pruebas API. Es un cliente HTTP que da la posibilidad de probar solicitudes “HTTP Request”, a través de una interfaz gráfica. Está es utilizada para probar el código en desarrollo del backend.

MySQL Community Server

Sistema administrador de bases de datos (Database Management System, DBMS) para bases de datos relacionales, esta aplicación permite montar un servidor de base de datos MySQL con una licencia gratuita. Es la base de datos utilizada para la implementación del proyecto, en específico, la gestión de usuarios, aulas virtuales y parte de los repositorios (Debido que gran parte de la información se guarda en la base de datos de Convergence).

MySQL Workbench

Herramienta visual de diseño de bases de datos que integra desarrollo de software, administración de bases de datos, diseño de bases de datos, gestión y mantenimiento para el sistema de base de datos MySQL. En el contexto de la implementación, se utiliza para la creación, gestión y realización de pruebas de la base de datos.

Convergence

Motor para el desarrollo rápido de aplicaciones colaborativas de tiempo real. Para ello utiliza un almacén de datos colaborativo en tiempo real, a diferencia de otros frameworks que se detienen al intentar proporcionar datos en tiempo real. Proporciona las funcionalidades que un desarrollador necesita para crear una aplicación colaborativa. Algunas características principales son:

• Datos en tiempo real: Permite a los usuarios editar el mismo dato al mismo tiempo, manteniendo todas las vistas de la información sincronizadas.

• Usuarios e identificación: Permite a los desarrolladores gestionar a los usuarios e identificar mediante el sistema en donde están colaborando y validar permisos correspondientes.

• Presencia: Permite a los usuarios conocer quién está trabajando en el modelo de tiempo real y quién está disponible, para poder trabajar de forma más efectiva con los usuarios colaboradores.

• Conciencia de colaboración (Awareness): La mejor manera de resolver conflictos de edición colaborativa, es evitarlos en primer lugar. Convergence proporciona sólidas capacidades de
  conocimiento de la colaboración que ayudan a los usuarios trabajar juntos sin conflictos.

• Chat y mensajería: Permite a los usuarios comunicarse con un chat embebido directamente en la aplicación.

• Código abierto y gratuito.

Convergence provee todas estas características y más mediante una API, reduciendo el tiempo y complejidad de implementar para diferentes frameworks.

En el proyecto, este será el núcleo principal para el manejo de sesiones colaborativas en el entorno virtual de los usuarios del sistema SEAP-UTA. En específico, se guardarán los datos del repositorio en tiempo real, tanto elementos (carpetas y archivos) y su contenido (archivos o código de programación).

React

Utilizado para el desarrollo del frontend del proyecto. React es una biblioteca Javascript de código abierto diseñada para crear interfaces de usuario con el objetivo de facilitar el desarrollo de aplicaciones en una sola página. Entre sus características principales contiene:

• Componentes: Los componentes permiten separar la interfaz de usuario en piezas independientes, reutilizables y pensar en cada pieza de forma aislada.

• Propiedades: Las propiedades (también conocidas como 'props') pueden definirse como los atributos de configuración para dicho componente. Éstas son recibidas desde un nivel superior, normalmente al realizar la instancia del componente y por definición son inmutables.

• DOM (Document Object Model) virtual: React mantiene un virtual DOM propio, en lugar de confiar solamente en el DOM del navegador. Este comportamiento es clave en React y causante de su alto rendimiento, ya que cuando cambia un dato en la aplicación no necesita actualizar la vista entera.

• Elementos y JSX: React no retorna HTML. El código embebido dentro de Javascript, similar a HTML pero realmente es JSX. Similares a las funciones de Javascript, pero expresadas mediante una sintaxis propia de React llamada JSX. Lo que produce son elementos en memoria y no elementos del DOM tradicional, con lo cual las funciones no ocupan tiempo en producir pesados objetos del navegador sino simplemente elementos de un DOM virtual.

• Isomorfismo: Permite ejecutar el código tanto en el cliente como en el servidor.

En específico, en el proyecto es utilizado para la generación de vistas web del usuario. Cabe destacar que para el desarrollo del editor de código, este está basado en un ejemplo de Convergence llamado “code-editor-demo” [11], el cual en principio da una base para el desarrollo del editor de código del entorno virtual del proyecto.

Nginx

Servidor web/proxy inverso ligero de alto rendimiento y un proxy para protocolos de correo electrónico.​​ Es un software libre y de código abierto, contemplando una versión de pago llamada Nginx Plus. Utilizando la versión gratuita, en el proyecto se implementa como coordinador de los diferentes servicios del proyecto, permitiendo tener un solo dominio.

Docker

Docker es un proyecto de código abierto que automatiza el despliegue de aplicaciones dentro de contenedores de software, proporcionando una capa adicional de abstracción y automatización de virtualización de aplicaciones en múltiples sistemas operativos.

En el proyecto SEAP-UTA, Docker es una pieza fundamental para el despliegue de la aplicación tanto para los servicios y el coordinador. Pero no solo para despliegue, esta herramienta es fundamental para el desarrollo de entornos virtuales, en específico, para la consola virtual. Esto se aborda mediante el uso de contenedores virtuales con una imagen “linuxserver/openssh-server” [14], modificada para el propósito del repositorio en particular, en conjunto al servicio encargado de gestionar estos contenedores y derivar las sesiones a las máquinas respectivas.

El contenedor mencionado anteriormente posee un sistema operativo Linux con la distribución Alpine, el cual puede ser configurado para ejecutar múltiples lenguajes de programación y realizar diversas funciones para el desarrollo de software.

GIT

Git es un sistema de control de versiones distribuido, rápido y escalable, el cual funciona con un conjunto de comandos que proporciona operaciones de alto y completo acceso a los componentes internos de un proyecto.

Su propósito es llevar un registro de los cambios que se realicen en el proyecto, incluyendo la coordinación de trabajo que está ofrece para que varios personas sobre un mismo proyecto puedan trabajar sobre un repositorio.

Github

GitHub es una plataforma para alojar el código de las aplicaciones y herramientas de cualquier desarrollador, y como usuario, puedes conocer a los desarrolladores y colaborar en sus proyectos. Esta trabaja en conjunto a GIT.

Esta herramienta será utilizada para general el control de versiones del proyecto, de forma que el cliente pueda monitorizar el estado actual del proyecto.

Con respecto al proceso de implementación

Utilizando las herramientas mencionadas, se implementaron los siguientes servicios:

!!

Referencias

[1] Software Modeling & Design. 2011. Hassan Gomaa.

[2] Pattern-Oriented Software Architecture Vol. 4. 2007. Frank Buschmann.

[3] Apuntes del curso de aplicaciones distribuidas avanzadas - 2021. Diego Aracena.

[4] Visual Studio Code. 2021. Microsoft.
Enlace: https://code.visualstudio.com

[5] Proyecto en Github - “billchurch/webssh2”. 2021. Bill Church.
Enlace: https://github.com/billchurch/webssh2

[6] Productos de MySQL. Oracle. 2021.
Enlace: https://www.mysql.com

[7] Node JS. Open JS Foundation. 2021.
Enlace: https://nodejs.org/es/

[8] Express para NodeJS. Open JS Foundation. 2021.
Enlace: https://expressjs.com/es/

[9] Documentación de Convergence. Convergence Labs. 2021.
Enlace: https://convergence.io/documentation/

[10] React. Facebook Open Source. 2021.
Enlace: https://es.reactjs.org

[11] Proyecto en Github - “convergencelabs/code-editor-demo”. 2021.
Enlace: https://github.com/convergencelabs/code-editor-demo

[12] Nginx. F5 Company. 2021.
Enlace: https://www.nginx.com

[13] Docker Engine. Docker. 2021.
Enlace: https://www.docker.com

[14] Documentación de contenedor “linuxserver/openssh-server”. linuxserver.io Community. 2021
Enlace: https://docs.linuxserver.io