Plataforma e-Learning con metodología DevOps (Hypotesis)

Plataforma e-Learning con metodologiacutea DevOps

(Hypotesis)

Autor Antonio Manzano Diacuteaz

Tutor Jordi Ustrell Garrigos

Profesor Joan Soler Adillon

Grado Multimedia

Ingenieriacutea Web

8 de junio de 2020

Plataforma e-Learning con metodologiacutea DevOps (Hypotesis)

2

Licencia

Este documento estaacute sujeto a una licencia de Reconocimiento - No Comercial ndash Sin Obra Derivada 30 Espantildea de CreativeCommons

El proyecto Hypotesis Open alojado en GitHub estaacute sujeto a una licencia GNU GPLv3 httpswwwgnuorglicensesgpl-30html


3

FICHA DEL TRABAJO FINAL Tiacutetulo del trabajo Plataforma e-Learning con metodologiacutea DevOps

Nombre del autor Antonio Manzano Diacuteaz

Nombre del colaboradora docente Jordi Ustrell Garrigos

Nombre del PRA Joan Soler Adillon

Fecha de entrega 062020

Titulacioacuten o programa Grado Universitario Multimedia

Aacuterea del Trabajo Final 76570 - TFG-Ingenieriacutea Web

Idioma del trabajo Espantildeol

Palabras clave LMS DevOps Microservicios Docker Django Vue

Resumen del Trabajo

Las herramientas digitales continuacutean ganando peso en la comunidad educativa ofreciendo nuevas oportunidades y experiencias para las organizaciones y usuarios En el futuro no se entenderaacute la educacioacuten la formacioacuten o el aprendizaje profesional sin la utilizacioacuten de las nuevas tecnologiacuteas de forma presencial o a distancia Los LMS llevan maacutes de 20 antildeos ofreciendo soluciones pero su poca flexibilidad y adaptacioacuten al medio hacen que muchas organizaciones no vean su uso como una oportunidad sino como un problema dada su compleja instalacioacuten personalizacioacuten o su costoso mantenimiento Este TFG propone una solucioacuten basada en los principios del coacutedigo abierto para lo que se ha creado la comunidad de desarrolladores Hypotesis Open que se encargaraacute del mantenimiento evolutivos y de la correcta aplicacioacuten de las normas en las que se rige Aunque el principal objetivo es facilitar una red de distribuidores especializados en la educacioacuten digital que suministren ese servicio bajo demanda y de forma personalizada a instituciones educativas o empresas El proyecto ofrece un servicio que minimiza los costes evolutivos y de mantenimiento mediante una infraestructura automatizada y modular basada en microservicios que permiten un alto nivel de concurrencia y disponibilidad Bajo una arquitectura de tenencia muacuteltiple y de integracioacuten continua todas las aplicaciones podraacuten ser ejecutados mediante despliegues automatizados La plataforma dispone de interfaz de aplicaciones (API REST) para consumirse en herramientas externas y facilitar la adaptacioacuten de sus funcionalidades a otros aplicativos Ademaacutes este sistema de microservicios tiene como objetivo aprovecharse de las nuevas utilidades que va incorporando el mercado como Google Classroom o Amazon Web Services e integrarse en la plataforma seguacuten las necesidades de los clientes


4

Abstract

Digital tools continue to gain weight in the educational community and enable new opportunities and experiences for organizations and users In a few years education training or professional learning is not understood without the use of new technologies in person or at a distance Learning Managers Systems (LMS) have had solutions for more than 20 years but their low flexibility and adaptation to the environment mean that many organizations cannot use their use as an opportunity but as a problem given their complex installation customization or costly maintenance This final degree project proposes a solution based on the principles of open source which is why the Hypotesis Open developer community has been created which will oversee the maintenance evolutionary and correct application of the rules in which it governs Although the main objective is to provide a network of distributors specialized in digital education that provides this service on demand and in a personalized way to educational institutions or companies The project is planning to offer a service that minimizes evolutionary and maintenance costs through an automated and modular infrastructure based on microservices that allows a high level of concurrency and availability Under a multi-tenant (multi-tenant) and continuous integration architecture all applications can be run using automated deployments The platform has an API REST that can be consumed by external tools that facilitate the adaptation of its functionalities to other applications In addition this microservices system aims to take advantage of the new utilities that the market will be incorporating such as Google Classroom or Amazon Web Services and to be integrated into the platform according to the needs of the clients


5

Cita

ldquoQue no te digan que el cielo es el liacutemite cuando hay huellas en la lunardquo

Agradecimientos

Este Trabajo Final de Grado es el ceacutenit a un gran esfuerzo realizado durante cinco antildeos para conseguir

la obtencioacuten del Grado Multimedia en la Universitat Oberta de Catalunya Han sido meses muy duros

que he tenido que compatibilizar con el trabajo la vida personal y familiar

Dada las circunstancias de este cuatrimestre debido a la pandemia por la enfermedad Covid-19 tuve

que tomar la decisioacuten de cambiar de proyecto y de objetivos durante el curso y quiero agradecer en

este caso a la ayuda del tutor por acompantildearme y guiarme en esta decisioacuten

Esto no hubiera sido posible sin la estimable colaboracioacuten y ayuda de mi mujer Laura y de forma

indirecta de mis hijos Marcos y Sergio Han sido muchos fines de semana complicados y demasiado

tiempo libre utilizado en la realizacioacuten de praacutecticas y superacioacuten de las distintas asignaturas

Tambieacuten quiero agradecer enormemente a mis padres Antonio y Blanca por la educacioacuten que me han

transmitido y por haberme inculcado la cultura del esfuerzo y la autoestima necesaria para lograr los

objetivos

En este Trabajo Final de Grado he podido implementar todo lo aprendido en el trascurso de mi vida

laboral y por ello agradezco de forma colectiva a todos los compantildeeros y responsables que han influido

en mi mejora profesional

Por uacuteltimo no quiero olvidarme de todos los profesores tutores o compantildeeros del Grado Multimedia

que me han ayudado en alcanzar las competencias y conocimientos suficientes para realizar este

proyecto


6

Resumen Las herramientas digitales continuacutean ganando peso en la comunidad educativa y posibilitan nuevas oportunidades y experiencias para las organizaciones y usuarios Dentro de unos antildeos no se

entenderaacute la educacioacuten la formacioacuten o el aprendizaje profesional sin la utilizacioacuten de las nuevas

tecnologiacuteas de forma presencial o a distancia

Los gestores de aprendizaje (LMS) llevan maacutes de 20 antildeos ofreciendo soluciones pero su poca

flexibilidad y adaptacioacuten al medio hacen que muchas organizaciones no vean su uso como una

oportunidad sino como un problema dada su compleja instalacioacuten personalizacioacuten o su costoso mantenimiento

Este trabajo final de grado propone una solucioacuten basada en los principios del coacutedigo abierto para

lo que se ha creado la comunidad de desarrolladores Hypotesis Open que se encargaraacute del

mantenimiento evolutivos y de la correcta aplicacioacuten de las normas en las que se rige Aunque el

principal objetivo es facilitar una red de distribuidores especializados en la educacioacuten digital que

suministren ese servicio bajo demanda y de forma personalizada a instituciones educativas o

empresas

El proyecto ofrece un servicio que minimiza los costes evolutivos y de mantenimiento mediante

una infraestructura automatizada y modular basada en microservicios en la que se permita un alto

nivel de concurrencia y disponibilidad Bajo una arquitectura de tenencia muacuteltiple (multi-tenant) y de

integracioacuten continua todas las aplicaciones podraacuten ser ejecutados mediante despliegues automatizados

La plataforma dispone de interfaz de aplicaciones (API REST) para consumirse en herramientas

externas y facilitar la adaptacioacuten de sus funcionalidades a otros aplicativos Ademaacutes este sistema de

microservicios tiene como objetivo aprovecharse de las nuevas utilidades que va incorporando el

mercado como Google Classroom o Amazon Web Services e integrarse en la plataforma seguacuten las

necesidades de los clientes

Palabras clave LMS Moodle Docker Django VueJs API Rest Microservicios SaaS software como servicio alta

concurrencia alta disponibilidad eLearning sistema educativo open source coacutedigo libre tenencia

muacuteltiple multi-tenant


7

Abstract

Digital tools continue to gain weight in the educational community and enable new opportunities and

experiences for organizations and users In a few years education training or professional learning is

not understood without the use of new technologies in person or at a distance

Learning Managers Systems (LMS) have had solutions for more than 20 years but their low flexibility

and adaptation to the environment mean that many organizations cannot use their use as an opportunity

but as a problem given their complex installation customization or costly maintenance

This final degree project proposes a solution based on the principles of open source which is why the

Hypotesis Open developer community has been created which will oversee the maintenance

evolutionary and correct application of the rules in which it governs Although the main objective is to

provide a network of distributors specialized in digital education that provides this service on demand

and in a personalized way to educational institutions or companies

The project is planning to offer a service that minimizes evolutionary and maintenance costs through

an automated and modular infrastructure based on microservices that allows a high level of concurrency

and availability Under a multi-tenant and continuous integration architecture all applications can be

run using automated deployments

The platform has an API REST that can be consumed by external tools that facilitate the adaptation of

its functionalities to other applications In addition this microservices system aims to take advantage of

the new utilities that the market will be incorporating such as Google Classroom or Amazon Web

Services and to be integrated into the platform according to the needs of the clients

Keywords LMS Moodle Docker Django VueJs API Rest Microservices SaaS software as a service high

concurrency high availability eLearning education system open source multi-tenant


8

Iacutendice

1 Introduccioacuten 14

11 Proacutelogo 14

12 Definicioacuten 16

13 Objetivos generales 18

131 Objetivos principales 18

132 Objetivos secundarios 20

14 Metodologiacutea y proceso de trabajo 21

15 Planificacioacuten 23

151 Fechas destacadas del proyecto 24

16 Presupuesto 26

161 Comunidad desarrolladores (Hypotesis Open) 26

162 Partner o distribuidor (Hypotesis Pro) 27

163 Escuela (Hypotesis School) 27

2 Anaacutelisis de mercado 28

21 Puacuteblico objetivo 28

22 Competencia 30

221 LMS coacutedigo libre 30

222 LMS integrados en CMS de coacutedigo libre 35

223 LMS coacutedigo libre con plataforma SaaS 37

224 LMS corporativos de coacutedigo privativo 38

23 Anaacutelisis DAFO 41

231 Aportacioacuten respecto a los LMS de coacutedigo libre 41

232 Aportacioacuten respecto a Canvas 41

233 Aportacioacuten respecto a LMS privativas 42

3 Propuesta 43

31 Hypotesis Open 43

32 Hypotesis Manager 44

33 Hypotesis Pro 45

34 Hypotesis School 46


9

341 Hypotesis Code 47

35 Modelo de negocio 48

351 Comunidad Open Source (Hypotesis Open) 48

352 Empresas u organismos del sector educativo (Hypotesis Manager) 48

353 Universidades colegios institutos escuelas o departamentos de recursos

humanos (Hypotesis Pro amp Hypotesis School) 49

354 Escuela de Programacioacuten (Hypotesis Code) 49

36 Estrategia de marketing 51

361 Hypotesis Open para desarrolladores 51

362 Hypotesis Manager para empresas u organismos 51

363 Hypotesis School para instituciones educativas 52

364 Hypotesis Code para desarrolladores 53

4 Disentildeo 54

41 Arquitectura general de la plataforma 54

42 Despliegue de contenedores 55

421 Archivo docker-composeyml 56

422 Archivo de variables globales 56

423 Hypotesis VPN 57

424 Imagen Hypotesis Django 58

425 Servicio Hypotesis Manager 60

426 Otros servicios Django 63

427 Hypotesis DB 65

428 Imaacutegenes Hypotesis Vue 67

429 Hypotesis Pro 68


43 Hypotesis API 71

431 Configuracioacuten CORS para la comunicacioacuten Django y Vue 73

44 Arquitectura de la informacioacuten y diagramas de navegacioacuten 74

441 Aacuterbol de contenidos de Hypotesis School 74

45 Disentildeo graacutefico e interfaces 75

451 Logotipo Hypotesis 75

452 Tipografiacuteas utilizadas 76

453 Eslogan 77


10

454 Colores 77

455 Logotipos submarcas 77

456 Manual corporativo digital 79

46 Disentildeo de interfaces 84

461 Prototipo Hi-Fi Hypotesis PRO 84

462 Prototipo Hi-Fi Hypotesis School vista profesor 91

463 Prototipo Hi-Fi Hypotesis School vista estudiante 99

5 Implementacioacuten 104

51 Entorno de desarrollo integrado (IDE) 104

52 Control de versiones 104

53 Docker Compose 105

54 Requisitos e instrucciones de instalacioacuten 106

541 Entorno local de desarrollo 106

542 Entornos remotos de desarrollo y produccioacuten 107

543 Despliegue en Integracioacuten Continua 107

6 Demostracioacuten 108

61 Prototipo interactivo Adobe XD 108

611 Prototipo entorno Local 109

7 Conclusiones y liacuteneas de futuro 111

71 Conclusiones 111

72 Liacuteneas de futuro 111

721 Listado de mejoras a implementar en el futuro 112

Bibliografiacutea 114

Recursos 117

Anexos 118


11

Figuras y tablas

Iacutendice de figuras Figura 1 Logotipo de Google Classroom 15 Figura 2 Logotipo de AWS 16 Figura 3 Diagrama de la aplicacioacuten 17 Figura 4 Pizarra Canvas del proyecto Hypotesis con Atlassian Jira 21 Figura 5 Repositorio GitHub del proyecto Hypotesis 21 Figura 7 Tablero o Pizarra Canvas de Atlassian Jira del proyecto Hypotesis 23 Figura 8 Diagrama de Gantt en Atlassian Jira de Hypotesis 25 Figura 9 Diagrama de puacuteblico objetivo del proyecto 29 Figura 10 Pantalla de un curso en Moodle 3 30 Figura 11 Pantalla principal de Sakai LMS 31 Figura 12 Paacutegina principal de Claroline LMS 32 Figura 13 Paacutegina principal de Dokeos LMS 33 Figura 14 Paacutegina principal en Chamilo LMS 34 Figura 15 Paacutegina principal en Learn Dash de Wordpress 35 Figura 16 Paacutegina principal en Opigno de Drupal 36 Figura 17 Paacutegina principal en Canvas LMS 37 Figura 18 Paacutegina principal en Blackboard Learn 38 Figura 19 Paacutegina principal en Cornerston Learning 39 Figura 20 Paacutegina principal en Schoology 40 Figura 21 Proyecto Hypotesis Open en GitHub 43 Figura 22 Diagrama Hypotesis Pro 48 Figura 23 Diagrama modelo de negocio 50 Figura 25 Aacuterbol de contenidos de Hypotesis School 74 Figura 26 Logotipo Hypotesis modo normal e inverso con eslogan 75 Figura 27 Origen del logotipo Hypotesis (Imaacutegenes httpspixabaycom ) 76 Figura 28 Logotipo Hypotesis Open 77 Figura 29 Logotipo Hypotesis Manager 78 Figura 30 Logotipo Hypotesis Pro 78 Figura 31 Logotipo Hypotesis School 78 Figura 32 Logotipo Hypotesis Code 78 Figura 33 Pantallazo de la aplicacioacuten Adobe XD en su modo Prototipo 108 Figura 34 Pantallazo de la aplicacioacuten Adobe XD con los flujos de las pantallas 108 Figura 35 Ejecucioacuten de Docker Compose 109 Figura 36 Visualizacioacuten de las imaacutegenes creadas 109 Figura 37 Visualizacioacuten del listado de contenedores en funcionamiento 110 Figura 38 Detalle del listado de contenedores en funcionamiento 110

Iacutendice de tablas


12

Tabla 1 Presupuesto Comunidad desarrolladores (Hypotesis Open) 26 Tabla 2 Presupuesto del Partner (Hyypotesis Pro) 27 Tabla 3 Presupuesto de la Escuela (Hyypotesis School) 27 Tabla 4 Redes sociales y eventos en los que realizaran campantildeas de marketing 53 Tabla 5 Caracteriacutesticas Hypotesis Django 58 Tabla 6 Caracteriacutesticas Hypotesis DB 65 Tabla 7 Caracteriacutesticas Hypotesis Vue 67 Tabla 8 Colores corporativos 77

Iacutendice de interfaces Interfaz 1 Hypotesis Pro - Login 84 Interfaz 2 Hypotesis Pro ndash Usuarios 84 Interfaz 3 Hypotesis Pro - Crear Usuario 85 Interfaz 4 Hypotesis Pro - Roles 85 Interfaz 5 Hypotesis Pro ndash Permisos 86 Interfaz 6 Hypotesis Pro - Asignar permisos a roles 86 Interfaz 7 Hypotesis Pro ndash Contextos 87 Interfaz 8 Hypotesis Pro - Grados 87 Interfaz 9 Hypotesis Pro ndash Masters 88 Interfaz 10 Hypotesis Pro ndash Cursos 88 Interfaz 11 Hypotesis Pro ndash Matriculacioacuten 89 Interfaz 12 Hypotesis Pro ndash Categoriacuteas 89 Interfaz 13 Hypotesis Pro - Aulas 90 Interfaz 14 Hypotesis School ndash Login 91 Interfaz 15 Hypotesis School - Profesor - Inicio 91 Interfaz 16 Hypotesis School - Profesor - Perfil 92 Interfaz 17 Hypotesis School - Profesor - Mis Cursos 92 Interfaz 18 Hypotesis School - Profesor - Mis Aulas 93 Interfaz 19 Hypotesis School - Profesor ndash Curso ndash Crear 93 Interfaz 20 Hypotesis School - Profesor ndash Curso 94 Interfaz 21 Hypotesis School - Profesor - Curso ndash Itinerario 94 Interfaz 22 Hypotesis School - Profesor - Curso - Itinerario ndash Edicioacuten 95 Interfaz 23 Hypotesis School - Profesor - Curso - Itinerario ndash Colapsado 95 Interfaz 24 Hypotesis School - Profesor - Curso ndash Seccioacuten 96 Interfaz 25 Hypotesis School - Profesor - Entregable ndash Crear 96 Interfaz 26 Hypotesis School - Profesor ndash Entregable 97 Interfaz 27 Hypotesis School - Profesor ndash Viacutedeo 97 Interfaz 28 Hypotesis School - Profesor ndash Aula 98 Interfaz 29 Hypotesis School - Profesor - Aula - Notas 98 Interfaz 30 Hypotesis School - Estudiante - Inicio 99 Interfaz 31 Hypotesis School - Estudiante - Mi Perfil 99 Interfaz 32 Hypotesis School - Estudiante - Mis Cursos 100


13

Interfaz 33 Hypotesis School - Estudiante - Curso ndash Portada 100 Interfaz 34 Hypotesis School - Estudiante - Curso ndash Itinerario 101 Interfaz 35 Hypotesis School - Estudiante - Curso - Itinerario ndash Colapsado 101 Interfaz 36 Hypotesis School - Estudiante - Curso ndash Seccioacuten 102 Interfaz 37 Hypotesis School - Estudiante ndash Curso - Seccioacuten - Ver comentario 102 Interfaz 38 Hypotesis School - Estudiante ndash Entregable 103 Interfaz 39 Hypotesis School - Estudiante ndash Viacutedeo 103


14

1 Introduccioacuten 11 Proacutelogo

Desde la irrupcioacuten del software la educacioacuten ha sido uno de los principales motores para el desarrollo de las aplicaciones informaacuteticas Como ejemplo podemos encontrar el proyecto

Dynabook1 de Alan Kay junto con el lenguaje de programacioacuten Smalltak en el que la meta principal

era que los nintildeos usaran el software para aprenderlo Del germen de ese proyecto brotoacute Xerox Park

(Palo Alto Estados Unidos) donde se construyeron los cimientos de la computacioacuten moderna

El software ha mejorado las herramientas educativas analoacutegicas y ha incorporado nuevas experiencias

como la realidad virtual o el aprendizaje electroacutenico (Machine Learning2) y por esto tiene cada vez

maacutes peso en la comunidad educativa Pero es cierto que la rapidez de evolucioacuten de las aplicaciones no estaacute siendo bien gestionada y en muchas ocasiones podemos encontrar que tanto profesores

como alumnos no realizan un buen uso de ellas Un claro ejemplo es el caos creado en el sistema

escolar tras el confinamiento por la enfermedad covid-193 del antildeo 2020

Por su parte las plataformas LMS (Learning Management System4) han recorrido una evolucioacuten

paralela y distante de esa evolucioacuten Los sistemas de gestioacuten de contenidos aplicados al aprendizaje

electroacutenico llevan implantados maacutes de dos deacutecadas pero auacuten sigue costando mucho esfuerzo

convertirlos en una herramienta fundamental en la gestioacuten de las aulas o instituciones

Moodle es uno de los LMS maacutes populares fue creado inicialmente bajo los principios del coacutedigo

abierto y ha ido abarcando la mayoriacutea de las universidades en el mundo No obstante existen muchas

criacuteticas respecto a coacutemo ha llegado a convertirse en un negocio privado que se beneficia de su

enorme comunidad de desarrolladores y por otra parte es cada vez maacutes detractado por su obsoleto coacutedigo que impide su escalamiento y mantenimiento

Por otra parte herramientas como Google Classroom son cada vez maacutes utilizadas tanto a nivel

educativo como dentro de las empresas La integracioacuten con otras aplicaciones de Google son una

ventaja abismal respecto a los LMS como Moodle puesto que muchos usuarios utilizan en su diacutea a

diacutea herramientas como Google Drive Google Documents o Google Hangouts La dificultad de

administrar Moodle choca frontalmente con la facilidad de poner en marcha un aula en Google Classroom

1 Dynabook httpseswikipediaorgwikiDynabook 2 Machine learning iquestqueacute es y coacutemo funciona httpswwwbbvacomesmachine-learning-que-es-y-como-funciona 3 COVID-19 httpseswikipediaorgwikiCOVID-19 4 LMS httpseswikipediaorgwikiSistema_de_gestiC3B3n_de_aprendizaje


15

Figura 1 Logotipo de Google Classroom

Teniendo en cuenta las ventajas que nos puede ofrecer un LMS abierto y adaptable a las necesidades

de una organizacioacuten y el potencial que las herramientas de Google nos aportan es necesario apostar

por un LMS que integre aplicaciones privativas mediante las API que eacutestas nos ofrecen Por lo que

este trabajo final de grado ha apostado por la creacioacuten de un LMS que cumple con los estaacutendares

baacutesicos del coacutedigo abierto pero que a su vez facilita la integracioacuten de forma natural de estas

aplicaciones u otras de coacutedigo abierto para nutrirse de esta forma de sus continuos evolutivos

Esta plataforma ofrece una solucioacuten a la complejidad de las instalaciones y configuraciones que

supone la implantacioacuten de un LMS gratuito en la que se necesitan conocimientos avanzados de

programacioacuten y de sistemas Por lo que se apuesta por la posibilidad de configurar la plataforma como un servicio bajo demanda (SaaS5) en donde la institucioacuten solo tendraacute que preocuparse de gestionar

sus aulas y pagar por los servicios que consuma y que de este modo la plataforma sea una solucioacuten

que aporte valor al negocio y deje de ser vista como un problema

Un LMS no solo debe tener un fin pedagoacutegico sino tambieacuten de gestioacuten y ser el centro de las herramientas de una institucioacuten educativa una escuela o de los recursos humanos de una empresa

Debe estar preparado para la gestioacuten y monitorizacioacuten de la actividad del curso y por lo tanto debe

tener la capacidad de sincronizacioacuten con el resto de las aplicaciones de la organizacioacuten Por su parte

Google Classroom no dispone de esa flexibilidad de personalizacioacuten por lo que se hace

necesario auacuten maacutes la existencia de un gestor de contenido de aprendizaje global y completo

Esta plataforma cumple con todos estos criterios siendo un LMS extensible y configurable a las

caracteriacutesticas de cualquier negocio educativo pero facilitando la integracioacuten con otras herramientas

donde los usuarios se sienten coacutemodos Ademaacutes se promueve una red de distribuidores que sean los

encargados de poner en marcha el portal y que se encarguen de asesorar y guiar a sus clientes con

el objetivo final de mejorar las herramientas digitales en la educacioacuten y formacioacuten

5 Software como servicio httpseswikipediaorgwikiSoftware_como_servicio


16

12 Definicioacuten

Las grandes carencias teacutecnicas de los maacutes importantes LMS de coacutedigo abierto como Moodle Edmodo

o Canvas ha influido en la baja implantacioacuten de estos gestores en muchas organizaciones

educativas o empresariales

Estos aplicativos son muy complejos de instalar y de adaptar por lo que al final es necesario la

contratacioacuten de programadores o disentildeadores para obtener un producto miacutenimo viable Esta

circunstancia influye notablemente en que cada vez maacutes centros decidan utilizar herramientas como

Google Classroom que son maacutes usables maacutes accesible y en muchos casos ofrecen funcionalidades

maacutes potentes y estables

Por lo que dada estas necesidades este trabajo final de grado ha apostado por la creacioacuten de un LMS que podraacute alojarse en la nube y ofrecer a los clientes un servicio bajo demanda El cliente

solo tendraacute que pagar por su utilizacioacuten y podraacute administrar su plataforma en diferentes niveles de roles

sin preocuparse de la creacioacuten de desarrollos personalizados mantenimiento de sistemas o

contratacioacuten de equipos fiacutesicos

Figura 2 Logotipo de AWS

La tecnologiacutea utilizada estaacute basada coacutedigo abierto bajo licencia GNU GPBv3 utilizando una

infraestructura de microservicios mediante contenedores virtuales y comunicacioacuten API Rest Esta solucioacuten ha tenido un gran compromiso con las buenas praacutecticas de la programacioacuten

fomentando la escalabilidad modularidad y en la que se ha intentado minimizar los costes de

mantenimiento y de actualizacioacuten Para dar servicio bajo demanda a los clientes es fundamental que

las aplicaciones esteacuten preparadas para una alta disponibilidad y concurrencia

La arquitectura de todas las aplicaciones estaacute orientada a facilitar un entorno de tenencia muacuteltiple

(multi-tenant 6 ) para que la red de distribuidores pueda dar servicio a sus clientes en entornos

6 Construyendo una plataforma SaaS Multi-tenant httpsmediumcomwidergyconstruyendo-una-plataforma-saas-multi-tenant-vol-1-71a6cbe0334d


17

individualizados sin tener que ampliar mantenimiento o duplicidad de coacutedigo De esta forma el

rendimiento de cada servicio no se veraacute afectado por el resto y los distribuidores podraacuten aplicar

recursos de forma controlada con costes particularizados a cada cliente

La arquitectura del proyecto estaacute preparada para implementar con interfaz de aplicaciones otras

herramientas de coacutedigo abierto como Google ClassRoom RocketChat Zoom AWS GCP Azure etc

El proyecto se adapta a organizaciones educativas colegios institutos de negocios autoescuelas

escuelas de idiomas o incluso para los departamentos de recursos humanos de empresas en la que

podraacuten gestionar no solo la formacioacuten sino tambieacuten utilizar este portal como un punto de encuentro de informacioacuten para mejorar las sinergias de la corporacioacuten

Se ha desarrollado un prototipo de demostracioacuten con la configuracioacuten y adaptacioacuten de una escuela

online de programacioacuten llamada Hypotesis School que contiene varios cursos con profesores y

alumnos de prueba y en la que se pueden realizar actividades cuestionarios videoconferencias y

otras actividades Este proyecto debido al alcance de la asignatura contiene solo algunas de las

funcionalidades comentadas en este trabajo final de grado

Figura 3 Diagrama de la aplicacioacuten

School


18

13 Objetivos generales

Dentro del proyecto existen diferentes objetivos pero el objetivo general ha sido desarrollar una

plataforma de gestioacuten de cursos digitales que ofrezca un servicio bajo demanda en la nube y que

pueda adaptarse a cualquier negocio educativo sin necesidad de conocimientos teacutecnico ni de

programacioacuten Aun asiacute el desarrollo estaacute orientado para que empresas distribuidoras puedan instalarla

en sus servidores tanto fiacutesico como en la nube y personalizar funcionalidades y disentildeo para sus

clientes De esta forma garantizar que la institucioacuten educativa ponga su esfuerzo expresamente en

crear buenos contenidos y que acompantildee de forma correcta a la consecucioacuten de las competencias por

parte del alumno mejorando de este modo la calidad de los contenidos digitales en la comunidad

educativa

131 Objetivos principales

Objetivos de la aplicacioacuten

bull Respetar los principios de la usabilidad de Nielsen 7 y ser accesible para personas con

discapacidades

bull Estar preparada para la ampliacioacuten de moacutedulos y de evolutivos

bull Cumplir los estaacutendares web W3C utilizando HTML5 CSS3 y Javascript en el lado cliente

bull Ser adaptable a cualquier pantalla y dispositivo

bull Tener un alto nivel de servicio garantizando una alta disponibilidad y concurrencia

bull Disponer de las mejores praacutecticas de seguridad frente a ataques informaacuteticos

Objetivos para la comunidad de coacutedigo libre

bull Seguir los principios del Manifiesto por el Desarrollo Aacutegil de Software8

bull Seguir el paradigma de la Programacioacuten Orientada a Objetos (POO)

bull Cumplir con los principios SOLID9 de la programacioacuten

bull Implementar los patrones de disentildeo del software siempre que proceda

bull Implementar el patroacuten Modelo Vista Controlador o similar (MVC)

bull Cumplir un coacutedigo de conducta para todos los programadores

Objetivos para el distribuidor o partner de la plataforma

7 Principios de usabilidad web de Jakob Nielsen disentildeo UX httpsessemrushcomblogusabilidad-web-principios-jakob-nielsen 8 Manifiesto por el Desarrollo Aacutegil de Software httpsagilemanifestoorgisoesmanifestohtml 9 SOLID httpseswikipediaorgwikiSOLID


19

bull Poder desplegar automaacuteticamente las aplicaciones en servidores en la nube o fiacutesicos

bull Poder personalizar tanto el disentildeo como las funcionalidades para cada cliente final

bull Poder configurar entornos exclusivos para cada cliente mediante arquitectura multi-tenant

bull Poder integrar moacutedulos externos mediante API

bull Poder integrar aplicaciones propias de los clientes mediante API o importacioacuten y exportacioacuten

de archivos CSV

bull Disponer de las herramientas necesarias para cumplir con medidas de seguridad informaacutetica

y proteccioacuten de datos

Objetivos para el organismo educativo o empresa

bull Poder gestionar escuelas carreras masters cursos o tutoriales

bull Poder crear cursos de forma personaliza en la que pueda adaptar coacutemodamente sus planes

de estudio

bull Poder gestionar cualquier tipo de usuario como directores profesores alumnos autores

creadores de contenido gestores etc

bull Poder crear y matricular usuarios de forma masiva o manual

Objetivos para el usuario final (profesor alumno autor hellip)

bull Aprender en una plataforma flexible raacutepida y sin errores

bull Poder utilizar herramientas colaborativas como videoconferencias encuestas o juegos

bull Poder utilizar las herramientas de Google Classroom y Google Hangouts

bull Poder comunicarse con otros usuarios de la plataforma

bull Poder utilizar repositorios de archivos y documentos

Objetivos personales del autor del TFG

bull Desarrollar una plataforma online de gestioacuten de cursos para implementar los conocimientos

adquiridos en mi experiencia laboral

bull Crear mi primer proyecto open source con repositorio en GitHub

bull Aplicar una metodologiacutea de desarrollo aacutegil mediante teacutecnicas DevOps utilizando la integracioacuten

continua y el control de versiones

bull Utiliza Amazon Web Service para la creacioacuten de redes virtuales e instancias

bull Aplicar medidas de seguridad y proteccioacuten de datos

bull Aprender Python Django y VueJS

bull Desarrollar una aplicacioacuten con una capa back y una capa front separadas y comunicadas

mediante API REST utilizando medidas de seguridad contra ataques


20

bull Conocer coacutemo funciona una arquitectura de infraestructura virtual mediante contenedores

Docker yo Kubernetes permitiendo un entorno de tenencia muacuteltiple (multi-tenant)

bull Automatizar los despliegues con Docker Compose

bull Investigar y aprender sobre Jenkins Puppet Terraform y otras tecnologiacuteas DevOps

bull Implementar las API de Google para Google Classroom y Hangouts

132 Objetivos secundarios

Objetivos adicionales que enriquecen el TF

bull Implementar un nivel de accesibilidad AA para facilitar el uso de la plataforma a la mayor parte

de los usuarios incidiendo en las personas con discapacidades

bull Cumplir la Ley Orgaacutenica de Proteccioacuten de Datos Personales y garantiacutea de los derechos

digitales (LOPD-GDD)

bull Cumplir los principios de la programacioacuten orientada a objetos como KISS GRASP o DRY


21

14 Metodologiacutea y proceso de trabajo

El desarrollo se ha basado en los principios del manifiesto aacutegil y se ha utilizado la integracioacuten

continua con procesos iterativos Esta metodologiacutea ha permitido tener un aplicativo en funcionamiento

desde una fase inicial en el que se han ido antildeadiendo funcionalidades facilitando adaptaciones y

correcciones en la plataforma

Se ha trabajado con metodologiacutea Canvas utilizando la aplicacioacuten Atalassian Jira con el objetivo de

que todas las tareas esteacuten divididas de forma atoacutemica y de este modo hacer un mejor seguimiento de

la evolucioacuten del proyecto y analizar mejor el impacto de cualquier cambio en un momento determinado

del proyecto

Figura 4 Pizarra Canvas del proyecto Hypotesis con Atlassian Jira

Para cumplir con la integracioacuten continua se ha utilizado Git que es un software de control de versiones y se ha alojado todo el coacutedigo en la plataforma GitHub El control de versiones ha facilitado

la correccioacuten de errores o creacioacuten de ramas de pruebas para probar evolutivos con riesgos en

entornos productivos

Figura 5 Repositorio GitHub del proyecto Hypotesis


22

Se ha trabajado en dos entornos complemente diferenciados local y desarrollo Estos entornos estaacuten

diferenciados tanto en el control de versiones como en las maacutequinas y redes utilizadas Los dos

entornos se construyeron mediante contenedores Docker utilizando una configuracioacuten totalmente

ideacutentica tanto a nivel de sistema operativo dependencias libreriacuteas o versiones para de esta forma

garantizar el mismo comportamiento y minimizar errores no esperados El proyecto estaacute preparado

para la puesta en marcha de la plataforma en cualquier entorno de produccioacuten

En algunas tecnologiacuteas y lenguajes se ha contado con la experiencia personal del autor Por otra parte

en otras tecnologiacuteas donde no se disponiacutea de conocimientos se ha utilizado cursos online en Youtube

o Udemy documentacioacuten oficial y webinar10 durante la realizacioacuten del proyecto Se ha investigado en

foros especializados las tecnologiacuteas existentes y coacutemo eacutestos se adaptaban a los requerimientos

En el desarrollo se han aplicado buenas praacutecticas de desarrollo y patrones de disentildeo de software para

facilitar el mantenimiento y la ampliacioacuten de funcionalidades Toda la infraestructura estaacute documentada

y se ha utilizado software de automatizacioacuten de despliegues con coacutedigo (IaC)11 tanto de maacutequinas

como de redes mediante Docker Compose Jenkins o Terraform

Se ha utilizado PyCharm como entorno de trabajo de Docker Python y Django Para el desarrollo en

VueJS se ha utilizado WebStorm Ambas interfaces de entorno de desarrollo pertenecen a la empresa

Jet Brains y son herramientas de pago utilizando la licencia de estudiante para este proyecto

10 Webinar httpswwwinboundcyclecomdiccionario-marketing-onlinewebinar 11 IaC Infraestructura como coacutedigo httpseveriscloudque-es-la-infraestructura-como-codigo-iac


23

15 Planificacioacuten

La planificacioacuten se ha realizado utilizando la herramienta de Atlassian Jira para la gestioacuten de tareas

El meacutetodo ha consistido en identificar los grandes bloques del proyecto en eacutepicas e ir dividiendo las

tareas en subtareas para que fueran lo maacutes pequentildeas posibles y medibles

Ademaacutes se ha utilizado una pizarra de estados tipo Canvas con cinco estados

POR HACER Tareas que estaacuten pendiente de realizar

EN CURSO Tareas que se encuentran actualmente en desarrollo

DESARROLLO Tareas de coacutedigo que se ha implementado en el entorno de Desarrollo

PRODUCCIOacuteN Tareas de coacutedigo que se ha implementado en el entorno de Produccioacuten

COMPLETADO Tareas que han sido revisadas y completadas

No se ha utilizado un entorno de pruebas funcional puesto que el proyecto ha sido realizado por una

uacutenica persona por lo que el entorno de Desarrollo ha servido como entorno de pruebas

Figura 6 Tablero o Pizarra Canvas de Atlassian Jira del proyecto Hypotesis


24

151 Fechas destacadas del proyecto

bull Semana del 13 de abril o Anaacutelisis y creacioacuten de propuesta

o Recogida de requisitos funcionales y objetivos

o Anaacutelisis de requerimientos teacutecnicos

o Planificacioacuten

bull Semana del 20 de abril o Disentildeo corporativo

Creacioacuten de marca

Manual corporativo y web

o Disentildeo de prototipo

Lo-Fi

Hi-fi

o Anaacutelisis de eacutepicas y tareas e implementacioacuten de eacutestas en Atlassian Jira

o Investigacioacuten de tecnologiacuteas no conocidas

Despliegues aplicativos con Jenkins

Despliegues infraestructura con Terraform

Amazon Web Services (AWS) amp Google Cloud Platform (GCP)

Framework Django

Integracioacuten Google Classroom

o Configuracioacuten control de versiones en Git y Github

o Configuracioacuten redes y maacutequinas en Docker Compose

bull Semana del 27 de abril o Instalacioacuten de aplicativos

Backend (Django)

bull Hypotesis Manager

Base de datos (MySQL)

Frontend (VueJs)

bull Hypotesis Pro

bull Hypotesis School

o Guion y storyboard video presentacioacuten

bull Semana del 4 de mayo

o Desarrollo Backend en Django

Loacutegica de negocio


25

o Entrega de PEC 4 10 de mayo

bull Semana del 11 de mayo o Desarrollo Frontend Hypotesis Manager en Django

o Desarrollo Frontend Hypotesis Pro en VueJs


bull Semana del 18 de mayo o Desarrollo Frontend Hypotesis School en VueJs

bull Semana del 25 de mayo o Configuracioacuten de prototipo Escuela de Programacioacuten

o Configuracioacuten de los cursos demo

Curso baacutesico de Django

o Creacioacuten de los contenidos de los cursos demo

bull Semana del 1 de junio o Creacioacuten de la presentacioacuten en video del TFG

bull Semana del 8 de junio Entrega de PEC 5 o Preparacioacuten Defensa 5 de junio19 junio

bull 19 de junio Defensa TFG

Figura 7 Diagrama de Gantt en Atlassian Jira de Hypotesis


26

16 Presupuesto

El proyecto consta de tres entidades colaboradoras para la puesta en produccioacuten del servicio

completo En primer lugar estaacute la comunidad de desarrolladores que seraacute la encargada del desarrollo

del coacutedigo libre que se hospedaraacute en GitHub Por otra parte el partner o distribuidor encargado de la

puesta en produccioacuten de la plataforma Y por uacuteltimo nos encontramos con las instituciones educativas

o empresas que tendraacuten que elaborar o contratar la organizacioacuten y contenido de los cursos

En este TFG por lo tanto para la puesta en produccioacuten del prototipo tendremos en cuenta los tres

presupuestos que incluyen la puesta en produccioacuten durante 1 antildeo

161 Comunidad desarrolladores (Hypotesis Open)

Dentro de este apartado se incluye los desarrollos para la puesta en marcha de la comunidad de

coacutedigo abierto y el proyecto base que se podraacute descargar bajo licencia NGU desde GitHub y que

serviraacute como marco de trabajo para las empresas distribuidoras (partners)

Tabla 1 Presupuesto Comunidad desarrolladores (Hypotesis Open)

Horas eurohora Total Observaciones Recursos Humanos 266 21800

Disentildeo Graacutefico 36 50 1800

Marca 6

Manual corporativo 14

Manual componentes web 8

Prototipo Hi-Fi 8

Manager 8

Gestioacuten de proyecto 50 100 5000

Atlassian Jira 0 Capa gratuita Gestor de proyecto 50

Desarrollo backend 80 100 8000

Desarrollo frontend 100 70 7000

Hypotesis Manager 20

Hypotesis Pro 20

Hypotesis School 60

Mantenimiento y soporte 192 13200 GitHub 0 0 Capa gratuita Control de versiones 120 50 6000 10 horas al mes Correccioacuten de errores 72 100 7200 6 horas al mes

TOTAL 35000 euro


27

162 Partner o distribuidor (Hypotesis Pro)

Este es el presupuesto que tendraacute que implementar el distribuidor para poner en marcha la plataforma

en sus instalaciones o cuenta Cloud

Tabla 2 Presupuesto del Partner (Hyypotesis Pro)

Horas eurohora Total Observaciones Produccioacuten 25

Dominio en Arsyses 1 25 25 hypotesiscom amp hypotesises (antildeo) Cuentas de correo 0 Incluye cuentas de correo

Amazon Web Services 155 Instancias 155

Produccioacuten 8760 00059 52 t3nano Desarrollo 8760 00059 52 t3nano Despliegues 8760 00059 52 t3nano

Base de datos 0 10 horas al mes Produccioacuten 0 En la misma instancia que aplicativo Desarrollo 0 En la misma instancia que aplicativo

Google Cloud Platform 0 Google Classroom API 0 Capa gratuita

Puesta en marcha 100 1360 Escuela de programacioacuten 34 40 1360 Capa gratuita

Configuracioacuten 2 0 Personalizacioacuten 32 0

Hypotesis Manager 6 0 Hypotesis Pro 8 0 Hypotesis School 18 0

TOTAL 1540 euro

163 Escuela (Hypotesis School)

Este es el presupuesto que tendraacute que aplicar la Escuela de programacioacuten para impartir 2 cursos con

480 matriculaciones al antildeo

Tabla 3 Presupuesto de la Escuela (Hyypotesis School)

Matriculaciones euromatriculacioacuten Total Observaciones Mantenimiento y soporte 480

Matriculacioacuten alumno en curso 480 1 480

Horas eurohora Total Observaciones Curso baacutesico Django 20 horas 2000 Curso de 20 horas

Creacioacuten de plan de estudios 15 40 600 Creacioacuten de contenidos 28 50 1400

Curso baacutesico Jenkins 10 horas 1020 Curso de 10 horas Creacioacuten de plan de estudios 8 40 320 Creacioacuten de contenidos 14 50 700

TOTAL 3500 euro


28

2 Anaacutelisis de mercado Uno de los propoacutesitos maacutes importantes de este trabajo final de grado ha sido buscar una solucioacuten a la

falta de gestores de contenidos educativos (LMS) flexibles y de coacutedigo abierto que existen el mercado

puesto que se basan en una aplicacioacuten monoliacutetica y no contemplan las nuevas arquitecturas API Rest

la arquitectura multi-tenant ni la automatizacioacuten de despliegues

Los LMS corporativos ofrecen un servicio bajo demanda en el que las empresas u organizaciones no

deben tener conocimientos de programacioacuten o redes para la instalacioacuten y mantenimiento de las

aplicaciones pero estos LMS no son de coacutedigo abierto por lo que necesitan grandes recursos para la

evolucioacuten y mantenimiento de la plataforma Ademaacutes la adaptacioacuten de estas plataformas a sus

aplicaciones ya existentes suele tener costes muy elevados

Entre estos dos grandes tipos de LMS se abre una posibilidad con un recorrido importante crear un LMS de coacutedigo abierto pero que esteacute basado en una arquitectura de microservicios utilizando la

computacioacuten virtualizada para automatizar toda su infraestructura y sus despliegues

Ademaacutes se ha utilizado el principio que utiliza Canvas LMS que consiste en ser un proyecto de coacutedigo

libre pero utilizando ese coacutedigo para crear una plataforma que ofrezca servicio bajo demanda a las

instituciones educativas Aunque el propoacutesito de este proyecto es que cada distribuidor haga uso de

ese coacutedigo para levantar su propia infraestructura por lo que habraacute que ir invitando a estos partners a

ser partiacutecipes del mantenimiento y evolucioacuten de la comunidad de coacutedigo libre Hypotesis

21 Puacuteblico objetivo

Existen cuatro tipos de puacuteblico al que este proyecto estaacute dirigido

Comunidad coacutedigo libre Desarrolladores y administradores de sistemas que quieran

participar en un desarrollo de aacutembito educativo utilizando las maacutes moderas metodologiacuteas y

arquitecturas

bull Perfiles de la comunidad de coacutedigo libre

Desarrollador backend realizaraacute los desarrollos de la comunidad que esteacuten

relacionados con la capa del servidor

Desarrollador frontend realizaraacute los desarrollos de la comunidad que esteacuten

relacionados con la capa cliente

Desarrollador sistemas realizaraacute los desarrollos de la comunidad

relacionados con la parte de sistemas redes e infraestructura


29

Partners o distribuidores Empresas tecnoloacutegicas del sector educativo que necesitan una

plataforma que tenga una gran comunidad detraacutes para agilizar sus desarrollos y que esta

plataforma esteacute preparada en una arquitectura capaz de ofrecer alta disponibilidad y

concurrencia y que sea faacutecil de mantener y evolucionar

bull Perfiles del distribuidor

Administrador plataforma administraraacute diariamente la plataforma y los

usuarios registrados en ella

Consultor elearning experto en aprendizaje electroacutenico que asesoraraacute a las

instituciones para la recogida de requisitos

Desarrollador backend se encargaraacute de adaptar la plataforma a la institucioacuten

Desarrollador frontend se encargaraacute de adaptar la plataforma a la institucioacuten

Instituciones educativas escuelas empresas o profesores que necesitan tener un gestor

de cursos y contenidos para fines educativos o formativos

bull Perfiles de la institucioacuten educativa

Director perfil de la direccioacuten de la institucioacuten

Gestor se encargaraacute de la administracioacuten de la plataforma en la capa de la

institucioacuten o escuela

Secretario realizaraacute tareas administrativas como facturas informes hellip

Autor creador de los contenidos pedagoacutegicos de los cursos

Profesor usuario que se encargaraacute de la gestioacuten del curso

Profesor creador profesor con privilegios de creacioacuten del curso

Marketing realizaraacute las campantildeas de marketing para promocionar la escuela

y gestionaraacute las noticias y eventos del portal

Alumnos El objetivo final de esta plataforma es que las personas puedan aprender o formarse

sin importar su edad condicioacuten o forma de conectarse a la red De esta forma se facilitaraacute a

las personas poder acceder a recursos pedagoacutegicos durante toda su etapa vital

bull Perfiles de alumnos

Estudiante usuario matriculado con el rol de estudiante en un curso

Invitado usuario invitado para demostracioacuten

Usuario registrador usuario que no estaacute matriculado en ninguacuten curso


30

22 Competencia

Existen muchos LMS en la actualidad los cuales podemos categorizarlos de la siguiente forma

221 LMS coacutedigo libre

Moodle (PHP)

Figura 9 Pantalla de un curso en Moodle 3

Es el LMS maacutes popular y estaacute desarrollado con PHP y JS sobre coacutedigo abierto que alojan en

GitHub Su comunidad de desarrolladores es muy grande por lo que hay cientos de plugins y

temas Muchas universidades han apostado por Moodle para sus campus online como la

Universidad Autoacutenoma de Madrid la Universidad Europea la Universidad de Castilla La

Mancha o la prestigiosa Open University Lo peor de este LMS es que parte de su coacutedigo es

antiguo no respetando la programacioacuten orientada a objetos y han apostado equivocadamente

por tecnologiacutea no escalable convirtiendo a Moodle en framework monoliacutetico y poco escalable

Por otra parte Moodle no apuesta por la formacioacuten de los programadores puesto que el

desarrollo de aplicaciones Moodle es parte de su negocio por lo que no existen tutoriales

oficiales ni cursos certificados

bull URL httpsmoodleorg

bull Ventajas Es el LMS maacutes popular y con maacutes documentacioacuten en la red Dispone de

cientos de plugins y temas que se pueden instalar desde la misma plataforma

bull Desventajas El nuacutecleo principal de la plataforma estaacute realizado en un coacutedigo

monoliacutetico y obsoleto el cual no exprime las nuevas caracteriacutesticas de PHP 7 No es

muy recomendable para proyectos con mucha concurrencia


31

Sakai LMS (Java)

Figura 10 Pantalla principal de Sakai LMS (Fuente httpsbit4learncom)

El Proyecto Sakai es un software educativo de coacutedigo abierto creado en 2005 por el consorcio

uPortal con la asociacioacuten de la Universidad de Michigan junto otros organismos como el MIT

o la Universidad de Stantford Estaacute desarrollado en Java y su implementacioacuten es muy popular

en universidades americanas

Estaacute enfocado en las instituciones educativas y en particular a la investigacioacuten acadeacutemica y

estaacute traducida a maacutes de 20 idiomas Es compatible con SCORM

bull URL httpswwwsakailmsorg

bull Ventajas Orientado a investigacioacuten bastante uacutetil en un entorno de intranet

universitario

bull Desventajas Dispone de una interfaz claacutesica


32

Claroline (PHP)

Figura 11 Paacutegina principal de Claroline LMS (Fuente httpsbit4learncom)

Es uno de los LMS maacutes antiguo ya que aparecioacute en el antildeo 2000 dentro del proyecto de la

Universidad Catoacutelica de Lovaina (Beacutelgica) En Espantildea la Universidad de Vigo apuesta desde

hace antildeos de forma activa siendo una de las integrantes del Consorcio Claroline responsable

de la comunidad de desarrolladores

Estaacute enfocada a dar servicios a universidades escuelas o institutos Ya ha sido traducida a

maacutes de 30 idiomas Existen dos versiones una versioacuten gratuita (Estaacutendar) y otra versioacuten de

pago (Connect) Es compatible con SCORM

bull URL httpsclarolinenet

bull Ventajas Es open source

bull Desventajas La comunidad en espantildeol es muy reducida Es muy difiacutecil encontrar

documentacioacuten y la mayoriacutea estaacute en franceacutes La interfaz de su versioacuten gratuita es muy

arcaica La experiencia de usuario es muy pobre y debe mejorar en su adaptabilidad


33

Dokeos (PHP)

Figura 12 Paacutegina principal de Dokeos LMS (Fuente httpsbit4learncom)

Al igual que Claroline surgioacute en Beacutelgica en 2004 como plataforma de coacutedigo abierto basada

en PHP y MySQL A pesar de su popularidad en 2009 varias decisiones poleacutemicas dieron

frutos al fork Chamilo

Se puede utilizar en su versioacuten web o descargando la aplicacioacuten e instalado en los propios

servidores

Su enfoque estaacute dirigido al aprendizaje mediante la interaccioacuten de los usuarios dando

relevancia a las aulas virtuales y a las herramientas cooperativas como encuestas chats o

wikis Es compatible con contenido SCORM

bull URL httpswwwdokeoscom

bull Ventajas Su interfaz es muy sencilla Es coacutedigo libre Estimula la participacioacuten de los

alumnos y su cooperacioacuten Se puede utilizar para gestor de clases presenciales

bull Desventajas Su comunidad es muy pequentildea Su coacutedigo es monoliacutetico y no modular


34

Chamilo (PHP)

Figura 13 Paacutegina principal en Chamilo LMS (Fuente httpsbit4learncom)

Chamilo nacioacute en 2010 de parte de la comunidad de desarrolladores de Dokeos por

desacuerdos en su liacutenea de comunicacioacuten y se ha convertido en uno de los LMS maacutes populares

junto a Moodle con maacutes de 21 millones de usuarios por todo el mundo Estaacute desarrollado en

PHP y su objetivo principal es apoyar la educacioacuten online Varias empresas estaacuten detraacutes de

este proyecto

Estaacute desarrollada como coacutedigo libre con licencia GNUGLP v3 por lo que podemos adaptar

nuestro proyecto con mucha libertad

El nombre de Chamilo proviene de lsquocamaleoacutenrsquo ya que uno de los objetivos de la plataforma es

que se adapte a cualquier proyecto e-learning Es compatible con contenido SCORM y dispone

de videoconferencias chats o foros

bull URL httpschamiloorges

bull Ventajas Es coacutedigo abierto Se puede instalar en cualquier sistema operativo Es muy

personalizable El coacutedigo de este LMS en PHP cumple con las buenas praacutecticas de

desarrollo en programacioacuten orientada a objetos La comunidad de desarrolladores es

amplia

bull Desventajas La experiencia de usuario de la interfaz es muy mejorable


35

222 LMS integrados en CMS de coacutedigo libre

Wordpress LearnDash LMS (PHP)

Figura 14 Paacutegina principal en Learn Dash de Wordpress

Es un plugin de pago para el gestor de contenidos Wordpress que agrega contenido para la

gestioacuten del aprendizaje electroacutenico en este CMS

Se puede utilizar para la venta de cursos online Es compatible con contenido SCORM

bull URL httpswwwlearndashcom

bull Ventajas Si la empresa dispone de un portal Wordpress este plugins puede adaptar

una seccioacuten del portal para implementar un LMS Ofrece la posibilidad de multisitio

Seguacuten algunos estudios es muy aacutegil y raacutepido

bull Desventajas Es de pago Se necesita Wordpress un gestor de contenido muy

utilizado en internet pero con un sistema de programacioacuten muy mejorable Solo

presenta funcionalidades muy baacutesicas de un LMS


36

Drupal Opigno LMS (PHP)

Figura 15 Paacutegina principal en Opigno de Drupal

Es un plugin para el gestor de contenidos Drupal en PHP Es gratuito y de licencia de coacutedigo

libre GNU versioacuten 2

Es compatible con SCORM y TinCAN ademaacutes incluye la tecnologiacutea de actividades H5P

bull URL httpswwwopignoorg

bull Ventajas Pertenece a la comunidad de Drupal y estaacute validado por ellos Es coacutedigo

libre

bull Desventajas Es necesario disponer de la instalacioacuten y de los conocimientos de Drupal


37

223 LMS coacutedigo libre con plataforma SaaS

Canvas LMS (Ruby)

Figura 16 Paacutegina principal en Canvas LMS

Es una aplicacioacuten desarrollada en 2011 mediante Ruby on Rails y bajo licencia de coacutedigo libre

AGPLv3 Es uno de los LMS con mayor crecimiento en todo el mundo

La empresa Instructure desarrolloacute esta aplicacioacuten para darle un uso comercial pero siguiendo

los principios del coacutedigo abierto

Estaacute orientada para ser utilizada por la parte corporativa del sistema educativos por lo que

muchas instituciones privadas y empresa lo eligen

Utiliza tecnologiacutea LTI (Learning Tools Interoperability) y dispone de cientos de graacuteficos e

informes facilitando la monitorizacioacuten del portal y los alumnos Ademaacutes permite la integracioacuten

con Skype Google Drive Twitter o Deliciuos

bull URL httpscommunitycanvaslmscom

bull Ventajas Su interfaz es moderna y adaptable a cualquier pantalla y dispositivo La

experiencia de usuarios es alta Es open source que se puede descargar modificar e

instalar en nuestros servidores

bull Desventajas El soporte es de pago no existe mucha documentacioacuten Hay una

empresa detraacutes del proyecto por lo que genera desconfianza en la comunidad de

desarrolladores


38

224 LMS corporativos de coacutedigo privativo

Blackboard Learn (Java)

Figura 17 Paacutegina principal en Blackboard Learn

Fundada en 1996 Blackboard es la empresa maacutes famosa del aacutembito educativo digital del

mundo Su LMS es parte de un conjunto de aplicaciones enfocadas para la gestioacuten de los

recursos humanos de una empresa

Ofrece un servicio bajo demanda con gran disponibilidad y concurrencia desde uno de los

portales maacutes robustos del mercado

Dispone de una de las mejores aulas virtuales que igualmente funciona como plugin de pago

en otros LMS como Moodle

bull URL httpswwwblackboardcomteaching-learninglearning-managementblackboard-learn

bull Ventajas Es un complemento de todo el ecosistema de Blackboard por lo que se

integra con el resto de las herramientas ofreciendo un control absoluto de la gestioacuten

de cursos y recursos humanos La interfaz graacutefica estaacute muy elaborada ofreciendo un

alto nivel de experiencia de usuario

bull Desventajas Es de pago su coste es muy elevado (el coste por alumno anual puede

llegar hasta los 1000 euros) y su coacutedigo es privado La plataforma no ha dado saltos

cualitativos en los uacuteltimos antildeos


39

Cornerstone

Figura 18 Paacutegina principal en Cornerston Learning

Cornerstone es una empresa fundada en 1999 en Santa Moacutenica (Estados Unidos)

especializada en la computacioacuten en la nube Dentro de su ecosistema de herramientas para la

gestioacuten de recursos humano dispone de un LMS muy potente que ha mejorado con la

adquisicioacuten de la plataforma SaaS de origen neoyorquino Grovo

Al estar integrada en el aacutembito Cornerstone On Demand este LMS dispone de cientos de

herramientas de monitorizacioacuten reportes y graacuteficos

Este LMS se ofrece bajo servicio bajo demanda a sus clientes Por lo que los clientes pagan

licencias dependiendo sus necesidades y usuarios

bull URL httpswwwcornerstoneondemandesaprendizaje

bull Ventajas Contiene todo el potencial de la plataforma Cornerstone Al ser un servicio

bajo demanda el cliente se desentiende de la plataforma y su mantenimiento

bull Desventajas Es de pago y de coacutedigo privado Es necesario conocimiento de

Cornerstone para sacar el maacuteximo partido


40

Schoology

Figura 19 Paacutegina principal en Schoology

Es una plataforma fundada en 2007 bajo un modelo SaaS que estaacute orientada a la categoriacutea K-

12 del sistema educativo americano dirigida a nintildeos de hasta 12 antildeos

Su objetivo principal es el aprendizaje bajo la interaccioacuten entre los estudiantes y los profesores

fomentando la visioacuten criacutetica y cooperativa de los alumnos

Su disentildeo estaacute basado en Facebook por lo que es muy amigable para sus usuarios

bull URL httpswwwschoologycom

bull Ventajas Gran facilidad de uso y experiencia de usuario

bull Desventajas No estaacute traducida al espantildeol por el momento Es de pago y su coste es

de 10$ por usuario


41

23 Anaacutelisis DAFO

Hypotesis se basa en una comunidad de coacutedigo abierto donde el primer objetivo es crear una

plataforma a traveacutes de una arquitectura de microservicios donde se iraacuten implementando distintos

servicios o libreriacuteas tanto de open source como propietarias y que funcionaraacuten como contenedores

virtuales autoacutenomos Esta infraestructura estaacute basada en despliegues automatizados mediante

tecnologiacutea como Docker Compose Puppet Jenkins o Terraform

Teniendo en cuenta las soluciones que existen actualmente en el mercado este proyecto se diferencia

de eacutestos en que ofrece una solucioacuten global tanto de aplicacioacuten como de infraestructura Es un proyecto

dirigido para que grandes empresas o distribuidores de tecnologiacutea puedan implementarlas y de esta

forma puedan ofrecer servicio de gestioacuten de cursos y aulas

Todo el coacutedigo fuente estaraacute por lo tanto en un repositorio de GitHub donde los desarrolladores podraacuten

participar dentro de unos principios y normas en comuacuten de buenas praacutecticas de desarrollo de sistemas

y de eacutetica Hay que hacer hincapieacute en que el coacutedigo utilizado no es solo para los aplicativos sino que

toda la parte de infraestructura estaacute configurada bajo coacutedigo siguiendo el paradigma de IaC

(Infraestructura como coacutedigo)

231 Aportacioacuten respecto a los LMS de coacutedigo libre

El gran aporte de Hypotesis respecto a las plataformas open source como Moodle o Sakai reside en

que estas aplicaciones son monoliacuteticas donde integran todas las libreriacuteas o plugins dentro de la misma

aplicacioacuten De esa forma es muy complejo escalar partes concretas del aplicativo en cuanto a

rendimiento y todas las integraciones o desarrollos afectan a la complejidad del resto del aplicativo

Este paradigma permite que incluso se pueda solicitar a otras empresas realizar desarrollos de

moacutedulos o evolutivos sin poner en compromiso la plataforma

Ademaacutes Hypotesis no estaacute pensada para un consumo de usuario final que puede ser una escuela o

una institucioacuten que no dispone de desarrolladores Hypotesis estaacute pensada para empresas o

instituciones con capacidad tecnoloacutegica para dar soporte implementar evolutivos y mantenimientos

Por este motivo la calidad de los desarrollos son un principio baacutesico

232 Aportacioacuten respecto a Canvas

Hypotesis por otra parte es un competidor directo con aplicaciones como Canvas puesto que esta

plataforma de igual forma pone a disposicioacuten su coacutedigo abierto en un repositorio puacuteblico y ofrece una

plataforma SaaS privativa para dar servicios bajo demanda a clientes La mayor ventaja de Hypotesis

respecto a Canvas es que implica a los distribuidores a ser los garantes de la comunidad open source


42

aumentando la cantidad de contribuidores a la comunidad En este momento no maacutes de 50 usuarios

aportan su esfuerzo en el proyecto Canvas

Ademaacutes Hypotesis ofrece la automatizacioacuten de despliegues e infraestructura permitiendo la tenencia

muacuteltiple y facilitando a los distribuidores minimizar sus costes y recursos para que puedan aportar

valor a la calidad de los contenidos y de la plataforma

233 Aportacioacuten respecto a LMS privativas

Respecto a otras plataformas totalmente privadas como Blackboard o Cornerstone nuestro proyecto

tendraacute unos costes maacutes econoacutemicos tanto en la instalacioacuten ya que la licencia seraacute gratuita como en

el mantenimiento puesto que los distribuidores se ahorraraacuten grandes esfuerzos en el desarrollo de la

aplicacioacuten y la infraestructura

El eacutexito de la comunidad de coacutedigo libre seraacute esencial la competencia con este tipo de rivales puesto

que un proyecto de este tipo que funcione y tenga ritmo de desarrollo garantizaraacute la calidad de la

plataforma y la variedad de funcionalidades

Las instituciones que contraten estos servicios podraacuten implementar en sus campus virtuales cualquier

tipo de tecnologiacutea puesto que la arquitectura de microservicios permite la conectividad de entornos

totalmente diferenciados lo que no limitaraacute en ninguacuten momento la capacidad de integracioacuten de terceras

aplicaciones

Ademaacutes el modelo de Hypotesis facilitaraacute que el coacutedigo sea flexible y sin deudas teacutecnicas donde los

distribuidores se podraacuten nutrir unos de otros


43

3 Propuesta Con este trabajo final de grado se ha propuesto crear una comunidad open source para el desarrollo

de una plataforma que pueda gestionar las necesidades de una escuela formativa instituto

universidad departamento de recursos humanos o cualquier organismo que implemente la formacioacuten

a alumnos

A continuacioacuten se desglosan las especificaciones de cada producto

31 Hypotesis Open

La comunidad educativa de coacutedigo abierto se llama Hypotesis Open y estaacute alojada en GitHub Se ha

configurado el proyecto de GitHub de forma puacuteblica para que el desarrollador interesado puede solicitar

participar en el proyecto

URL del repositorio en GitHub httpsgithubcomamanzanodhypotesis

Figura 20 Proyecto Hypotesis Open en GitHub


44

32 Hypotesis Manager

Los distribuidores o partners utilizaraacuten el portal de administracioacuten Hypotesis Manager para gestionar

todos sus clientes configuraciones del portal logs monitorizacioacuten etc

Este portal estaacute desarrollado con Django que es un framework escrito en Python 3 El frontend se ha

realizado con las vistas y templates de Django sin la utilizacioacuten de ninguacuten framework de JavaScript

por el momento

Teniendo en cuenta el alcance de este trabajo final de grado se ha utilizado el moacutedulo por defecto de

administrador de Django sin implementar ninguacuten disentildeo nuevo ni maquetacioacuten

Las especificaciones de este portal son las siguientes

- Usuarios

o Autenticacioacuten el meacutetodo en que el usuario podraacute iniciar sesioacuten

o Registro creacioacuten de una cuenta de usuario

o Roles tipos de usuario

o Permisos privilegios para realizar cualquier accioacuten en el portal

- Contextos

o Creacioacuten edicioacuten y eliminacioacuten de plataformas instituciones escuelas grados

masters cursos categoriacuteas iacutetems u otros nuevos contextos personalizados

- Matriculacioacuten

o Matriculacioacuten de usuarios en la plataforma escuela grados masters cursos aulas

- Idioma gestioacuten de las cadenas de texto y de sus traducciones

Propuestas de ampliaciones en el futuro

- Monitorizacioacuten

o Graacuteficos monitorizacioacuten del comportamiento de toda la plataforma

o Logs visualizacioacuten de los logs de toda la aplicacioacuten

o Alertas configuracioacuten de alertas (email avisos llamadas telefoacutenicas SMS hellip)

o Notificaciones creacioacuten de notificaciones a nivel plataforma para usuarios

- Configuracioacuten

o Microservicios configuracioacuten de los microservicios de la plataforma para poder

modificar versiones editar direcciones deshabilitar hellip

o Moacutedulos instalacioacuten y configuracioacuten de los moacutedulos de la plataforma como Google

Classroom Hangouts Rocket Chat hellip


45

33 Hypotesis Pro

Las instituciones educativas como universidades institutos escuelas colegios o incluso

departamentos de recursos humanos utilizaran el portal Hypotesis Pro para gestionar los cursos

masters grados usuarios etc Este portal tiene las siguientes especificaciones

Este portal estaacute realizado en Vuejs 212 que es un framework de coacutedigo libre desarrollado en Javascript

creado en 2014 que es competencia directa de Angular y ReactJS Las caracteriacutesticas principales de

este framework es el manejo de componentes y eventos

Este portal consume los datos desde el backend de Hypotesis Manager mediante API token y

securizado por una lista blanca de IP y solo podraacute estar abierto a su utilizacioacuten desde las direcciones

IP que la institucioacuten decida

En este portal se gestionan las siguientes entidades

bull Usuarios




bull Contextos Niveles de contextos para la asignacioacuten de matriculaciones y permisos

o Plataforma Es el nivel superior y estaraacute gestionado por el partner

o Institucioacuten Es el nivel superior dentro de la institucioacuten educativa

o Escuela La institucioacuten puede disponer de varias escuelas

o Grado Es el nivel maacutes alto en el tipo de formacioacuten educativa y puede contener maacutester

o cursos en su interior

o Master Es un conjunto de cursos

o Curso Es el nivel maacutes bajo del tipo de formacioacuten educativa

o Aula Los cursos se podraacuten dividir en aulas

o Seccioacuten El itinerario del curso se dividiraacute en secciones Estas secciones pueden ser

temas semanas o diacuteas

o Iacutetem Cada seccioacuten podraacute contener actividades o recursos

Recursos Viacutedeos

Actividades Iacutetems que pueden llegar a ser evaluables como entregables

12 Vue 2 httpsenwikipediaorgwikiVuejs


46

bull Categoriacuteas Tanto los grados masters cursos o iacutetems podraacuten estar organizados en categoriacuteas

para organizar y buscar mejor estos contextos


bull Usuarios


bull Iacutetem Cada seccioacuten podraacute contener actividades o recursos

o Recursos Audios Archivos PDF paacuteginas HTML paacuteginas Markdown

o Actividades SCORM H5P debates Videoconferencias con Google Classroom o

Zoom Interactivos

bull Notificaciones La institucioacuten puede realizar gestionar o administrar las notificaciones a sus

usuarios

bull Chat Chat para conversaciones asiacutencronas entre usuarios

bull Foro La institucioacuten dispone de un foro general y seraacute la encargada de su administracioacuten

bull Tabloacuten de anuncios seccioacuten para informar a los usuarios de las noticias o eventos de la

institucioacuten

bull Informes desde esta seccioacuten se puede consultar todos los informes estadiacutesticas o graacuteficos de

los ocurrido en el LMS

bull Administracioacuten en esta seccioacuten se podraacuten realizar documentos administrativos como facturas

certificados etc

34 Hypotesis School

Los estudiantes autores y profesores de las instituciones educativas utilizaraacuten el portal Hypotesis

School el cual estaraacute abierto a la totalidad de internet Al igual que el portal de Hypotesis Pro estaacute

desarrollado en Vue 2 y consume los datos del backend de Hypotesis Manager

El motivo de dividir ambos portales es por seguridad y con el objetivo de enjaular las peticiones puesto

que el portal Hypotesis Pro tiene privilegios para crear editar o eliminar (de forma loacutegica) cualquier

entidad y de este modo restringimos el peligro desde este portal que solo daraacute acceso a usuarios

finales como profesores alumnos o autores


bull Escuela

o Oferta Cursos listado de los cursos ofertados por la escuela


47

bull Usuario

o Perfil paacutegina descripcioacuten del usuario

o Mis GradosMis MastersMis Cursos listado de los cursos donde se participa

o Mis Aulas listado de aulas donde se participa

o Calendario calendario con las fechas y eventos

bull Grado Master o Curso (Contexto)

o Portada paacutegina principal del contexto

o Participantes listado de participantes del contexto

o Itinerario desglose de las secciones actividades y recursos del curso

o Notas listado de las notas del contexto


bull Escuela

o Noticias listado de noticias destacadas y eventos relacionados con la escuela

o Foro foro de debate principal de la escuela

o Traacutemites seccioacuten para realizar o visualizar cualquier traacutemite administrativo

bull Usuario

o Notificaciones notificaciones relacionadas con el usuario


o Tabloacuten paacutegina del tabloacuten de anuncio relacionado con el contexto

o Competencias competencias aprendidas en el contexto

o Foro foro principal del contexto

bull Chat

o Mensajeriacutea instantaacutenea que incluiraacute conversaciones con profesores alumnos

grupales salas o robots

341 Hypotesis Code

Las especificaciones de la escuela Hypotesis Code son los mismos que los de las escuelas que utilicen

el portal Hypotesis School Pero dada su condicioacuten se basa en un portal para el aprendizaje de

lenguajes de programacioacuten y tecnologiacuteas relacionadas Por lo que el disentildeo y algunos moacutedulos

especiacuteficos estaacuten dirigido a esa temaacutetica


48

35 Modelo de negocio

Dada la arquitectura del proyecto existen varios modelos de negocio en este proyecto que se

desglosan de la siguiente forma

351 Comunidad Open Source (Hypotesis Open)

Este es un modelo de negocio basado en la creacioacuten de una comunidad de coacutedigo libre para

desarrolladores Es un modelo sin aacutenimo de lucro pero que aporta prestigio conocimiento y

experiencia al creador del proyecto y a los desarrolladores colaboradores de la comunidad

La creacioacuten de un proyecto de esta envergadura supone alcanzar unas competencias de gestioacuten de

proyectos y tecnoloacutegicas que son muy valoradas en el aacutembito laboral por lo que el verdadero objetivo

seraacute utilizar este desarrollo para mejorar el curriacuteculo profesional

Los desarrolladores de una comunidad de coacutedigo abierto aprenden de forma colaborativa y

cooperativa utilizando las mejores praacutecticas de desarrollo y el trabajo en equipo

352 Empresas u organismos del sector educativo (Hypotesis Manager)

El proyecto final alojado en los repositorios de GitHub seraacute consumido directamente por los organismos

o empresas responsables de implementar la infraestructura de la plataforma tanto en sus instalaciones

fiacutesicas como en plataformas cloud como AWS GCP o Azure

Estos organismos puacuteblicos o privados dispondraacuten de la base de su plataforma gracias a Hypotesis y

podraacuten adaptarla mediante evolutivos moacutedulo o conexioacuten con API de terceros

Estas entidades seraacuten las responsables y las maacutes interesadas en potenciar el uso de la comunidad

creacioacuten de nuevas funcionalidades y su mantenimiento

Esta red de distribuidores o partners ofreceraacuten a sus clientes servicios bajo demanda con arquitectura

multi-tenant pudiendo escalar esos aplicativos seguacuten la demanda y tamantildeo de sus necesidades

Los partners igualmente seraacuten los encargados de realizar las campantildeas de marketing y promocioacuten

de sus plataformas para captar instituciones educativas interesadas en este proyecto


49

353 Universidades colegios institutos escuelas o departamentos de recursos humanos (Hypotesis Pro amp Hypotesis School)

El nivel inferior del modelo de negocio seraacuten las universidades colegios institutos escuelas o

departamentos de recursos humanos que no dispongan de los medios o conocimientos necesarios

para la puesta en produccioacuten de la plataforma

Estas instituciones contrataran los servicios bajo demanda de los distribuidores de Hypotesis

bull Puesta en marcha El distribuidor cobraraacute (si lo ve necesario) la configuracioacuten y

personalizacioacuten de la plataforma para que la institucioacuten pueda gestionar sus recursos

educativos Para esto seraacute necesario la creacioacuten de un tema corporativo y configurar los

moacutedulos y servicios web para ajustarse a las necesidades de negocios Igualmente podraacute

desarrollar moacutedulos para incorporar loacutegica propia del negocio e integrar aplicaciones de

terceros demandadas por el cliente

bull Pago mensual de mantenimiento El distribuidor podraacute cobrar tambieacuten un canon por la

utilizacioacuten de la plataforma en base a soporte 247 y monitorizacioacuten de los servicios

contratados Este pago podraacute compensarse si asiacute lo decide el distribuidor por el pago por

usuario matriculado

bull Pago por usuario matriculado La forma de pago maacutes utilizada seraacute la de pago por usuario

matriculado en un curso Esto significa que el cliente solo pagaraacute al distribuidor si su negocio

funciona y dispone de matriculaciones

354 Escuela de Programacioacuten (Hypotesis Code)

Con el fin de poner en marcha el primer proyecto de la plataforma se potenciaraacute la escuela de

programacioacuten Hypotesis Code donde los alumnos podraacuten aprender cualquier lenguaje de

programacioacuten o tecnologiacutea relacionada con el desarrollo de aplicaciones o gestioacuten de redes

El modelo de negocio de esta plataforma seraacute la venta de grados masters o cursos online mediante

pago por tarjeta Durante la primera fase de la puesta en produccioacuten de este proyecto se iraacuten creando

cursos de programacioacuten de nivel baacutesico Maacutes adelante se iraacuten contratando profesores colaboradores

creadores y editores de contenido que iraacuten cobrando seguacuten la matriculacioacuten de los alumnos o de la

creacioacuten de contenido pedagoacutegico o multimedia


50

Figura 22 Diagrama modelo de negocio


51

36 Estrategia de marketing

Cada modelo de negocio dispone de una estrategia de marketing diferente que estaacute adecuada a sus

caracteriacutesticas y objetivos de promocioacuten

361 Hypotesis Open para desarrolladores

La estrategia de marketing para dar a conocer la comunidad de coacutedigo libre de desarrolladores

Hypotesis Open es la siguiente

- Target o puacuteblico objetivo

o Programadores Backend Python o PHP (18-60 antildeos)

o Programadores Frontend Javascript (14-50 antildeos)

o Administradores de redes y sistemas (20-65 antildeos)

o Expertos pedagoacutegicos (20-80 antildeos)

- Campantildeas

o Youtube Creacioacuten del canal en Youtube para dar a conocer la comunidad con videos

demostrativos y formacioacuten en pequentildeas piacuteldoras

o Meetup Creacioacuten de grupo en donde se informaraacute de las uacuteltimas novedades y se

organizaraacuten eventos online o presenciales

o LinkedIn Creacioacuten de perfil para informar de la comunidad a los profesionales

o Otras redes sociales creacioacuten de perfiles en Facebook o Twitter para informar sobre

la comunidad

o Foros online recopilacioacuten de los foros maacutes populares de desarrolladores y e-learning

para crear hilos y opiniones que esteacuten vinculados a la comunidad open source

o Commit Conferencia en encuentros como Commit 2020

362 Hypotesis Manager para empresas u organismos

Esta estrategia tiene como objetivo encontrar empresas o grandes organismos para que se conviertan

en distribuidores de la plataforma y la implementen en sus servidores para dar servicios a otros clientes

o directamente a sus propios usuarios


o Empresas del sector tecnoloacutegico educativo

o Grandes organismos que dispongan de medios para su total implementacioacuten

Instituciones educativas

Ministerios o consejeriacuteas


52

Grandes corporaciones o empresas

- Campantildeas

o Youtube Creacioacuten de un canal para dar a conocer las caracteriacutesticas de la plataforma

o LinkedIn Creacioacuten de perfil para informar de las caracteriacutesticas de la plataforma y sus

novedades

o Commit Creacioacuten de conferencias para dar a conocer la plataforma

o Eventos Asistencia a encuentros o ferias del sector tanto como expositor como de

visitantes

o Presencial Reuniones con instituciones o empresas del sector para dar a conocer la

plataforma

363 Hypotesis School para instituciones educativas

La estrategia de este producto seraacute la de buscar escuelas que quieran utilizar el portal Hypotesis

School y el panel de control Hypotesis Pro Los responsables de estas estrategias deberaacuten ser los

partners o distribuidores


o Organismos puacuteblicos

Para la formacioacuten de sus empleados

Para la formacioacuten a ciudadanos (Ej Instituto de empleo)

o Empresas

Formacioacuten de los empleados

Punto de encuentro para integrar las sinergias de conocimiento corporativo

o Universidades puacuteblicas y privadas

o Institutos de negocios

o Colegios e institutos privados y puacuteblicos

o Escuelas privadas

Informaacutetica

Autoescuelas

Idiomas

Apoyo a primaria y secundaria

- Campantildeas o Youtube canales para dar a conocer sus propias plataformas utilizando Hypotesis

o LinkedIn cuentas para dar a conocer sus propias plataformas

o Eventos creacioacuten de eventos o asistencia a ferias del sector

o Presencial reuniones y demostraciones del producto


53

364 Hypotesis Code para desarrolladores

La estrategia de este producto seraacute muy parecida a la de Hypotesis School pero con las

caracteriacutesticas propias de este producto enfocado a la realizacioacuten de cursos de programacioacuten online





o Maquetadores HTML5 (14-50 antildeos)

o Disentildeadores graacuteficos (14-80 antildeos)

- Campantildeas o Youtube canales para dar a conocer los cursos que incluyen piacuteldoras de formacioacuten

baacutesica de esos cursos

o LinkedIn cuentas para dar a conocer los cursos disponibles




la comunidad


para crear hilos y opiniones que esteacuten vinculados a la escuela Hypotesis Code


Tabla 4 Redes sociales y eventos en los que realizaran campantildeas de marketing


54

4 Disentildeo La plataforma estaacute desarrollada bajo los principios SOLID de la programacioacuten orientada a objetos con

la intencioacuten de minimizar el acoplamiento de sus elementos y aumentar la cohesioacuten de estos

Se ha utilizado el principio del Modelo Vista Controlador (MVC) separando exhaustivamente las capas

de datos loacutegica de negocio casos de uso y renderizado de la informacioacuten (vistas HTML o API)

Ademaacutes se ha buscado en todo momento potenciar la muacuteltiple tenencia para que los distribuidores de

la plataforma puedan ofrecer servicios personalizados y diferenciados a sus clientes bajo demanda

41 Arquitectura general de la plataforma

La plataforma se divide en tres portales con el objetivo de segurizar de forma autoacutenoma cada aplicacioacuten

dependiendo de los privilegios para realizar las funcionalidades necesarias

- Hypotesis Manager es la aplicacioacuten utilizada por los distribuidores y que tendraacute privilegios de

administrador de todos los recursos y acceso a datos Estaraacute dividida en pequentildeos servicios

que tendraacuten autonomiacutea propia y conectados por interfaz de aplicaciones bajo reglas de

habilitacioacuten CORS13

o Hypotesis Manager Autenticacioacuten y usuarios

o Hypotesis Context Escuelas grados masters cursos aulas y secciones

o Hypotesis Item Actividades y recursos

o Hypotesis Enrol Matriculacioacuten yo asignacioacuten de usuarios en los contextos

o Hypotesis DB Base de datos general del proyecto

Posibles implementaciones futuras

o Hypotesis Grade Notas de estudiantes

o Hypotesis Report Informes graacuteficos y logs de la aplicacioacuten

o Hypotesis Notification Notificaciones y noticias del campus

o Hypotesis Competence Competencias educativas relacionadas con contextos

o Hypotesis Chat Chat para las conversaciones instantaacuteneas entre usuarios

o Hypotesis Forum Foro para debates y tablones de anuncio

o Hypotesis Repository Responsable de la gestioacuten de recursos y archivos

13 CORS httpsdevelopermozillaorgesdocsWebHTTPAccess_control_CORS


55

o Hypotesis Item GC Servicio responsable de la conexioacuten y gestioacuten de Google

Classroom

o Hypotesis Item GH Servicio responsable de la gestioacuten de Google Hangouts

o Hypotesis Chat Rocket Servicio responsable de la gestioacuten de la integracioacuten de

Rocket Chat14

- Hypotesis Pro seraacute el panel de gestioacuten que se les facilitaraacute a las instituciones educativas para

la gestioacuten de sus escuelas y contenido pedagoacutegico

- Hypotesis School es el campus online donde accederaacuten profesores autores o estudiantes

Nota el objetivo final de una arquitectura de microservicios es que cada servicio disponga de su propia

base de datos pero debido al alcance de este trabajo final de grado se utilizaraacute la misma instancia

que alojaraacute las diferentes bases de datos de cada microservicio Toda la configuracioacuten del despliegue

de contenedores seraacute dinaacutemica y estaraacute preparada para un desacople en el futuro

42 Despliegue de contenedores

Todas las aplicaciones estaacuten organizadas mediante contenedores virtuales que estaacuten alojados en la

misma red virtual (VPN15) y que luego podraacute convertirse bajo el provisionamiento de infraestructura

automatizada (Terraform) en una nube virtual privada (VPC16) dentro de AWS o de cualquier otro

proveedor cloud

Para la gestioacuten de los contenedores y su despliegue se ha utilizado Docker17 el cual es un proyecto

de coacutedigo abierto creado por Solomon Hykes en 2013 Con el tiempo se ha convertido en un

estaacutendar de la virtualizacioacuten gracias a la facilidad de configuracioacuten la rapidez de despliegue y al

desacoplamiento que proporciona respecto a la maquina que lo contiene Con esta tecnologiacutea

podemos disponer de entornos completamente diferentes que utilicen libreriacuteas o plugins sin que

comprometan la seguridad ni la organizacioacuten de nuestro servidor

14 Rocket Chat httpsgithubcomRocketChatRocketChat 15 VPN httpseswikipediaorgwikiRed_privada_virtual 16 VPC httpseswikipediaorgwikiNube_privada_virtual 17 Docker httpseswikipediaorgwikiDocker_(software)


56

Dentro de la tecnologiacutea Docker hemos utilizado la funcionalidad Docker Compose para definir y

ejecutar la infraestructura mediante coacutedigo Para esto utilizamos un archivo YAML18 donde

apareceraacuten todas nuestras instancias

421 Archivo docker-composeyml

En la configuracioacuten de este archivo consta de tres secciones

version 3 services networks

La versioacuten 319 se utiliza para que Docker Compose sepa que versioacuten utilizar para la ejecucioacuten del despliegue

En el apartado service se antildeadiraacuten todos los servicios que seraacuten las instancias de cada aplicativo

Y en el apartado network estaacute configurada nuestra red privada Hypotesis VPN

422 Archivo de variables globales

Para que nuestros despliegues puedan ser automatizados con una configuracioacuten dinaacutemica

utilizaremos las variables de entorno20 Para esto hemos creado el archivo (env) basaacutendonos en un

estaacutendar muy utilizado en la comunidad de coacutedigo libre

Fragmento de coacutedigo del archivo (env)

GENERAL HYP_ENVIRONMENT=local HYP_LOCAL_IP=19216899100 HYPOTESIS VPC HYP_VPC_RANGE=172200016 HYPOTESIS DJANGO HYP_DJANGO_WORKDIR=usrsrcapp HYP_DJANGO_SERVER=0000 HYPOTESIS DB MYSQL_DATABASE=hypotesis_manager MYSQL_ROOT_PASSWORD=root

18 YAML httpseswikipediaorgwikiYAML 19 Docker Compose v3 httpsdocsdockercomcomposecompose-file 20 Variable de entorno httpseswikipediaorgwikiVariable_de_entorno


57

MYSQL_USER=hypotesis MYSQL_PASSWORD=1234 HYP_DB_PORT=3306 HYP_DB_IP=172201281 HYPOTESIS MANAGER HYP_MANAGER_WORKDIR=usrsrcapp HYP_MANAGER_PORT=8000 HYP_MANAGER_SERVER=0000 HYP_MANAGER_IP=172201282 HYP_MANAGER_SUPER_USER=admin HYP_MANAGER_SUPER_USER_EMAIL=amanzanouocedu HYP_MANAGER_SUPER_USER_PASS=12345 hellip

423 Hypotesis VPN

Todas las aplicaciones estaacuten alojadas en una red virtual privada en la nube o fiacutesica configurada

mediante grupos y directivas de seguridad con el objetivo de enjaular la plataforma ante ataques

malintencionados o accidentes

En la configuracioacuten del despliegue de contenedores todas las IP de cada instancia se configura de

forma dinaacutemica utilizando variables de entorno para facilitar la comunicacioacuten entre aplicaciones bajo la

administracioacuten de direcciones (IPAM21)

Para configurar nuestra VPN con estas caracteriacutesticas nuestro archivo docker-composeyml tendraacute

la siguiente configuracioacuten

networks hypotesis_vpc ipam config - subnet $HYP_VPC_RANGE

Dentro del paraacutemetro subnet utilizaremos un rango dinaacutemico bajo la variable de entorno

HYP_VPC_RANGE que tendraacute por defecto el valor 172200016 y que serviraacute para la puesta en

marcha de nuestra red y de nuestros contenedores

21 IPAM httpseswikipediaorgwikiGestiC3B3n_de_direcciones_de_protocolo_de_internet


58

424 Imagen Hypotesis Django

Esta aplicacioacuten estaacute creada bajo una arquitectura de microservicios conectada con interfaz de

aplicaciones de programacioacuten (API) Cada servicio puede estar creado en una tecnologiacutea diferente

pero en este trabajo final de grado todo se realizaraacute mediante la misma tecnologiacutea de servidor Por

este motivo todos los servicios de tecnologiacutea servidor heredaran la imagen Hypotesis Django

Tabla 5 Caracteriacutesticas Hypotesis Django

Tecnologiacutea Versioacuten URL

Sistema Operativo Debian Linux 83 httpswwwdebianorgdistrib

Lenguaje programacioacuten Python 383 httpswwwpythonorgdownloads

Framework Django 306 httpswwwdjangoprojectcomd

ownload

Otras libreriacuteas

Python PIP mysqlclient 146 httpspypiorgprojectmysqlclient

Python PIP Pillow 712 httpspypiorgprojectPillow

Python PIP djangorestframework 3110 httpspypiorgprojectdjangorestfra

mework

Python PIP django-filter 220 httpspypiorgprojectdjango-filter

Python PIP django-cors-headers 330 httpspypiorgprojectdjango-cors-

headers

HTML5 Bootstrap 45 httpsgetbootstrapcomdocs45get

ting-starteddownload

HTML5 jQuery 351 httpsjquerycomdownload


59

Para el despliegue de esta aplicacioacuten se ha creado una imagen lsquopadrersquo llamada Hypotesis Django

que contendraacute la tecnologiacutea necesaria para levantar un entorno con los requisitos miacutenimos para que

el framework Django pueda funcionar

Todos los contenedores que utilicen esta imagen heredaraacuten sus funcionalidades de esta forma los

evolutivos podraacuten ser autoacutenomos ya que esta configuracioacuten permite la convivencia de distintas

versiones de imaacutegenes y viacutenculos entre estos De esta forma facilitamos el mantenimiento y la

flexibilidad de nuestra plataforma

Dentro de nuestro archivo docker-composeyml se ha configurado esta imagen de la siguiente

forma

hypotesis_django build hypotesis_django container_name hypotesis_django image hypotesis_djangolatest working_dir $HYP_DJANGO_WORKDIR env_file - hypotesis_djangoenv depends_on - hypotesis_db

En el despliegue de esta imagen se utilizaraacute el archivo Dockerfile que se encuentra dentro de la

carpeta hypotesis_django con la siguiente configuracioacuten

FROM python383 LABEL maintainer=Antonio Manzano Diacuteazltamanzanoduocedugt RUN apt-get update -y RUN apt-get install python3-dev -y RUN apt-get install default-libmysqlclient-dev -y RUN apt-get install gettext -y COPY requirementstxt RUN pip install -r requirementstxt

En esta configuracioacuten podemos observar que a su vez nuestra imagen hereda la imagen oficial de

Python 383 Despueacutes actualiza el gestor de dependencias de Debian e instalamos el entorno de

desarrollo de Python y las libreriacuteas necesarias para la comunicacioacuten con MySQL

Despueacutes utilizamos el archivo requirementstxt para instalar las dependencias de Python en las que

se incluyen las siguientes libreriacuteas


60

Django==306 mysqlclient==146 Pillow==712 djangorestframework==3110 django-filter===220 django-cors-headers==330

425 Servicio Hypotesis Manager

Este servicio seraacute el encargado de las siguientes funciones

- Gestioacuten de usuarios autenticacioacuten y registro de cuentas

- Gestioacuten y conexioacuten del resto de microservicios

Y tendraacute dos tipos de salida

- Portal Manager Todas las gestiones se podraacuten realizar desde un portal de administracioacuten en

HTML en el que se ha utilizado el motor de plantillas de Django Este portal estaraacute definido

por defecto en el puerto 8000

- API REST La mayoriacutea de las funcionalidades se podraacuten realizar a traveacutes del API Manager

utilizando la siguiente nomenclatura

http192168991008000apiuserformat=json

Variables de entorno

HYPOTESIS MANAGER HYP_MANAGER_WORKDIR=usrsrcapp HYP_MANAGER_PORT=8000 HYP_MANAGER_SERVER=0000 HYP_MANAGER_IP=172201282 HYP_MANAGER_SUPER_USER=admin HYP_MANAGER_SUPER_USER_EMAIL=amanzanouocedu HYP_MANAGER_SUPER_USER_PASS=12345

Dentro de nuestro archivo docker-composeyml la configuracioacuten de este servicio es la siguiente

HYPOTESIS MANAGER hypotesis_manager restart always


61

build hypotesis_manager container_name hypotesis_manager image hypotesis_managerlatest working_dir $HYP_MANAGER_WORKDIR env_file - hypotesis_managerenv environment - HYP_LOCAL_IP=$HYP_LOCAL_IP - URL_PORT=$HYP_MANAGER_SERVER$HYP_MANAGER_PORT - MYSQL_DATABASE=$MYSQL_DATABASE - MYSQL_USER=$MYSQL_USER - MYSQL_PASSWORD=$MYSQL_PASSWORD - HYP_DB_IP=$HYP_DB_IP - HYP_DB_PORT=$HYP_DB_PORT - HYP_MANAGER_SUPER_USER=$HYP_MANAGER_SUPER_USER - HYP_MANAGER_SUPER_USER_EMAIL=$HYP_MANAGER_SUPER_USER_EMAIL - HYP_MANAGER_SUPER_USER_PASS=$HYP_MANAGER_SUPER_USER_PASS ports - $HYP_MANAGER_PORT$HYP_MANAGER_PORT volumes - hypotesis_manager$HYP_MANAGER_WORKDIR stdin_open true tty true networks hypotesis_vpc ipv4_address $HYP_MANAGER_IP depends_on - hypotesis_django - hypotesis_db

Este contenedor estaacute configurado para que siempre se reinicia con la propiedad restartalways

Configuramos los nombres de la imagen y el contenedor al igual que el directorio principal donde se

instalaraacute nuestra aplicacioacuten Se adjuntan las variables de entorno propias de este contenedor como la

IP utilizada el puerto y las credenciales de conexioacuten con la base de datos Ademaacutes se enviacutean los

datos de creacioacuten del superusuario de Django que serviraacute para la administracioacuten del panel de control

En el entorno de desarrollo se ha configurado un volumen que vincula la parte del aplicativo a una

carpeta del contenedor virtual De esta forma se podraacute desarrollar depurando el coacutedigo desde

nuestro entorno local Incluiremos nuestro contenedor dentro de la red virtual hypotesis_vpc con la

direccioacuten IP que hemos antildeadido en nuestro archivo (env)

Y por uacuteltimo antildeadimos sus dependencias que en este caso seraacuten la imagen padre hypotesis_django

y la base de datos hypotesis_db


62


carpeta hypotesis_manager con la siguiente configuracioacuten

FROM hypotesis_djangolatest LABEL maintainer=Antonio Manzano Diacuteazltamanzanoduocedugt ENV URL_PORT $URL_PORT ENV HYP_MANAGER_SUPER_USER $HYP_MANAGER_SUPER_USER ENV HYP_MANAGER_SUPER_USER_EMAIL $HYP_MANAGER_SUPER_USER_EMAIL ENV HYP_MANAGER_SUPER_USER_PASS $HYP_MANAGER_SUPER_USER_PASS COPY requirementstxt COPY deploy_djangosh RUN pip install -r requirementstxt CMD binbash deploy_djangosh $URL_PORT $HYP_MANAGER_SUPER_USER $HYP_MANAGER_SUPER_USER_EMAIL $HYP_MANAGER_SUPER_USER_PASS

Esta imagen como hemos hablado antes hereda de la uacuteltima versioacuten de hypotesis_django Despueacutes

incluimos las variables de entorno necesarias para configurar la IP y el puerto utilizados y la cuenta

del superusuario del contenedor que tendraacute los mayores privilegios del panel de administracioacuten

En cada contenedor se podraacute instalar dependencias propias de Python con el archivo

requirementstxt

Para la automatizacioacuten del despliegue y la migracioacuten de datos se ha creado el archivo ejecutable

deploy_djangosh en cada servicio

binbash echo EXECUTING DJANGO HYPOTESIS MANAGER echo Wait for DB sleep 0m 15s echo 15s sleep 0m 15s echo Running Apply database migrations echo Apply database migrations python managepy migrate --noinput Start server echo Starting server python managepy runserver $1 echo EXECUTING DJANGO END gt


63

Lo primero que hace seraacute esperar a que la base de datos se despliegue y tenga las conexiones

preparadas En el siguiente paso se ejecutaraacute la migracioacuten de Django que comprobaraacute si es

necesario actualizar o crear tablas o registros dentro de nuestro base de datos Por uacuteltimo se

ejecutaraacute el servidor de Django en la direccioacuten y puerto configurada

426 Otros servicios Django

Al igual que Hypotesis Manager existen otros servicios con una configuracioacuten muy similar por lo que

no entraremos en detalle

- Hypotesis Context

Funciones Gestioacuten de los contextos de la plataforma Instituciones Escuelas

Grados Masters Cursos Aulas o Secciones

Salida API REST


HYPOTESIS CONTEXT HYP_CONTEXT_WORKDIR=usrsrcapp HYP_CONTEXT_PORT=8001 HYP_CONTEXT_SERVER=0000 HYP_CONTEXT_IP=172201283 HYP_CONTEXT_SUPER_USER=admin HYP_CONTEXT_SUPER_USER_EMAIL=amanzanouocedu HYP_CONTEXT_SUPER_USER_PASS=12345

- Hypotesis Item

Funciones Gestioacuten de los iacutetems (recursos y actividades)

Salida API REST


HYPOTESIS ITEM HYP_ITEM_WORKDIR=usrsrcapp HYP_ITEM_PORT=8002 HYP_ITEM_SERVER=0000 HYP_ITEM_IP=172201284 HYP_ITEM_SUPER_USER=admin HYP_ITEM_SUPER_USER_EMAIL=amanzanouocedu HYP_ITEM_SUPER_USER_PASS=12345


64

- Hypotesis Enrol

Funciones Gestioacuten de la matriculacioacuten y asignacioacuten entre usuarios y contextos

Salida API REST


HYPOTESIS ENROL HYP_ENROL_WORKDIR=usrsrcapp HYP_ENROL_PORT=8003 HYP_ENROL_SERVER=0000 HYP_ENROL_IP=172201285 HYP_ENROL_SUPER_USER=admin HYP_ENROL_SUPER_USER_EMAIL=amanzanouocedu HYP_ENROL_SUPER_USER_PASS=12345

Teniendo en cuenta el alcance de este final de grado no se han incluido el resto de microservicios

dentro del piloto pero en la configuracioacuten se podriacutean antildeadir los siguientes

- Hypotesis Grade Funciones Gestioacuten de los sistemas de calificacioacuten de los alumnos en los contextos

Salida API REST

- Hypotesis Report Funciones Gestioacuten de graacuteficos logs reportes o informes de la plataforma

Salida API REST

- Hypotesis Competence Funciones Gestioacuten de las competencias educativas relacionadas con los contextos y

usuarios

Salida API REST

- Hypotesis Notification

Funciones Gestioacuten de las notificaciones noticias o eventos de la plataforma

Salida API REST

- Hypotesis Chat

Funciones Gestioacuten de las conversaciones instantaacuteneas entres usuarios y que podraacute

incorporar desarrollos ya existentes como RocketChat o Matrix

Salida API REST

- Hypotesis Forum


65

Funciones Gestioacuten de los foros de debates de la plataforma

Salida API REST

- Hypotesis Repository Funciones Gestioacuten de todos los archivos y la conectividad con otros repositorios

como S3 de AWS o Cloud Storage de GCP

Salida API REST

427 Hypotesis DB

Cada microservicio podraacute contener su propia base de datos pero en el alcance de este trabajo final

de grado solo habraacute una base de datos general que contendraacute las bases de datos de cada microservicio

de forma diferenciada para desacoplar en proacuteximas versiones

Tabla 6 Caracteriacutesticas Hypotesis DB


Sistema Operativo Ubuntu Linux 2004 httpsubuntucomdownloadserver

Lenguaje base de datos MySQL 802 httpswwwmysqlcomdownloads

Las variables de entorno utilizadas para este servicio dentro de nuestro archivo principal (env) son las siguientes

HYPOTESIS DB MYSQL_DATABASE=hypotesis_manager MYSQL_ROOT_PASSWORD=root MYSQL_USER=hypotesis MYSQL_PASSWORD=1234 HYP_DB_PORT=3306 HYP_DB_IP=172201281

Para el despliegue de la base de datos dentro de nuestro archivo docker-composeyml hemos antildeadido el siguiente servicio

HYPOTESIS DB


66

hypotesis_db build hypotesis_db container_name hypotesis_db image hypotesis_dblatest command mysqld --default-authentication-plugin=mysql_native_password environment - MYSQL_DATABASE=$MYSQL_DATABASE - MYSQL_ROOT_PASSWORD=$MYSQL_ROOT_PASSWORD - MYSQL_USER=hypotesis - MYSQL_PASSWORD=$MYSQL_PASSWORD expose - $HYP_DB_PORT ports - $HYP_DB_PORT$HYP_DB_PORT security_opt - seccompunconfined volumes - dockerprovisionhypotesis_dbdocker-entrypoint-initdbd networks hypotesis_vpc ipv4_address $HYP_DB_IP

Es necesario ejecutar el comando de mysqld para el correcto funcionamiento de la contrasentildea de

administrador Se ha configurado un volumen apuntando desde la carpeta de nuestro proyecto

(dockerprovisionhypotesis_db) a la carpeta del contenedor que ejecuta al arrancar la base

de datos En esa carpeta se incluye la creacioacuten de las diferentes bases de datos dentro de nuestro

servicio y la asignacioacuten de los privilegios para el usuario que los gestionaraacute

create databases CREATE DATABASE IF NOT EXISTS `hypotesis_manager` CREATE DATABASE IF NOT EXISTS `hypotesis_context` CREATE DATABASE IF NOT EXISTS `hypotesis_item` CREATE DATABASE IF NOT EXISTS `hypotesis_enrol` CREATE DATABASE IF NOT EXISTS `hypotesis_grade` CREATE DATABASE IF NOT EXISTS `hypotesis_report` CREATE DATABASE IF NOT EXISTS `hypotesis_competence` CREATE DATABASE IF NOT EXISTS `hypotesis_chat` CREATE DATABASE IF NOT EXISTS `hypotesis_forum` GRANT ALL ON `hypotesis_manager` TO hypotesis GRANT ALL ON `hypotesis_context` TO hypotesis GRANT ALL ON `hypotesis_item` TO hypotesis GRANT ALL ON `hypotesis_enrol` TO hypotesis GRANT ALL ON `hypotesis_grade` TO hypotesis GRANT ALL ON `hypotesis_report` TO hypotesis GRANT ALL ON `hypotesis_competence` TO hypotesis GRANT ALL ON `hypotesis_chat` TO hypotesis


67

GRANT ALL ON `hypotesis_forum` TO hypotesis

Por uacuteltimo nuestra base de datos estaraacute alojada en nuestra VPN con una direccioacuten dinaacutemica seguacuten

se configure


carpeta (hypotesis_db) con la siguiente configuracioacuten

FROM mysql8019

En este caso nuestro contenedor se construiraacute directamente de la imagen oficial de MySQL en su

versioacuten 8019

428 Imaacutegenes Hypotesis Vue

Las aplicaciones frontales se han desarrollado en un entorno NodeJS y utilizando la libreriacutea VueJS

con las siguientes caracteriacutesticas

Tabla 7 Caracteriacutesticas Hypotesis Vue



Lenguaje programacioacuten Javascript ECMAScript

2019 httpstc39esecma262

Servidor Web NginX 11312 httpnginxorgendownloadhtml

Entorno de ejeuccioacuten Node Js 12163 httpsnodejsorges

Framework Vue JS 2611 httpsvuejsorgv2guideinstallati

onhtml


NPM axios 0192 httpswwwnpmjscompackage

axios


68

NPM bootstrap 450 httpswwwnpmjscompackage

bootstrap

NPM bootstrap-vue 2150 httpswwwnpmjscompackage

bootstrap-vue

NPM vue-router 320 httpswwwnpmjscompackage

vue-router

NPM vuex 340 httpswwwnpmjscompackage

vuex

NPM DEV sass 1265 httpswwwnpmjscompackage

sass

En este caso no ha sido necesario crear una imagen padre que sea compartida por los diferentes

frontales

429 Hypotesis Pro

Esta aplicacioacuten seraacute utilizada por las instituciones pedagoacutegicas para gestionar sus aulas cursos y

usuarios Esta diferenciada del campus para aplicar medidas de seguridad maacutes restrictivas tanto en

direcciones IP como en autenticacioacuten de los usuarios


HYPOTESIS PRO HYP_PRO_WORKDIR_BUILD=app HYP_PRO_WORKDIR_PRO=varwwwhtml HYP_PRO_PORT=80 HYP_PRO_SERVER=0000 HYP_PRO_IP=172201286


hypotesis_pro build hypotesis_pro container_name hypotesis_pro image hypotesis_prolatest working_dir $HYP_PRO_WORKDIR_BUILD environment - NODE_ENV=production - HYP_MANAGER_URL=$HYP_MANAGER_SERVER$HYP_MANAGER_PORT - HYP_CONTEXT_URL=$HYP_CONTEXT_SERVER$HYP_CONTEXT_PORT - HYP_ITEM_URL=$HYP_ITEM_SERVER$HYP_ITEM_PORT


69

- HYP_ENROL_URL=$HYP_ENROL_SERVER$HYP_ENROL_PORT env_file - hypotesis_proenv ports - $HYP_PRO_PORT$HYP_PRO_PORT volumes - hypotesis_pronginxconfetcnginxnginxconf - hypotesis_prodefaultconfetcnginxconfddefaultconf stdin_open true tty true depends_on - hypotesis_manager - hypotesis_context - hypotesis_enrol - hypotesis_item

Este servicio dependeraacute de la creacioacuten de los servicios hypotesis_manager y de los diferentes

microservicios que esteacuten configurados Se han creado dos voluacutemenes para la configuracioacuten del

servidor web de Nginx y que puedan ser configurados desde nuestro entorno de desarrollo En

produccioacuten estos archivos no estaraacuten vinculados


carpeta (hypotesis_manager) con la siguiente configuracioacuten

Etapa de compilacioacuten FROM node12-alpine310 as build-stage WORKDIR app COPY packagejson RUN npm install RUN npm cache clean --force ENV HYP_MANAGER_URL $HYP_MANAGER_URL ENV HYP_CONTEXT_URL $HYP_CONTEXT_URL ENV HYP_ITEM_URL $HYP_ITEM_URL ENV HYP_ENROL_URL $HYP_ENROL_URL COPY RUN npm run build Etapa de produccioacuten FROM nginx11312-alpine as production-stage COPY --from=build-stage appdist varwwwhtml RUN chown -R nginxnginx varwwwhtml EXPOSE 80 CMD [nginx -g daemon off]


70

Para el despliegue se ha configurado la creacioacuten de dos imaacutegenes una para la etapa de compilacioacuten

y otra para la etapa de puesta en marcha

El contenedor de compilacioacuten estaraacute basado en una imagen oficial de Node en Docker y se

encargaraacute de copiar el archivo packajejson y utilizado para la instalacioacuten de las dependencia con

NPM Por uacuteltimo se copiaraacute el proyecto dentro del directorio de trabajo y se ejecutaraacute la compilacioacuten

de este con el comando (npm run build)

Dentro del archivo packagejson se incluiraacuten las dependencias utilizadas y el comportamiento del

aplicativo

name hypotesis_pro version 010 private true scripts serve vue-cli-service serve build vue-cli-service build lint vue-cli-service lint dependencies axios ^0192 bootstrap ^450 bootstrap-vue ^2150 core-js ^365 vue ^2611 vue-axios ^215 vue-router ^320 vuex ^340 devDependencies vuecli-plugin-babel ~440 vuecli-plugin-eslint ~440 vuecli-plugin-router ~440 vuecli-plugin-vuex ~440 vuecli-service ~440 babel-eslint ^1010 eslint ^672 eslint-plugin-vue ^622 sass ^1265 sass-loader ^802 vue-template-compiler ^2611


71

Despueacutes de la compilacioacuten se crearaacute un contenedor mediante la imagen oficial de NginX en Docker

Se copiaraacuten los archivos creados en el contenedor de compilacioacuten a la carpeta del aplicativo Se

daraacuten los permisos necesarios al usuario de NginX para la ejecucioacuten de la aplicacioacuten Y por uacuteltimo se

ejecutaraacute NginX utilizando el archivo (nginxconf) vinculado al volumen de este contenedor

4210 Hypotesis School

Seraacute la aplicacioacuten utilizada por los usuarios finales como profesores autores o estudiantes Estaraacute

abierta a todo internet o si fuera el caso a una intranet corporativa La tecnologiacutea utilizada seraacute la misma

que Hypotesis Pro pero al estar diferenciada podraacute ir incorporando nuevas versiones de frameworks

o libreriacuteas

La configuracioacuten es muy similar a Hypotesis Pro con las siguientes variables de entorno

HYPOTESIS SCHOOL HYP_SCHOOL_WORKDIR_BUILD=app HYP_SCHOOL_WORKDIR_PRO=varwwwhtml HYP_SCHOOL_PORT=81 HYP_SCHOOL_SERVER=0000 HYP_SCHOOL_IP=172201287

43 Hypotesis API

Todos los microservicios tendraacuten su propia API REST para ser consumida por Hypotesis Core y

ademaacutes habraacute una aplicacioacuten que se encargaraacute de poner a disposicioacuten de los clientes las

funcionalidades necesarias para que estos lo integren en sus propias herramientas

Debido al alcance de este proyecto no se ha podido implementar un API Manager que utiliza

tecnologiacutea de colas o tecnologiacutea de lenguaje de consulta como Graphql22 pero es recomendable su

implementacioacuten futura

Para segurizar el entorno y la plataforma un proyecto que habraacute que acometer en el futuro seraacute un

sistema de autenticacioacuten y autorizacioacuten de usuarios y aplicaciones que consuman el API Para esto

se ha pensado en la implementacioacuten del sistema oAuth223 En el alcance de este trabajo de final de

grado no se ha considerado su integracioacuten

22 GraphQl httpsmediumcomjmz12que-es-graphql-bf835e55960 23 oAuth2 httpswwwdigitaloceancomcommunitytutorialsuna-introduccion-a-oauth-2-es


72

Para el desarrollo se ha utilizado la herramienta PostMan para la realizacioacuten de pruebas y

configuracioacuten de las API Se adjunta en los anexos de este documento la configuracioacuten de cada

servicio

Para seguir un estaacutendar de respuesta se ha implementado el siguiente patroacuten que utilizaran todos

los servicios web de la plataforma

bull Respuesta correcta (Coacutedigos de estado 2XX)

success true message Peticioacuten correcta error_code null error null data username amanzanod is_visible true state alias active name Activo description null picture profileamanzanodpng name Antonio surname1 Manzano surname2 Diacuteaz title Creador Multimedia email amanzanoduocedu city Pinto province code 28 name Madrid original_name Madrid country code ES name Espantildea original_name Espantildea address Calle Mayor 34 portal 4ordm C postal_code 28343 language code es name Espantildeol about_me role alias author


73

name Autor state active is_visible true icon user-edit description null created_at 2020-06-02 174019 updated_at 2020-06-02 174019 permissions [] created_at 2020-06-02 174020 updated_at 2020-06-02 213252

bull Respuesta incorrecta (Coacutedigos de estado 4XX y 5XX)

success false message NOT_FOUND error_code 40401 error No se ha encontrado el recurso buscado data

Dentro de la respuesta de error se utilizan coacutedigos de error propios para que los usuarios que

consuman el servicio web puedan saber queacute ha ocurrido

431 Configuracioacuten CORS para la comunicacioacuten Django y Vue

En esta infraestructura se ha dividido la tecnologiacutea de servidor y la tecnologiacutea de cliente en maacutequinas

diferencias con tecnologiacutea desacoplada Esto supone que las aplicaciones creadas en Vue se

conectaraacuten mediante tecnologiacutea AJAX24 a un servidor diferente bajo tecnologiacutea Django

Para permitir el intercambio de informacioacuten entre servidores se ha instalado la libreriacutea django-cors-

headers y dentro del archivo settingspy de nuestras aplicaciones Django se ha antildeadido la

siguiente configuracioacuten

CORS_ORIGIN_WHITELIST = [ httplocalhost8080 osenvironget(HYP_LOCAL_IP ) ]

24 AJAX httpseswikipediaorgwikiAJAX


74

44 Arquitectura de la informacioacuten y diagramas de navegacioacuten

En este proyecto se ha realizado un proceso de arquitectura de la informacioacuten para disentildear de forma

estructura y etiquetada la informacioacuten que se va a compartir con el objetivo de facilitar de este modo

la buacutesqueda y la navegacioacuten de los roles de usuario en un contexto determinado

Para el disentildeo de las interfaces me he basado en la perspectiva del disentildeo centrado en el usuario y teniendo en cuenta las caracteriacutesticas del sector educativo Con este propoacutesito se realizoacute un primer

anaacutelisis de los contenidos para recabar toda la informacioacuten y datos que se queriacutean incluir en esta

primera fase que incluye el alcance del trabajo de final de grado Esa informacioacuten se dividioacute buscando

la atomizacioacuten de los contenidos hasta conseguir una granularidad adecuada y coherente

Todos estos elementos se fueron agrupando en etiquetas categorizadas para proporcionales significado y distincioacuten

441 Aacuterbol de contenidos de Hypotesis School

Figura 23 Aacuterbol de contenidos de Hypotesis School

Mis cursos

Escuela Comuacuten


75

45 Disentildeo graacutefico e interfaces

Para la realizacioacuten de este proyecto se ha creado una nueva imagen corporativa que seraacute utilizada

por las diferentes entidades del proyecto

En cuanto al disentildeo de interfaces se han desarrollado dos disentildeos diferenciados para los portales

Hypotesis PRO e Hypotesis School

Se ha realizado una investigacioacuten de las uacuteltimas tendencias en usabilidad y disentildeo de interfaces y se

han recopilado y adaptado ideas hasta conseguir crear un manual de identidad digital

Todo el disentildeo de HTML y JavaScript es de creacioacuten propia exceptuando el coacutedigo utilizado de las

libreriacuteas ya comentadas como Vue Bootstrap o Bootstrap

451 Logotipo Hypotesis

Figura 24 Logotipo Hypotesis modo normal e inverso con eslogan

La marca Hypotesis se basa en la palabra lsquohipoacutetesisrsquo que estaacute muy relacionada con el aacutembito

educativo

hipoacutetesis (Del lat hypothĕsis y este del gr ὑπόθεσις)

1 f Suposicioacuten de algo posible o imposible para sacar de ello una consecuencia

~ de trabajo

1 f hipoacutetesis que se establece provisionalmente como base de una investigacioacuten que puede confirmar

o negar la validez de aquella

Respecto a la parte graacutefica el icono estaacute basado en dos ideas diamante y cima

El diamante se relaciona con las siguientes palabras lujo prestigio belleza y pureza

La cima estaacute relacionada con las siguientes palabras cenit cumbre objetivo y cuacutespide


76

Figura 25 Origen del logotipo Hypotesis (Imaacutegenes httpspixabaycom )

452 Tipografiacuteas utilizadas

bull Montserrat o Google Fonts (httpsfontsgooglecomspecimenMontserrat)

o Autores Julieta Ulanovsky Sol Matas Juan Pablo del Peral y Jacques Le Bailly

o Licencia

Open Font License (httpsscriptssilorgcmsscriptspagephpsite_id=nrsiampid=OFL)

bull Varela Round o Google Fonts (httpsfontsgooglecomspecimenVarela+Round)

o Autores Joe Prince

o Licencia


La tipografiacutea utilizada en el logotipo es Montserrat y para el eslogan se utiliza la fuente Varela Round


77

453 Eslogan

Se ha creado un eslogan para potenciar la marca que intenta mezclar en una frase el propoacutesito de la

automatizacioacuten de despliegues y el objetivo de facilitar el aprendizaje de los usuarios se puede

utilizar tanto en espantildeol como en ingleacutes

454 Colores

Estos son los colores utilizados para la imagen corporativa de la marca Hypotesis

Tabla 8 Colores corporativos

Nombre Descripcioacuten Hex RGB

Turquesa Color principal 66A6AF (102 166 175)

Agua Marina Color secundario CCE8EB (204 232 235

Cerceta Color terciario 1A5B64 (26 91 100)

Plomo Color apoyo 706F6F (112 111 111)

Antracita Color fondo 373737 (55 55 55)

Bistre Color contraste 877D60 (135 125 96)

455 Logotipos submarcas

Las diferentes submarcas conviven dentro la misma simbiosis corporativa con leves diferencias

Figura 26 Logotipo Hypotesis Open


78

Figura 27 Logotipo Hypotesis Manager

Figura 28 Logotipo Hypotesis Pro

Figura 29 Logotipo Hypotesis School

Figura 30 Logotipo Hypotesis Code


79

456 Manual corporativo digital

Tipografiacutea

- Tiacutetulo H1

Montserrat 25px 600 727475

- Tiacutetulo H2


- Tiacutetulo H3


- Paacuterrafo

Valera Round 15px 300 A3A3A3

Botones

- Botoacuten de accioacuten

Montserrat 16px 300 FFFFFF

66A6AF padding 14px 28px border-radius 10px

- Botoacuten secundario


877D60 padding 14px 28px border-radius 10p


80

- Botoacuten deshabilitado



- Botoacuten de crear


66A6AF padding 14px 28px border-radius 10p

- Botoacuten de cancelar


9C9C9C padding 14px 28px border-radius 10p

- Texto hiperviacutenculo

Montserrat 16px 300 9C9C9C text-decoration

Formularios

- Caja de texto


C1C1C1 padding 14px 28px border-radius 10p

- Opciones


81



- Fecha



- Selector


- Adjuntar archivo



Modales

Modal informativo


82

Modal de confirmacioacuten o cancelacioacuten

Modal de error

Tabla


83

Calendario

Etiquetas y enlaces

Video

Cartas


84

46 Disentildeo de interfaces

461 Prototipo Hi-Fi Hypotesis PRO

Interfaz 1 Hypotesis Pro - Login

Interfaz 2 Hypotesis Pro ndash Usuarios


85

Interfaz 3 Hypotesis Pro - Crear Usuario

Interfaz 4 Hypotesis Pro - Roles


86

Interfaz 5 Hypotesis Pro ndash Permisos

Interfaz 6 Hypotesis Pro - Asignar permisos a roles


87

Interfaz 7 Hypotesis Pro ndash Contextos

Interfaz 8 Hypotesis Pro - Grados


88

Interfaz 9 Hypotesis Pro ndash Masters

Interfaz 10 Hypotesis Pro ndash Cursos


89

Interfaz 11 Hypotesis Pro ndash Matriculacioacuten

Interfaz 12 Hypotesis Pro ndash Categoriacuteas


90

Interfaz 13 Hypotesis Pro - Aulas


91

462 Prototipo Hi-Fi Hypotesis School vista profesor

Interfaz 14 Hypotesis School ndash Login

Interfaz 15 Hypotesis School - Profesor - Inicio


92

Interfaz 16 Hypotesis School - Profesor - Perfil

Interfaz 17 Hypotesis School - Profesor - Mis Cursos


93

Interfaz 18 Hypotesis School - Profesor - Mis Aulas

Interfaz 19 Hypotesis School - Profesor ndash Curso ndash Crear


94

Interfaz 20 Hypotesis School - Profesor ndash Curso

Interfaz 21 Hypotesis School - Profesor - Curso ndash Itinerario


95

Interfaz 22 Hypotesis School - Profesor - Curso - Itinerario ndash Edicioacuten

Interfaz 23 Hypotesis School - Profesor - Curso - Itinerario ndash Colapsado


96

Interfaz 24 Hypotesis School - Profesor - Curso ndash Seccioacuten

Interfaz 25 Hypotesis School - Profesor - Entregable ndash Crear


97

Interfaz 26 Hypotesis School - Profesor ndash Entregable

Interfaz 27 Hypotesis School - Profesor ndash Viacutedeo


98

Interfaz 28 Hypotesis School - Profesor ndash Aula

Interfaz 29 Hypotesis School - Profesor - Aula - Notas


99

463 Prototipo Hi-Fi Hypotesis School vista estudiante

Interfaz 30 Hypotesis School - Estudiante - Inicio

Interfaz 31 Hypotesis School - Estudiante - Mi Perfil


100

Interfaz 32 Hypotesis School - Estudiante - Mis Cursos

Interfaz 33 Hypotesis School - Estudiante - Curso ndash Portada


101

Interfaz 34 Hypotesis School - Estudiante - Curso ndash Itinerario

Interfaz 35 Hypotesis School - Estudiante - Curso - Itinerario ndash Colapsado


102

Interfaz 36 Hypotesis School - Estudiante - Curso ndash Seccioacuten

Interfaz 37 Hypotesis School - Estudiante ndash Curso - Seccioacuten - Ver comentario


103

Interfaz 38 Hypotesis School - Estudiante ndash Entregable

Interfaz 39 Hypotesis School - Estudiante ndash Viacutedeo


104

5 Implementacioacuten 51 Entorno de desarrollo integrado (IDE)

Para el desarrollo de las aplicaciones he utilizado las herramientas de programacioacuten de la empresa

checa JetBrains bajo licencia de estudiante

bull PyCharm Para aplicaciones Python como son las desarrolladas en Django

bull WebStorm Para aplicaciones HTML5 y JavaScript como son las desarrolladas en Vue 2

Ambas aplicaciones soportan la utilizacioacuten de Git y Docker gracias a la utilizacioacuten de plugins

especiacuteficos para estos lenguajes

52 Control de versiones

El proyecto estaacute realizado bajo el protocolo de control de versiones GIT25 y alojado en el portal GitHub

Por lo que para descargarse el proyecto hay que instalar Git

bull Repositorio GitHub httpsgithubcomamanzanodhypotesis

bull Descarga de Git httpsgit-scmcomdownloads

bull Versioacuten 2262

bull Cuando tengamos instalado Git desde la consola Git Bash nos descargamos el proyecto

con el siguiente comando de clonar

git clone httpsgithubcomamanzanodhypotesisgit

25 Git httpseswikipediaorgwikiGit


105

53 Docker Compose

El proyecto estaacute construido sobre contenedores Docker que son instancias virtualizadas de un sistema

operativo dentro de nuestra maacutequina local Por otra parte utilizamos Docker Compose para

automatizar el despliegue de todas las aplicaciones que componen el proyecto las redes variables de

entorno y otras configuraciones necesarias

bull Versioacuten de Docker 1903 para Windows

bull Descarga de Docker httpswwwdockercomproductsdocker-desktop

bull Descarga de Docker para Windows Home httpsdocsdockercomdocker-for-windowsinstall-

windows-home

Aunque por defecto el entorno local en Docker seraacute lsquolocalhostrsquo si utilizamos Windows 10 Home y

tenemos instalado Docker bajo Virtual Box tenemos que comprobar antes cual es la direccioacuten que

utiliza la maacutequina de Docker con el siguiente comando en la consola

docker-machine ip default

Y por lo tanto tendremos que utilizar la IP que nos aparezca tanto en nuestro navegador como en la

configuracioacuten de nuestro archivo (env) en la propiedad

GENERAL HYP_ENVIRONMENT=local HYP_LOCAL_IP=19216899100

Debemos asegurarnos de que todos los puertos estaacuten disponibles y habilitados

Con Docker instalado y comprobado su configuracioacuten nos dirigimos a la carpeta donde hemos clonado

el repositorio de Hypotesis y ejecutamos el siguiente comando para poner en marcha las aplicaciones

docker-compose up hypotesis


106

Y para probar en nuestro equipo que ya tenemos en marcha la plataforma Hypotesis en nuestro entorno

local nos vamos al navegador y ejecutamos la siguiente URL (cambiando el host seguacuten la IP de la

maacutequina de Docker)

localhost8000 HYPOTESIS MANAGER localhost8001 HYPOTESIS CONTEXT localhost8002 HYPOTESIS ITEM localhost8003 HYPOTESIS ENROL localhost80 HYPOTESIS PRO localshot81 HYPOTESIS SCHOOL

54 Requisitos e instrucciones de instalacioacuten

Para que se puedan desplegar todas las instancias tanto de Django y VueJS como las imaacutegenes

originales debemos cumplir los siguientes requisitos recomendados en el entorno local o de desarrollo

donde vayamos a desplegar la plataforma

o Linux o Windows Server

o Procesador de cuatro nuacutecleos 20 GHz

o Memoria RAM de 8 GB + Disco duro de 20GB

o Es necesario tener Docker instalado en su versioacuten 1903

541 Entorno local de desarrollo

Con la configuracioacuten de los voluacutemenes compartidos en nuestro archivo de Docker-Compose

dispondremos de un viacutenculo entre el directorio de trabajo de la instancia y nuestro local y de esta

forma cualquier cambio que realicemos en la carpeta local de nuestro aplicativo se veraacute reflejado en

los contenedores Despueacutes del despliegue de las instancias con Docker Compose podemos acceder

a ellas con el siguiente comando

docker exec -it hypotesis_manager bash

En Windows posiblemente tengamos que utilizar el comando winpty

winpty docker exec -it hypotesis_manager bash

Para acceder a las maacutequinas de Node utilizaremos ash en lugar de bash

docker exec -it hypotesis_pro ash

Desde alliacute podremos navegar por la instancia y poder realizar pruebas o cambios


107

542 Entornos remotos de desarrollo y produccioacuten

Debido al alcance del proyecto y las fechas de entrega no se ha considerado realizar un entorno de

desarrollo o de produccioacuten remoto para dar maacutes valor al despliegue comunicacioacuten y convivencia entre

contenedores

A pesar de esto este proyecto estaacute enfocado a la flexibilidad del despliegue facilitando la instalacioacuten

en remoto en dos formas

Todo en uno (Desarrollo) Una sola maacutequina remota seraacute la encargada de alojar el proyecto

Esta maacutequina deberaacute tener instalado Docker y desde alliacute se ejecutaraacute Docker Compose para

construir toda la infraestructura del proyecto Esto es ideal para un entorno de desarrollo

Instancia por maacutequina (Produccioacuten) Si lo que necesitamos es sacar el maacuteximo rendimiento

y aprovechar las ventajas de la arquitectura de microservicios cada servicio tendraacute que

instalarse en una maacutequina diferente Toda la configuracioacuten de las variables de entorno nos

permitiraacuten comunicar nuestras maacutequinas dentro de una misma red virtual en la nube Para este

tipo de desarrollo es recomendable entornos como Amazon Web Services Azure o Google

Cloud Platform

543 Despliegue en Integracioacuten Continua

Tal y coacutemo hemos comentado anteriormente el proyecto tiene un alcance limitado y no se ha creado

un prototipo de instalacioacuten de despliegues de Integracioacuten Continua (CI26) y Desarrollo Continuo (CD27)

Para este tipo de despliegues se podraacute utilizar herramientas como Jenkins28 o Pipelines29 Con estas

herramientas se podraacuten automatizar las subidas a los entornos remotos de Desarrollo o Produccioacuten y

facilitar de esta forma la creacioacuten de los contenedores su alojamiento y su puesta en funcionamiento

Por su parte para la automatizacioacuten de la creacioacuten de maacutequinas virtuales en entornos Cloud se podraacute

utilizar Terraform30 que nos permitiraacute codificar y documentar bajo coacutedigo

Por lo tanto utilizando Docker Pipelines (Jenkins) y Terraform y disponiendo de una cuenta en un

entorno cloud como AWS podremos tener toda nuestra infraestructura automatizada bajo coacutedigo

siguiendo los principios de IaC reduciendo draacutesticamente los tiempos y costes de despliegue de

nuestra plataforma

26 Integracioacuten continua httpsawsamazoncomesdevopscontinuous-integration 27 Desarrollo continuo httpsawsamazoncomesdevopscontinuous-delivery 28 Jenkins httpswwwionosesdigitalguidepaginas-webdesarrollo-webjenkins-tutorial 29 Pipelines httpssdosesblogla-integracion-continua-actual-pasa-por-pipelines 30 Terraform httpswwwparadigmadigitalcomdevterraform-la-navaja-suiza-dominar-todos-los-iaas


108

6 Demostracioacuten 61 Prototipo interactivo Adobe XD

Toda la maquetacioacuten de las interfaces se ha disentildeado a traveacutes de Adobe XD utilizando el modo

prototipo y animando todos los flujos en esta aplicacioacuten para asiacute reducir los costes de desarrollo y

maquetacioacuten HTML y JavaScript Dentro de los anexos de este trabajo final de grado se adjuntan los

archivos para su visualizacioacuten e interaccioacuten

Figura 31 Pantallazo de la aplicacioacuten Adobe XD en su modo Prototipo

Figura 32 Pantallazo de la aplicacioacuten Adobe XD con los flujos de las pantallas


109

611 Prototipo entorno Local




Figura 33 Ejecucioacuten de Docker Compose

Los contenedores se iraacuten creando por orden de dependencia y al final tendremos todas las

imaacutegenes y contenedores creados Para ver las imaacutegenes podemos ejecutar el siguiente comando

docker images

Figura 34 Visualizacioacuten de las imaacutegenes creadas

Dentro de este listado apareceraacuten tanto las imaacutegenes que hemos creado para nuestra plataforma

como las imaacutegenes de las que heredan como MySQL Node o Python


110

Y para comprobar los contenedores podemos ejecutar

docker container ls

Figura 35 Visualizacioacuten del listado de contenedores en funcionamiento

Figura 36 Detalle del listado de contenedores en funcionamiento

En este listado podremos comprobar que se han ejecutado correctamente y los puertos que tienen

expuestos como es el caso del frontal Hypotesis Pro en el puerto 80 o el contenedor de base de datos

en el puerto 3306

Para acceder a un contenedor ejecutamos el siguiente comando (seraacute necesario utilizar winpty en

Windows)


Y de esta forma estaremos dentro del directorio de trabajo de nuestro contenedor

Finalmente para acceder al portal de Hypotesis Pro vamos al navegador y ejecutamos la siguiente

direccioacuten localhost80 (19216899100 en el caso de Windows Home)


111

7 Conclusiones y liacuteneas de futuro 71 Conclusiones

En este trabajo final de grado he querido poner en praacutectica todos los conocimientos aprendidos y

potenciado durante todo el Grado Multimedia El plan de estudio de este grado es muy amplio y abarca

una gran cantidad de conocimientos y tecnologiacutea y aunque no profundiza a nivel teacutecnico igual que

otros grados como Informaacutetica o Telecomunicaciones he podido comprobar que abarca un proyecto

desde la recogida de requisitos hasta su puesta en produccioacuten gestionando o creando tanto el disentildeo

la creacioacuten de contenidos o la configuracioacuten y desarrollo de las aplicaciones

Durante mi larga vida laboral he trabajado en diferentes campos de la creacioacuten y gestioacuten de contenidos

para el aprendizaje electroacutenico y he querido aplicar todos los conocimientos adquiridos en es

experiencia laboral junto con los aprendidos durante el grado Durante este tiempo he podido

comprobar las carencias de los actuales LMS y en mi opinioacuten durante este TFG he puesto sobre la

mesa una liacutenea de negocio diferenciada y con recorrido

Uno de los principales objetivos que tuve al iniciar este proyecto era poder aprender e investigar las

metodologiacuteas y tecnologiacuteas maacutes flexibles y potentes utilizadas hoy en diacutea y este fue el motivo para

elegir la creacioacuten un proyecto LMS bajo metodologiacutea devops Durante la realizacioacuten del proyecto he

realizado continuas investigaciones y he realizado cursos online y visualizado una gran cantidad de

videotutoriales Este hecho me abre las puertas de un gran abanico de conocimientos para poder guiar

mi perfil a esta especializacioacuten

En resumen este trabajo final de grado ha servido para organizar todo el conocimiento adquiridos

comprobar y validar las competencias superadas y ante todo marcar una guiacutea de futuro en mis

ambiciones laborales y formativas Con la realizacioacuten de este proyecto se abre un abanico inmenso de

posibilidades de aprendizaje y el proyecto miacutenimo viable que he realizado seraacute una base importante

en el futuro puesto que son miles las ideas que surgen para su implementacioacuten

72 Liacuteneas de futuro

Este proyecto no solo estaacute enfocado solo como un LMS sino como un marco de trabajo para la

implementacioacuten de nueva tecnologiacutea o la integracioacuten de otros recursos y herramientas El proyecto

open source alojado en GitHub se va a convertir en un entorno de pruebas y aprendizaje en el que

espero que se una maacutes desarrolladores con motivacioacuten de aprender y cooperar en la formacioacuten global

Dado el alcance de este trabajo no se podriacutean implementar todas las ideas y funcionalidades

deseadas pero desde aquiacute invito a todos a ir mejorando el proyecto


112

721 Listado de mejoras a implementar en el futuro

Estas son algunas de las mejoras o evolutivos a implementar en el futuro

Implementacioacuten de protocolo HTTPS

Microservicios

o Grade Notas de alumnos en iacutetem cursos master o grados

o Notification Notificaciones a usuarios o grupos

Emails Notificaciones por email

WebSockets Notificaciones en directo mediante alertas

o News Tabloacuten de anuncios eventos y noticias

o Report Servicio que gestione los resportes y graacuteficos estadiacutesticos

o Repository Creacioacuten de un servicio responsable de la gestioacuten de archivos

Integracioacuten con repositorios en la nube como S3 de AWS o Cloud Storage de

Google Cloud Platform

o Competence Servicio de competencias educativas dentro de los contextos a superar

por los alumnos

o Chat Servicio para la funcionalidad de Chat entre usuarios

Integracioacuten de herramientas como RocketChat o Matrix

Integracioacuten de Google ClassRoom

Nuevos iacutetems

o Actividades

Debate

SCORM

H5P

Interactivos HTML5

Videoconferencias

bull Integracioacuten de Zoom o Google Hangouts

o Recursos

Audio

Video

Archivos PDF

Paacuteginas HTML5

Adaptacioacuten a moacutevil

o Disentildeo responsivo y adaptable a cualquier dispositivo

o Configuracioacuten del manifiesto para utilizar la plataforma como aplicacioacuten

Infraestructura

o Configuracioacuten de Proxy invertido y balanceador de cargas

o Capa de cacheacute entre loacutegica y base de datos con Redis


113

o Desacoplamiento de las bases de datos

API

o Creacioacuten de un API Manager

o Autorizacioacuten con Auth2

o Implementacioacuten de GraphQ

Pruebas

o Pruebas unitarias en Django

o Marco de pruebas en VueJs con Jest o Jasmine

Monitorizacioacuten y logs de la plataforma

o Integracioacuten de un servicio de Nagios para la monitorizacioacuten de la infraestructura

o Integracioacuten de un servicio de Grafana para la visualizacioacuten graacutefica de la monitorizacioacuten

Implementacioacuten de la orquestacioacuten de contenedores con Kubernetes

Despliegues con herramientas de integracioacuten continua

o Jenkins

o Puppet

Puesta en produccioacuten en la nube en AWS

o Implementacioacuten de tecnologiacutea Terraform para automatizacioacuten de despliegues

Creacioacuten de cursos de programacioacuten para ampliar la coleccioacuten

Campantildea de promocioacuten de la comunidad y la plataforma


114

Bibliografiacutea Agile Manifesto 2001 Manifiesto por el Desarrollo Aacutegil de Software Agile Manifesto [En liacutenea]

2001 [Citado el 5 de Abril de 2020] httpsagilemanifestoorgisoesmanifestohtml Albelda Rafa Sanchis 2013 Anaacutelisis comparativo de LMS Escola Tegravecnica Superior drsquoEnginyeria

Informagravetica Universitat Politegravecnica de Valegravencia 2013 paacuteg 114 Proyecto Final de Carrera

Anicas Mitchell 2018 Una introduccioacuten a OAuth 2 Digital Ocean [En liacutenea] 30 de Marzo de 2018

[Citado el 16 de Mayo de 2020] httpswwwdigitaloceancomcommunitytutorialsuna-introduccion-

a-oauth-2-es

Arenzana David 2016 Principios de usabilidad web de Jakob Nielsen disentildeo UX Semrush [En

liacutenea] 30 de Marzo de 2016 [Citado el 14 de Abril de 2020] httpsessemrushcomblogusabilidad-

web-principios-jakob-nielsen

AWS iquestQueacute es la entrega continua AWS [En liacutenea] [Citado el 4 de Junio de 2020]

httpsawsamazoncomesdevopscontinuous-delivery

mdash iquestQueacute es la integracioacuten continua AWS [En liacutenea] [Citado el 3 de Junio de 2020]

httpsawsamazoncomesdevopscontinuous-integration

BBVA Machine learning iquestqueacute es y coacutemo funciona [En liacutenea] [Citado el 22 de 04 de 2020]

httpswwwbbvacomesmachine-learning-que-es-y-como-funciona

BezKoder 2020 Django POST PUT GET DELETE requests example | Rest Apis BezKoder [En

liacutenea] 12 de Mayo de 2020 [Citado el 22 de Mayo de 2020] httpsbezkodercomdjango-rest-api

Django Software Foundation Django documentation Django [Online] [Cited 10 Mayo 2020]

httpsdocsdjangoprojectcomen30

Docker Compose file version 3 reference Docker [En liacutenea] [Citado el 15 de Mayo de 2020]

httpsdocsdockercomcomposecompose-file

Everis 2018 iquestQueacute es la Infraestructura como coacutedigo (IaC) Everis [En liacutenea] 10 de Septiembre de

2018 [Citado el 22 de Abril de 2020] httpseveriscloudque-es-la-infraestructura-como-codigo-iac

Fernaacutendez Estefaniacutea 2018 La integracioacuten continua actual pasa por pipelines SDOS [En liacutenea] 1

de Marzo de 2018 [Citado el 27 de Mayo de 2020] httpssdosesblogla-integracion-continua-

actual-pasa-por-pipelines

Fernaacutendez Manuel 2020 Google Classroom y Microsoft Teams lo maacutes descargado por la

cuarentena del coronavirus El Espantildeol [En liacutenea] 19 de Marzo de 2020 [Citado el 15 de Abril de

2020] httpswwwelespanolcomomicronosoftware20200319google-classroom-microsoft-teams-

descargado-cuarentena-coronavirus474453480_0html

Fund Django REST framework API Guide Django Rest Framework [En liacutenea] [Citado el 20 de

Mayo de 2020] httpswwwdjango-rest-frameworkorg

Inboundcycle Webinar iquestqueacute es y coacutemo utilizarlo en tu estrategia de contenidos Inboundcycle [En

liacutenea] [Citado el 14 de Abril de 2020] httpswwwinboundcyclecomdiccionario-marketing-

onlinewebinar


115

Ionos 2019 CORS queacute es y coacutemo funciona el cross-origin resource sharing Ionos [En liacutenea] 12 de

Diciembre de 2019 [Citado el 1 de Junio de 2020] httpswwwionosesdigitalguidepaginas-

webdesarrollo-webcross-origin-resource-sharing

mdash 2019 Jenkins tutorial para esta herramienta de CI Ionos [En liacutenea] 23 de Abril de 2019 [Citado

el 27 de Mayo de 2020] httpswwwionosesdigitalguidepaginas-webdesarrollo-webjenkins-

tutorial

mdash 2019 SaaS ventajas del software a demanda Ionos [En liacutenea] 3 de Marzo de 2019 [Citado el

24 de Abril de 2020] httpswwwionosesdigitalguideservidoresknow-howque-es-saas

Kay Alan C 1993 The Early History Of Smalltalk [Online] 1993 [Cited 4 Mayo 2020]

httpworrydreamcomEarlyHistoryOfSmalltalk

Linares Jonathan Cavero Claroline Bit4learn [En liacutenea] [Citado el 11 de Abril de 2020]

httpsbit4learncomeslmsclaroline

mdash SAKAI Bit4learn [En liacutenea] [Citado el 18 de Abril de 2020] httpsbit4learncomeslmssakai

Marcelo Ernesto Valero 2017 Terraform la navaja suiza para dominar todos los IaaS Paradigma

Digital [En liacutenea] 2017 [Citado el 27 de Mayo de 2020]

httpswwwparadigmadigitalcomdevterraform-la-navaja-suiza-dominar-todos-los-iaas

Martiacuten Carlos Maciacuteas 2019 Principios SOLID En mi local funciona [En liacutenea] 3 de Abril de 2019

[Citado el 22 de Abril de 2020] httpsenmilocalfuncionaioprincipios-solid

MDN Web Docs 2019 Control de acceso HTTP (CORS) MDN Web Docs [En liacutenea] 6 de Mayo de

2019 [Citado el 5 de Mayo de 2020]

httpsdevelopermozillaorgesdocsWebHTTPAccess_control_CORS

Merayo Patricia iquestQUEacute ES LA PLATAFORMA MOODLE Y PARA QUEacute SIRVE Maacutexima Formacioacuten

[En liacutenea] [Citado el 4 de Abril de 2020] httpswwwmaximaformacionese-learnque-es-moodle-y-

para-que-sirve

Muravlov Dima 2020 LMS Comparison What LMS suits your needs best Raccoon Gang [Online]

3 Marzo 2020 [Cited 16 Abril 2020] httpsraccoongangcombloglms-comparison-what-lms-suits-

your-needs-best

Ortega Jorge Mendez 2019 Que es GraphQL Medium [En liacutenea] 4 de Abril de 2019 [Citado el

26 de Mayo de 2020] httpsmediumcomjmz12que-es-graphql-bf835e55960

Pappas Christopher 2019 The Top Open Source Learning Management Systems eLearning

Industry [Online] 2019 [Cited 15 Abril 2020] httpselearningindustrycomtop-open-source-learning-

management-systems

Poussin Mathieu 2016 Desplegando un full stack de Django con Docker-Compose Capside [En

liacutenea] 4 de Marzo de 2016 [Citado el 15 de Mayo de 2020]

httpswwwcapsidecomeslabsdesplegando-un-full-stack-de-django-con-docker-compose

RocketChat Comunicacioacuten efectiva open source RocketChat [En liacutenea] [Citado el 25 de Mayo de

2020] httpsrocketchates


116

Vizcaino Alex 2018 DevOps e Integracioacuten Continua UX Land [En liacutenea] 24 de Enero de 2018

[Citado el 15 de Abril de 2020] httpswwwuxlandesdevops-integracion-continua

VueJs Guide Vue 2 VueJs [Online] [Cited 15 Mayo 2020] httpsvuejsorgv2guide

Widergy 2019 Construyendo una plataforma SaaS Multi-tenant Medium [En liacutenea] 8 de Noviembre

de 2019 [Citado el 20 de 04 de 2020] httpsmediumcomwidergyconstruyendo-una-plataforma-

saas-multi-tenant-vol-1-71a6cbe0334d

Wikipedia 2020 AJAX Wikipedia [En liacutenea] 16 de Mayo de 2020 [Citado el 2 de Junio de 2020]

httpseswikipediaorgwikiAJAX

mdash 2020 COVID-19 [En liacutenea] 1 de Junio de 2020 [Citado el 6 de Junio de 2020]

httpseswikipediaorgwikiCOVID-19

mdash 2020 Docker (software) Wikipedia [En liacutenea] 2 de Junio de 2020 [Citado el 3 de Junio de 2020]

httpseswikipediaorgwikiDocker_(software)

mdash 2020 Dynabook [En liacutenea] 29 de Abril de 2020 [Citado el 5 de Mayo de 2020]

httpseswikipediaorgwikiDynabook

mdash 2019 Gestioacuten de direcciones de protocolo de internet Wikipedia [En liacutenea] 18 de Diciembre de


httpseswikipediaorgwikiGestiC3B3n_de_direcciones_de_protocolo_de_internet

mdash 2020 Git Wikipedia [En liacutenea] 2 de Junio de 2020 [Citado el 5 de Junio de 2020]

httpseswikipediaorgwikiGit

mdash 2020 Nube Privada Virtual Wikipedia [En liacutenea] 28 de Mayo de 2020 [Citado el 1 de Junio de

2020] httpseswikipediaorgwikiNube_privada_virtual

mdash 2020 Red privada virtual Wikipedia [En liacutenea] 22 de abril de 2020 [Citado el 12 de Mayo de

2020] httpseswikipediaorgwikiRed_privada_virtual

mdash 2020 Sistema de gestioacuten de aprendizaje [En liacutenea] 23 de Mayo de 2020 [Citado el 28 de Mayo

de 2020] httpseswikipediaorgwikiSistema_de_gestiC3B3n_de_aprendizaje

mdash 2019 Software como servicio Wikipedia [En liacutenea] 27 de Septiembre de 2019 [Citado el 22 de

Abril de 2020] httpseswikipediaorgwikiSoftware_como_servicio

mdash 2019 SOLID Wikipedia [En liacutenea] 21 de Noviembre de 2019 [Citado el 14 de Abril de 2020]

httpseswikipediaorgwikiSOLID

mdash 2020 Variable de entorno Wikipedia [En liacutenea] 4 de Junio de 2020 [Citado el 6 de Junio de

2020] httpseswikipediaorgwikiVariable_de_entorno

mdash 2020 Vue Js Wikipedia [En liacutenea] 28 de Mayo de 2020 [Citado el 29 de Mayo de 2020]

httpsenwikipediaorgwikiVuejs

mdash 2020 YAML Wikipedia [En liacutenea] 20 de Abril de 2020 [Citado el 18 de Mayo de 2020]

httpseswikipediaorgwikiYAML


117

Recursos Para la realizacioacuten de este proyecto se han utilizado recursos de terceros con licencias de coacutedigo

libre para no comprometer el compromiso con la comunidad de coacutedigo abierto

Estos recursos se han conseguido a traveacutes de los siguientes portales o libreriacuteas

Font-Awesome Free Se utilizan iconos bajo licencia CC BY 40

Se utilizan fuentes bajo licencia SIL OFL 10

Licencia httpsgithubcomFortAwesomeFont-Awesome

User Profile Plugin Se utiliza el plugin de Adobe XD para la creacioacuten de fotos ficticias de perfil de

usuarios

La licencia de este plugin es open source seguacuten se recoge en su web httpswwwjanisrozenfeldscomuser-profile-plugin

La coleccioacuten de fotos que utilia pertenece al portal Unsplash

Licencia gratuita permisiva seguacuten se recoge en su web httpsunsplashcomlicense

Pixabay Se utilizan imaacutegenes de este portal

Licencia propia gratuita permisiva y sin restricciones httpspixabaycomesservicelicense


118

Anexos Anexo A Entregables del proyecto Dentro del proyecto se entregan las diferentes carpetas

- Presentacioacuten o Archivo en Power Point de la presentacioacuten del proyecto

- Coacutedigo o Archivos y carpetas de todos los coacutedigos fuente del proyecto Este mismo repositorio

estaacute alojado en GitHub httpsgithubcomamanzanodhypotesis

- Interfaces o Adobe XD Archivos en formato Adobe XD de los prototipos de alta definicioacuten del portal

Hypotesis Pro e Hypotesis School (vista profesor y alumno)

o Hypotesis Pro Prototipos de alta definicioacuten de las interfaces de usuario de Hypotesis

Pro en formato PNG

o Hypotesis School Estudiante Prototipos de alta definicioacuten de las interfaces de usuario

de Hypotesis School en vista alumno en formato PNG

o Hypotesis School Profesor Prototipos de alta definicioacuten de las interfaces de usuario

de Hypotesis School en vista profesor en formato PNG

- Coleccioacuten de peticiones API REST en Postman Documentacioacuten de todas las peticiones creadas en el proyecto

o Hypotesis Contextpostman_collectionjson

o Hypotesis Enrolpostman_collectionjson


o Hypotesis Managerpostman_collectionjson

- Logotipo o logo_hypotesisai Versiones del logotipo vectorizado en formato Adobe Ilustrator

o logo_hypoesispng Logotipos en formato PNG en escalas x1 y x4

o logo_hypotesissvg Logotipo vectorizado en formato SVG


119

Anexo B Curriacuteculum Vitae

Antonio Manzano Diacuteaz Madrid 17 de agosto de 1979 (40 antildeos)

Uacuteltimas experiencias laborales (junio 2019 ndash actualmente) Prosegur Cash

PROGRAMADOR FULLSTACK

Desarrollo de aplicaciones para el sector de telecomunicaciones y contact centers

Python + NodeJs + PHP + Docker + SQL Server + NET + HTML5 + JavaScript

+ Linux + ICR Evolution + DBR + iVR

(agosto 2018 ndash junio 2019) Rentamarkets

PROGRAMADOR PHP

Responsable del departamento de desarrollo Arquitectura API Rest con Docker y K8s Integracioacuten continua con Git y Jenkins

Gestioacuten de infraestructura y monitorizacioacuten en AWS Anaacutelisis funcional y teacutecnico

Laravel 55 + Zend2 + PHP + JQuery + HTML + SASS + Javascript + Docker + Jenkins + AWS + MySQL + JIRA + Git + POO

+ MVC + SCRUM + API Rest + SOAP + S3 + UML + Wordpress

(junio 2017 ndash agosto 2018) Editorial SM

PROGRAMADOR PHP MOODLE

Desarrollo de plataformas LMS Moodle para el Aula Virtual de la Editorial SM Utilizacioacuten de las API de Moodle 33

Moodle 33 + Apache + PHP + JQuery + HTML + SASS + PHPUnit + Javascript + Codechecker + Mustache + MySQL + JIRA

+ Git + BitBucket + POO + MVC + SCRUM

(septiembre 2016 - junio 2017) Telefoacutenica Educacioacuten Digital PROGRAMADOR PHP MOODLE

Plataforma LMS Moodle para la Escuela de Inspectores de Trabajo Recogida de requisitos funcionales y teacutecnicos Instalacioacuten

en servidor Windows 2012 + SQL Server + Apache Desarrollo de plugins en PHP y SQL Maquetacioacuten en

HTML5+CSS+Javascript Creacioacuten de documentos e informes SQL

Moodle 31 + Apache + PHP + JQuery + HTML + CSS + Javascript + GIMP + Inkscape + SQL Server + MySQL + Oracle +

Blackboard Collaborate

(mayo 2016 - septiembre 2016) Bankia

MULTIMEDIA E-LEARNING

Desarrollo de contenidos e-learning para cursos de empleados de Bankia Gestioacuten de paquetes SCORM 2004 LMS y aula

virtual

Photoshop + Illustrator + Flash + AS2 + SCORM 2004 + LMS - Packager + Aula Virtual + HTML5

(septiembre 2010 - marzo 2016) Airbus Military


Desarrollo de contenido multimedia para la realizacioacuten de cursos para mecaacutenicos y pilotos de los aviones A-400M y

Eurofighter

Photoshop + Illustrator + Flash + 3d Studio + VRay + Audition + Office


120

1 Introduccioacuten

11 Proacutelogo

12 Definicioacuten







16 Presupuesto




2 Anaacutelisis de mercado


22 Competencia









3 Propuesta

31 Hypotesis Open


33 Hypotesis Pro

34 Hypotesis School

341 Hypotesis Code











4 Disentildeo





423 Hypotesis VPN




427 Hypotesis DB


429 Hypotesis Pro


43 Hypotesis API







453 Eslogan

454 Colores







5 Implementacioacuten

51 Entorno de desarrollo integrado (IDE)


53 Docker Compose





6 Demostracioacuten

61 Prototipo interactivo Adobe XD


7 Conclusiones y liacuteneas de futuro

71 Conclusiones



Bibliografiacutea

Recursos

Anexos


2

Licencia

Este documento estaacute sujeto a una licencia de Reconocimiento - No Comercial ndash Sin Obra Derivada 30 Espantildea de CreativeCommons

El proyecto Hypotesis Open alojado en GitHub estaacute sujeto a una licencia GNU GPLv3 httpswwwgnuorglicensesgpl-30html


3










Resumen del Trabajo



4

Abstract



5

Cita


Agradecimientos












objetivos






proyecto


6












empresas














7

Abstract























8

Iacutendice


11 Proacutelogo 14








16 Presupuesto 26






22 Competencia 30









3 Propuesta 43



33 Hypotesis Pro 45



9













4 Disentildeo 54









427 Hypotesis DB 65




43 Hypotesis API 71







453 Eslogan 77


10

454 Colores 77



















71 Conclusiones 111




Recursos 117

Anexos 118


11

Figuras y tablas




12




13



14


























15

























16

12 Definicioacuten























17















School


18










educativa




discapacidades
















19






de archivos CSV






de estudio






















20














21









del proyecto







22




















23















24










Lo-Fi

Hi-fi






Framework Django





Backend (Django)



Frontend (VueJs)

bull Hypotesis Pro







25















26

16 Presupuesto















Marca 6



Prototipo Hi-Fi 8

Manager 8






Hypotesis Pro 20

Hypotesis School 60


TOTAL 35000 euro


27














TOTAL 1540 euro










TOTAL 3500 euro


28





















arquitecturas









29
































30

22 Competencia



Moodle (PHP)



















31

Sakai LMS (Java)










universitario



32

Claroline (PHP)















33

Dokeos (PHP)






servidores









34

Chamilo (PHP)






este proyecto










amplia



35















36








libre



37


Canvas LMS (Ruby)

















desarrolladores


38




















39

Cornerstone
















40

Schoology










de 10$ por usuario


41

































42

















aplicaciones




43




a alumnos


31 Hypotesis Open







44






por el momento




- Usuarios





- Contextos


















45

33 Hypotesis Pro











bull Usuarios




















46




bull Usuarios





Zoom Interactivos


usuarios




institucioacuten




certificados etc

34 Hypotesis School









bull Escuela



47

bull Usuario











bull Escuela




bull Usuario






bull Chat



341 Hypotesis Code






48


























49















usuario matriculado














50



51












- Campantildeas







la comunidad














52


- Campantildeas



novedades



visitantes


plataforma









o Empresas






o Escuelas privadas

Informaacutetica

Autoescuelas

Idiomas







53
















la comunidad






54





























55


Classroom



Rocket Chat14












proveedor cloud









56


















57


423 Hypotesis VPN















58











ownload





mework



headers





59









forma











60


















61














62








requirementstxt





63








- Hypotesis Context



Salida API REST



- Hypotesis Item


Salida API REST




64

- Hypotesis Enrol


Salida API REST






Salida API REST


Salida API REST


usuarios

Salida API REST



Salida API REST

- Hypotesis Chat



Salida API REST

- Hypotesis Forum


65


Salida API REST



Salida API REST

427 Hypotesis DB











HYPOTESIS DB


66









67



se configure



FROM mysql8019


versioacuten 8019












onhtml



axios


68


bootstrap


bootstrap-vue


vue-router


vuex


sass


frontales

429 Hypotesis Pro









69










70








aplicativo



71









o libreriacuteas



43 Hypotesis API













72



servicio






73
















74












Mis cursos

Escuela Comuacuten


75













educativo



~ de trabajo







76





o Licencia




o Licencia




77

453 Eslogan




454 Colores














78






79


Tipografiacutea

- Tiacutetulo H1


- Tiacutetulo H2


- Tiacutetulo H3


- Paacuterrafo


Botones








80












Formularios

- Caja de texto



- Opciones


81



- Fecha



- Selector


- Adjuntar archivo



Modales

Modal informativo


82


Modal de error

Tabla


83

Calendario

Etiquetas y enlaces

Video

Cartas


84






85




86




87




88




89




90



91





92




93




94




95




96




97




98




99





100




101




102




103




104



















105

53 Docker Compose








windows-home













106


























107




contenedores











Cloud Platform












nuestra plataforma



108









109








docker images





110


docker container ls





en el puerto 3306


Windows)






111
































112




Microservicios











por los alumnos




Nuevos iacutetems

o Actividades

Debate

SCORM

H5P

Interactivos HTML5

Videoconferencias


o Recursos

Audio

Video

Archivos PDF

Paacuteginas HTML5




Infraestructura




113


API




Pruebas








o Jenkins

o Puppet






114






a-oauth-2-es





























onlinewebinar


115






tutorial


















para-que-sirve



your-needs-best





management-systems







116





































117








usuarios







118








Pro en formato PNG














119









PROGRAMADOR PHP



















virtual





Eurofighter



120

1 Introduccioacuten

11 Proacutelogo

12 Definicioacuten







16 Presupuesto






22 Competencia









3 Propuesta

31 Hypotesis Open


33 Hypotesis Pro

34 Hypotesis School

341 Hypotesis Code











4 Disentildeo





423 Hypotesis VPN




427 Hypotesis DB


429 Hypotesis Pro


43 Hypotesis API







453 Eslogan

454 Colores










53 Docker Compose





6 Demostracioacuten




71 Conclusiones



Bibliografiacutea

Recursos

Anexos


3










Resumen del Trabajo



4

Abstract



5

Cita


Agradecimientos












objetivos






proyecto


6












empresas














7

Abstract























8

Iacutendice


11 Proacutelogo 14








16 Presupuesto 26






22 Competencia 30









3 Propuesta 43



33 Hypotesis Pro 45



9













4 Disentildeo 54









427 Hypotesis DB 65




43 Hypotesis API 71







453 Eslogan 77


10

454 Colores 77



















71 Conclusiones 111




Recursos 117

Anexos 118


11

Figuras y tablas




12




13



14


























15

























16

12 Definicioacuten























17















School


18










educativa




discapacidades
















19






de archivos CSV






de estudio






















20














21









del proyecto







22




















23















24










Lo-Fi

Hi-fi






Framework Django





Backend (Django)



Frontend (VueJs)

bull Hypotesis Pro







25















26

16 Presupuesto















Marca 6



Prototipo Hi-Fi 8

Manager 8






Hypotesis Pro 20

Hypotesis School 60


TOTAL 35000 euro


27














TOTAL 1540 euro










TOTAL 3500 euro


28





















arquitecturas









29
































30

22 Competencia



Moodle (PHP)



















31

Sakai LMS (Java)










universitario



32

Claroline (PHP)















33

Dokeos (PHP)






servidores









34

Chamilo (PHP)






este proyecto










amplia



35















36








libre



37


Canvas LMS (Ruby)

















desarrolladores


38




















39

Cornerstone
















40

Schoology










de 10$ por usuario


41

































42

















aplicaciones




43




a alumnos


31 Hypotesis Open







44






por el momento




- Usuarios





- Contextos


















45

33 Hypotesis Pro











bull Usuarios




















46




bull Usuarios





Zoom Interactivos


usuarios




institucioacuten




certificados etc

34 Hypotesis School









bull Escuela



47

bull Usuario











bull Escuela




bull Usuario






bull Chat



341 Hypotesis Code






48


























49















usuario matriculado














50



51












- Campantildeas







la comunidad














52


- Campantildeas



novedades



visitantes


plataforma









o Empresas






o Escuelas privadas

Informaacutetica

Autoescuelas

Idiomas







53
















la comunidad






54





























55


Classroom



Rocket Chat14












proveedor cloud









56


















57


423 Hypotesis VPN















58











ownload





mework



headers





59









forma











60


















61














62








requirementstxt





63








- Hypotesis Context



Salida API REST



- Hypotesis Item


Salida API REST




64

- Hypotesis Enrol


Salida API REST






Salida API REST


Salida API REST


usuarios

Salida API REST



Salida API REST

- Hypotesis Chat



Salida API REST

- Hypotesis Forum


65


Salida API REST



Salida API REST

427 Hypotesis DB











HYPOTESIS DB


66









67



se configure



FROM mysql8019


versioacuten 8019












onhtml



axios


68


bootstrap


bootstrap-vue


vue-router


vuex


sass


frontales

429 Hypotesis Pro









69










70








aplicativo



71









o libreriacuteas



43 Hypotesis API













72



servicio






73
















74












Mis cursos

Escuela Comuacuten


75













educativo



~ de trabajo







76





o Licencia




o Licencia




77

453 Eslogan




454 Colores














78






79


Tipografiacutea

- Tiacutetulo H1


- Tiacutetulo H2


- Tiacutetulo H3


- Paacuterrafo


Botones








80












Formularios

- Caja de texto



- Opciones


81



- Fecha



- Selector


- Adjuntar archivo



Modales

Modal informativo


82


Modal de error

Tabla


83

Calendario

Etiquetas y enlaces

Video

Cartas


84






85




86




87




88




89




90



91





92




93




94




95




96




97




98




99





100




101




102




103




104



















105

53 Docker Compose








windows-home













106


























107




contenedores











Cloud Platform












nuestra plataforma



108









109








docker images





110


docker container ls





en el puerto 3306


Windows)






111
































112




Microservicios











por los alumnos




Nuevos iacutetems

o Actividades

Debate

SCORM

H5P

Interactivos HTML5

Videoconferencias


o Recursos

Audio

Video

Archivos PDF

Paacuteginas HTML5




Infraestructura




113


API




Pruebas








o Jenkins

o Puppet






114






a-oauth-2-es





























onlinewebinar


115






tutorial


















para-que-sirve



your-needs-best





management-systems







116





































117








usuarios







118








Pro en formato PNG














119









PROGRAMADOR PHP



















virtual





Eurofighter



120

1 Introduccioacuten

11 Proacutelogo

12 Definicioacuten







16 Presupuesto






22 Competencia









3 Propuesta

31 Hypotesis Open


33 Hypotesis Pro

34 Hypotesis School

341 Hypotesis Code











4 Disentildeo





423 Hypotesis VPN




427 Hypotesis DB


429 Hypotesis Pro


43 Hypotesis API







453 Eslogan

454 Colores










53 Docker Compose





6 Demostracioacuten




71 Conclusiones



Bibliografiacutea

Recursos

Anexos


4

Abstract



5

Cita


Agradecimientos












objetivos






proyecto


6












empresas














7

Abstract























8

Iacutendice


11 Proacutelogo 14








16 Presupuesto 26






22 Competencia 30









3 Propuesta 43



33 Hypotesis Pro 45



9













4 Disentildeo 54









427 Hypotesis DB 65




43 Hypotesis API 71







453 Eslogan 77


10

454 Colores 77



















71 Conclusiones 111




Recursos 117

Anexos 118


11

Figuras y tablas




12




13



14


























15

























16

12 Definicioacuten























17















School


18










educativa




discapacidades
















19






de archivos CSV






de estudio






















20














21









del proyecto







22




















23















24










Lo-Fi

Hi-fi






Framework Django





Backend (Django)



Frontend (VueJs)

bull Hypotesis Pro







25















26

16 Presupuesto















Marca 6



Prototipo Hi-Fi 8

Manager 8






Hypotesis Pro 20

Hypotesis School 60


TOTAL 35000 euro


27














TOTAL 1540 euro










TOTAL 3500 euro


28





















arquitecturas









29
































30

22 Competencia



Moodle (PHP)



















31

Sakai LMS (Java)










universitario



32

Claroline (PHP)















33

Dokeos (PHP)






servidores









34

Chamilo (PHP)






este proyecto










amplia



35















36








libre



37


Canvas LMS (Ruby)

















desarrolladores


38




















39

Cornerstone
















40

Schoology










de 10$ por usuario


41

































42

















aplicaciones




43




a alumnos


31 Hypotesis Open







44






por el momento




- Usuarios





- Contextos


















45

33 Hypotesis Pro











bull Usuarios




















46




bull Usuarios





Zoom Interactivos


usuarios




institucioacuten




certificados etc

34 Hypotesis School









bull Escuela



47

bull Usuario











bull Escuela




bull Usuario






bull Chat



341 Hypotesis Code






48


























49















usuario matriculado














50



51












- Campantildeas







la comunidad














52


- Campantildeas



novedades



visitantes


plataforma









o Empresas






o Escuelas privadas

Informaacutetica

Autoescuelas

Idiomas







53
















la comunidad






54





























55


Classroom



Rocket Chat14












proveedor cloud









56


















57


423 Hypotesis VPN















58











ownload





mework



headers





59









forma











60


















61














62








requirementstxt





63








- Hypotesis Context



Salida API REST



- Hypotesis Item


Salida API REST




64

- Hypotesis Enrol


Salida API REST






Salida API REST


Salida API REST


usuarios

Salida API REST



Salida API REST

- Hypotesis Chat



Salida API REST

- Hypotesis Forum


65


Salida API REST



Salida API REST

427 Hypotesis DB











HYPOTESIS DB


66









67



se configure



FROM mysql8019


versioacuten 8019












onhtml



axios


68


bootstrap


bootstrap-vue


vue-router


vuex


sass


frontales

429 Hypotesis Pro









69










70








aplicativo



71









o libreriacuteas



43 Hypotesis API













72



servicio






73
















74












Mis cursos

Escuela Comuacuten


75













educativo



~ de trabajo







76





o Licencia




o Licencia




77

453 Eslogan




454 Colores














78






79


Tipografiacutea

- Tiacutetulo H1


- Tiacutetulo H2


- Tiacutetulo H3


- Paacuterrafo


Botones








80












Formularios

- Caja de texto



- Opciones


81



- Fecha



- Selector


- Adjuntar archivo



Modales

Modal informativo


82


Modal de error

Tabla


83

Calendario

Etiquetas y enlaces

Video

Cartas


84






85




86




87




88




89




90



91





92




93




94




95




96




97




98




99





100




101




102




103




104



















105

53 Docker Compose








windows-home













106


























107




contenedores











Cloud Platform












nuestra plataforma



108









109








docker images





110


docker container ls





en el puerto 3306


Windows)






111
































112




Microservicios











por los alumnos




Nuevos iacutetems

o Actividades

Debate

SCORM

H5P

Interactivos HTML5

Videoconferencias


o Recursos

Audio

Video

Archivos PDF

Paacuteginas HTML5




Infraestructura




113


API




Pruebas








o Jenkins

o Puppet






114






a-oauth-2-es





























onlinewebinar


115






tutorial


















para-que-sirve



your-needs-best





management-systems







116





































117








usuarios







118








Pro en formato PNG














119









PROGRAMADOR PHP



















virtual





Eurofighter



120

1 Introduccioacuten

11 Proacutelogo

12 Definicioacuten







16 Presupuesto






22 Competencia









3 Propuesta

31 Hypotesis Open


33 Hypotesis Pro

34 Hypotesis School

341 Hypotesis Code











4 Disentildeo





423 Hypotesis VPN




427 Hypotesis DB


429 Hypotesis Pro


43 Hypotesis API







453 Eslogan

454 Colores










53 Docker Compose





6 Demostracioacuten




71 Conclusiones



Bibliografiacutea

Recursos

Anexos


5

Cita


Agradecimientos












objetivos






proyecto


6












empresas














7

Abstract























8

Iacutendice


11 Proacutelogo 14








16 Presupuesto 26






22 Competencia 30









3 Propuesta 43



33 Hypotesis Pro 45



9













4 Disentildeo 54









427 Hypotesis DB 65




43 Hypotesis API 71







453 Eslogan 77


10

454 Colores 77



















71 Conclusiones 111




Recursos 117

Anexos 118


11

Figuras y tablas




12




13



14


























15

























16

12 Definicioacuten























17















School


18










educativa




discapacidades
















19






de archivos CSV






de estudio






















20














21









del proyecto







22




















23















24










Lo-Fi

Hi-fi






Framework Django





Backend (Django)



Frontend (VueJs)

bull Hypotesis Pro







25















26

16 Presupuesto















Marca 6



Prototipo Hi-Fi 8

Manager 8






Hypotesis Pro 20

Hypotesis School 60


TOTAL 35000 euro


27














TOTAL 1540 euro










TOTAL 3500 euro


28





















arquitecturas









29
































30

22 Competencia



Moodle (PHP)



















31

Sakai LMS (Java)










universitario



32

Claroline (PHP)















33

Dokeos (PHP)






servidores









34

Chamilo (PHP)






este proyecto










amplia



35















36








libre



37


Canvas LMS (Ruby)

















desarrolladores


38




















39

Cornerstone
















40

Schoology










de 10$ por usuario


41

































42

















aplicaciones




43




a alumnos


31 Hypotesis Open







44






por el momento




- Usuarios





- Contextos


















45

33 Hypotesis Pro











bull Usuarios




















46




bull Usuarios





Zoom Interactivos


usuarios




institucioacuten




certificados etc

34 Hypotesis School









bull Escuela



47

bull Usuario











bull Escuela




bull Usuario






bull Chat



341 Hypotesis Code






48


























49















usuario matriculado














50



51












- Campantildeas







la comunidad














52


- Campantildeas



novedades



visitantes


plataforma









o Empresas






o Escuelas privadas

Informaacutetica

Autoescuelas

Idiomas







53
















la comunidad






54





























55


Classroom



Rocket Chat14












proveedor cloud









56


















57


423 Hypotesis VPN















58











ownload





mework



headers





59









forma











60


















61














62








requirementstxt





63








- Hypotesis Context



Salida API REST



- Hypotesis Item


Salida API REST




64

- Hypotesis Enrol


Salida API REST






Salida API REST


Salida API REST


usuarios

Salida API REST



Salida API REST

- Hypotesis Chat



Salida API REST

- Hypotesis Forum


65


Salida API REST



Salida API REST

427 Hypotesis DB











HYPOTESIS DB


66









67



se configure



FROM mysql8019


versioacuten 8019












onhtml



axios


68


bootstrap


bootstrap-vue


vue-router


vuex


sass


frontales

429 Hypotesis Pro









69










70








aplicativo



71









o libreriacuteas



43 Hypotesis API













72



servicio






73
















74












Mis cursos

Escuela Comuacuten


75













educativo



~ de trabajo







76





o Licencia




o Licencia




77

453 Eslogan




454 Colores














78






79


Tipografiacutea

- Tiacutetulo H1


- Tiacutetulo H2


- Tiacutetulo H3


- Paacuterrafo


Botones








80












Formularios

- Caja de texto



- Opciones


81



- Fecha



- Selector


- Adjuntar archivo



Modales

Modal informativo


82


Modal de error

Tabla


83

Calendario

Etiquetas y enlaces

Video

Cartas


84






85




86




87




88




89




90



91





92




93




94




95




96




97




98




99





100




101




102




103




104



















105

53 Docker Compose








windows-home













106


























107




contenedores











Cloud Platform












nuestra plataforma



108









109








docker images





110


docker container ls





en el puerto 3306


Windows)






111
































112




Microservicios











por los alumnos




Nuevos iacutetems

o Actividades

Debate

SCORM

H5P

Interactivos HTML5

Videoconferencias


o Recursos

Audio

Video

Archivos PDF

Paacuteginas HTML5




Infraestructura




113


API




Pruebas








o Jenkins

o Puppet






114






a-oauth-2-es





























onlinewebinar


115






tutorial


















para-que-sirve



your-needs-best





management-systems







116





































117








usuarios







118








Pro en formato PNG














119









PROGRAMADOR PHP



















virtual





Eurofighter



120

1 Introduccioacuten

11 Proacutelogo

12 Definicioacuten







16 Presupuesto






22 Competencia









3 Propuesta

31 Hypotesis Open


33 Hypotesis Pro

34 Hypotesis School

341 Hypotesis Code











4 Disentildeo





423 Hypotesis VPN




427 Hypotesis DB


429 Hypotesis Pro


43 Hypotesis API







453 Eslogan

454 Colores










53 Docker Compose





6 Demostracioacuten




71 Conclusiones



Bibliografiacutea

Recursos

Anexos


6












empresas














7

Abstract























8

Iacutendice


11 Proacutelogo 14








16 Presupuesto 26






22 Competencia 30









3 Propuesta 43



33 Hypotesis Pro 45



9













4 Disentildeo 54









427 Hypotesis DB 65




43 Hypotesis API 71







453 Eslogan 77


10

454 Colores 77



















71 Conclusiones 111




Recursos 117

Anexos 118


11

Figuras y tablas




12




13



14


























15

























16

12 Definicioacuten























17















School


18










educativa




discapacidades
















19






de archivos CSV






de estudio






















20














21









del proyecto







22




















23















24










Lo-Fi

Hi-fi






Framework Django





Backend (Django)



Frontend (VueJs)

bull Hypotesis Pro







25















26

16 Presupuesto















Marca 6



Prototipo Hi-Fi 8

Manager 8






Hypotesis Pro 20

Hypotesis School 60


TOTAL 35000 euro


27














TOTAL 1540 euro










TOTAL 3500 euro


28





















arquitecturas









29
































30

22 Competencia



Moodle (PHP)



















31

Sakai LMS (Java)










universitario



32

Claroline (PHP)















33

Dokeos (PHP)






servidores









34

Chamilo (PHP)






este proyecto










amplia



35















36








libre



37


Canvas LMS (Ruby)

















desarrolladores


38




















39

Cornerstone
















40

Schoology










de 10$ por usuario


41

































42

















aplicaciones




43




a alumnos


31 Hypotesis Open







44






por el momento




- Usuarios





- Contextos


















45

33 Hypotesis Pro











bull Usuarios




















46




bull Usuarios





Zoom Interactivos


usuarios




institucioacuten




certificados etc

34 Hypotesis School









bull Escuela



47

bull Usuario











bull Escuela




bull Usuario






bull Chat



341 Hypotesis Code






48


























49















usuario matriculado














50



51












- Campantildeas







la comunidad














52


- Campantildeas



novedades



visitantes


plataforma









o Empresas






o Escuelas privadas

Informaacutetica

Autoescuelas

Idiomas







53
















la comunidad






54





























55


Classroom



Rocket Chat14












proveedor cloud









56


















57


423 Hypotesis VPN















58











ownload





mework



headers





59









forma











60


















61














62








requirementstxt





63








- Hypotesis Context



Salida API REST



- Hypotesis Item


Salida API REST




64

- Hypotesis Enrol


Salida API REST






Salida API REST


Salida API REST


usuarios

Salida API REST



Salida API REST

- Hypotesis Chat



Salida API REST

- Hypotesis Forum


65


Salida API REST



Salida API REST

427 Hypotesis DB











HYPOTESIS DB


66









67



se configure



FROM mysql8019


versioacuten 8019












onhtml



axios


68


bootstrap


bootstrap-vue


vue-router


vuex


sass


frontales

429 Hypotesis Pro









69










70








aplicativo



71









o libreriacuteas



43 Hypotesis API













72



servicio






73
















74












Mis cursos

Escuela Comuacuten


75













educativo



~ de trabajo







76





o Licencia




o Licencia




77

453 Eslogan




454 Colores














78






79


Tipografiacutea

- Tiacutetulo H1


- Tiacutetulo H2


- Tiacutetulo H3


- Paacuterrafo


Botones








80












Formularios

- Caja de texto



- Opciones


81



- Fecha



- Selector


- Adjuntar archivo



Modales

Modal informativo


82


Modal de error

Tabla


83

Calendario

Etiquetas y enlaces

Video

Cartas


84






85




86




87




88




89




90



91





92




93




94




95




96




97




98




99





100




101




102




103




104



















105

53 Docker Compose








windows-home













106


























107




contenedores











Cloud Platform












nuestra plataforma



108









109








docker images





110


docker container ls





en el puerto 3306


Windows)






111
































112




Microservicios











por los alumnos




Nuevos iacutetems

o Actividades

Debate

SCORM

H5P

Interactivos HTML5

Videoconferencias


o Recursos

Audio

Video

Archivos PDF

Paacuteginas HTML5




Infraestructura




113


API




Pruebas








o Jenkins

o Puppet






114






a-oauth-2-es





























onlinewebinar


115






tutorial


















para-que-sirve



your-needs-best





management-systems







116





































117








usuarios







118








Pro en formato PNG














119









PROGRAMADOR PHP



















virtual





Eurofighter



120

1 Introduccioacuten

11 Proacutelogo

12 Definicioacuten







16 Presupuesto






22 Competencia









3 Propuesta

31 Hypotesis Open


33 Hypotesis Pro

34 Hypotesis School

341 Hypotesis Code











4 Disentildeo





423 Hypotesis VPN




427 Hypotesis DB


429 Hypotesis Pro


43 Hypotesis API







453 Eslogan

454 Colores










53 Docker Compose





6 Demostracioacuten




71 Conclusiones



Bibliografiacutea

Recursos

Anexos


7

Abstract























8

Iacutendice


11 Proacutelogo 14








16 Presupuesto 26






22 Competencia 30









3 Propuesta 43



33 Hypotesis Pro 45



9













4 Disentildeo 54









427 Hypotesis DB 65




43 Hypotesis API 71







453 Eslogan 77


10

454 Colores 77



















71 Conclusiones 111




Recursos 117

Anexos 118


11

Figuras y tablas




12




13



14


























15

























16

12 Definicioacuten























17















School


18










educativa




discapacidades
















19






de archivos CSV






de estudio






















20














21









del proyecto







22




















23















24










Lo-Fi

Hi-fi






Framework Django





Backend (Django)



Frontend (VueJs)

bull Hypotesis Pro







25















26

16 Presupuesto















Marca 6



Prototipo Hi-Fi 8

Manager 8






Hypotesis Pro 20

Hypotesis School 60


TOTAL 35000 euro


27














TOTAL 1540 euro










TOTAL 3500 euro


28





















arquitecturas









29
































30

22 Competencia



Moodle (PHP)



















31

Sakai LMS (Java)










universitario



32

Claroline (PHP)















33

Dokeos (PHP)






servidores









34

Chamilo (PHP)






este proyecto










amplia



35















36








libre



37


Canvas LMS (Ruby)

















desarrolladores


38




















39

Cornerstone
















40

Schoology










de 10$ por usuario


41

































42

















aplicaciones




43




a alumnos


31 Hypotesis Open







44






por el momento




- Usuarios





- Contextos


















45

33 Hypotesis Pro











bull Usuarios




















46




bull Usuarios





Zoom Interactivos


usuarios




institucioacuten




certificados etc

34 Hypotesis School









bull Escuela



47

bull Usuario











bull Escuela




bull Usuario






bull Chat



341 Hypotesis Code






48


























49















usuario matriculado














50



51












- Campantildeas







la comunidad














52


- Campantildeas



novedades



visitantes


plataforma









o Empresas






o Escuelas privadas

Informaacutetica

Autoescuelas

Idiomas







53
















la comunidad






54





























55


Classroom



Rocket Chat14












proveedor cloud









56


















57


423 Hypotesis VPN















58











ownload





mework



headers





59









forma











60


















61














62








requirementstxt





63








- Hypotesis Context



Salida API REST



- Hypotesis Item


Salida API REST




64

- Hypotesis Enrol


Salida API REST






Salida API REST


Salida API REST


usuarios

Salida API REST



Salida API REST

- Hypotesis Chat



Salida API REST

- Hypotesis Forum


65


Salida API REST



Salida API REST

427 Hypotesis DB











HYPOTESIS DB


66









67



se configure



FROM mysql8019


versioacuten 8019












onhtml



axios


68


bootstrap


bootstrap-vue


vue-router


vuex


sass


frontales

429 Hypotesis Pro









69










70








aplicativo



71









o libreriacuteas



43 Hypotesis API













72



servicio






73
















74












Mis cursos

Escuela Comuacuten


75













educativo



~ de trabajo







76





o Licencia




o Licencia




77

453 Eslogan




454 Colores














78






79


Tipografiacutea

- Tiacutetulo H1


- Tiacutetulo H2


- Tiacutetulo H3


- Paacuterrafo


Botones








80












Formularios

- Caja de texto



- Opciones


81



- Fecha



- Selector


- Adjuntar archivo



Modales

Modal informativo


82


Modal de error

Tabla


83

Calendario

Etiquetas y enlaces

Video

Cartas


84






85




86




87




88




89




90



91





92




93




94




95




96




97




98




99





100




101




102




103




104



















105

53 Docker Compose








windows-home













106


























107




contenedores











Cloud Platform












nuestra plataforma



108









109








docker images





110


docker container ls





en el puerto 3306


Windows)






111
































112




Microservicios











por los alumnos




Nuevos iacutetems

o Actividades

Debate

SCORM

H5P

Interactivos HTML5

Videoconferencias


o Recursos

Audio

Video

Archivos PDF

Paacuteginas HTML5




Infraestructura




113


API




Pruebas








o Jenkins

o Puppet






114






a-oauth-2-es





























onlinewebinar


115






tutorial


















para-que-sirve



your-needs-best





management-systems







116





































117








usuarios







118








Pro en formato PNG














119









PROGRAMADOR PHP



















virtual





Eurofighter



120

1 Introduccioacuten

11 Proacutelogo

12 Definicioacuten







16 Presupuesto






22 Competencia









3 Propuesta

31 Hypotesis Open


33 Hypotesis Pro

34 Hypotesis School

341 Hypotesis Code











4 Disentildeo





423 Hypotesis VPN




427 Hypotesis DB


429 Hypotesis Pro


43 Hypotesis API







453 Eslogan

454 Colores










53 Docker Compose





6 Demostracioacuten




71 Conclusiones



Bibliografiacutea

Recursos

Anexos


8

Iacutendice


11 Proacutelogo 14








16 Presupuesto 26






22 Competencia 30









3 Propuesta 43



33 Hypotesis Pro 45



9













4 Disentildeo 54









427 Hypotesis DB 65




43 Hypotesis API 71







453 Eslogan 77


10

454 Colores 77



















71 Conclusiones 111




Recursos 117

Anexos 118


11

Figuras y tablas




12




13



14


























15

























16

12 Definicioacuten























17















School


18










educativa




discapacidades
















19






de archivos CSV






de estudio






















20














21









del proyecto







22




















23















24










Lo-Fi

Hi-fi






Framework Django





Backend (Django)



Frontend (VueJs)

bull Hypotesis Pro







25















26

16 Presupuesto















Marca 6



Prototipo Hi-Fi 8

Manager 8






Hypotesis Pro 20

Hypotesis School 60


TOTAL 35000 euro


27














TOTAL 1540 euro










TOTAL 3500 euro


28





















arquitecturas









29
































30

22 Competencia



Moodle (PHP)



















31

Sakai LMS (Java)










universitario



32

Claroline (PHP)















33

Dokeos (PHP)






servidores









34

Chamilo (PHP)






este proyecto










amplia



35















36








libre



37


Canvas LMS (Ruby)

















desarrolladores


38




















39

Cornerstone
















40

Schoology










de 10$ por usuario


41

































42

















aplicaciones




43




a alumnos


31 Hypotesis Open







44






por el momento




- Usuarios





- Contextos


















45

33 Hypotesis Pro











bull Usuarios




















46




bull Usuarios





Zoom Interactivos


usuarios




institucioacuten




certificados etc

34 Hypotesis School









bull Escuela



47

bull Usuario











bull Escuela




bull Usuario






bull Chat



341 Hypotesis Code






48


























49















usuario matriculado














50



51












- Campantildeas







la comunidad














52


- Campantildeas



novedades



visitantes


plataforma









o Empresas






o Escuelas privadas

Informaacutetica

Autoescuelas

Idiomas







53
















la comunidad






54





























55


Classroom



Rocket Chat14












proveedor cloud









56


















57


423 Hypotesis VPN















58











ownload





mework



headers





59









forma











60


















61














62








requirementstxt





63








- Hypotesis Context



Salida API REST



- Hypotesis Item


Salida API REST




64

- Hypotesis Enrol


Salida API REST






Salida API REST


Salida API REST


usuarios

Salida API REST



Salida API REST

- Hypotesis Chat



Salida API REST

- Hypotesis Forum


65


Salida API REST



Salida API REST

427 Hypotesis DB











HYPOTESIS DB


66









67



se configure



FROM mysql8019


versioacuten 8019












onhtml



axios


68


bootstrap


bootstrap-vue


vue-router


vuex


sass


frontales

429 Hypotesis Pro









69










70








aplicativo



71









o libreriacuteas



43 Hypotesis API













72



servicio






73
















74












Mis cursos

Escuela Comuacuten


75













educativo



~ de trabajo







76





o Licencia




o Licencia




77

453 Eslogan




454 Colores














78






79


Tipografiacutea

- Tiacutetulo H1


- Tiacutetulo H2


- Tiacutetulo H3


- Paacuterrafo


Botones








80












Formularios

- Caja de texto



- Opciones


81



- Fecha



- Selector


- Adjuntar archivo



Modales

Modal informativo


82


Modal de error

Tabla


83

Calendario

Etiquetas y enlaces

Video

Cartas


84






85




86




87




88




89




90



91





92




93




94




95




96




97




98




99





100




101




102




103




104



















105

53 Docker Compose








windows-home













106


























107




contenedores











Cloud Platform












nuestra plataforma



108









109








docker images





110


docker container ls





en el puerto 3306


Windows)






111
































112




Microservicios











por los alumnos




Nuevos iacutetems

o Actividades

Debate

SCORM

H5P

Interactivos HTML5

Videoconferencias


o Recursos

Audio

Video

Archivos PDF

Paacuteginas HTML5




Infraestructura




113


API




Pruebas








o Jenkins

o Puppet






114






a-oauth-2-es





























onlinewebinar


115






tutorial


















para-que-sirve



your-needs-best





management-systems







116





































117








usuarios







118








Pro en formato PNG














119









PROGRAMADOR PHP



















virtual





Eurofighter



120

1 Introduccioacuten

11 Proacutelogo

12 Definicioacuten







16 Presupuesto






22 Competencia









3 Propuesta

31 Hypotesis Open


33 Hypotesis Pro

34 Hypotesis School

341 Hypotesis Code











4 Disentildeo





423 Hypotesis VPN




427 Hypotesis DB


429 Hypotesis Pro


43 Hypotesis API







453 Eslogan

454 Colores










53 Docker Compose





6 Demostracioacuten




71 Conclusiones



Bibliografiacutea

Recursos

Anexos


9













4 Disentildeo 54









427 Hypotesis DB 65




43 Hypotesis API 71







453 Eslogan 77


10

454 Colores 77



















71 Conclusiones 111




Recursos 117

Anexos 118


11

Figuras y tablas




12




13



14


























15

























16

12 Definicioacuten























17















School


18










educativa




discapacidades
















19






de archivos CSV






de estudio






















20














21









del proyecto







22




















23















24










Lo-Fi

Hi-fi






Framework Django





Backend (Django)



Frontend (VueJs)

bull Hypotesis Pro







25















26

16 Presupuesto















Marca 6



Prototipo Hi-Fi 8

Manager 8






Hypotesis Pro 20

Hypotesis School 60


TOTAL 35000 euro


27














TOTAL 1540 euro










TOTAL 3500 euro


28





















arquitecturas









29
































30

22 Competencia



Moodle (PHP)



















31

Sakai LMS (Java)










universitario



32

Claroline (PHP)















33

Dokeos (PHP)






servidores









34

Chamilo (PHP)






este proyecto










amplia



35















36








libre



37


Canvas LMS (Ruby)

















desarrolladores


38




















39

Cornerstone
















40

Schoology










de 10$ por usuario


41

































42

















aplicaciones




43




a alumnos


31 Hypotesis Open







44






por el momento




- Usuarios





- Contextos


















45

33 Hypotesis Pro











bull Usuarios




















46




bull Usuarios





Zoom Interactivos


usuarios




institucioacuten




certificados etc

34 Hypotesis School









bull Escuela



47

bull Usuario











bull Escuela




bull Usuario






bull Chat



341 Hypotesis Code






48


























49















usuario matriculado














50



51












- Campantildeas







la comunidad














52


- Campantildeas



novedades



visitantes


plataforma









o Empresas






o Escuelas privadas

Informaacutetica

Autoescuelas

Idiomas







53
















la comunidad






54





























55


Classroom



Rocket Chat14












proveedor cloud









56


















57


423 Hypotesis VPN















58











ownload





mework



headers





59









forma











60


















61














62








requirementstxt





63








- Hypotesis Context



Salida API REST



- Hypotesis Item


Salida API REST




64

- Hypotesis Enrol


Salida API REST






Salida API REST


Salida API REST


usuarios

Salida API REST



Salida API REST

- Hypotesis Chat



Salida API REST

- Hypotesis Forum


65


Salida API REST



Salida API REST

427 Hypotesis DB











HYPOTESIS DB


66









67



se configure



FROM mysql8019


versioacuten 8019












onhtml



axios


68


bootstrap


bootstrap-vue


vue-router


vuex


sass


frontales

429 Hypotesis Pro









69










70








aplicativo



71









o libreriacuteas



43 Hypotesis API













72



servicio






73
















74












Mis cursos

Escuela Comuacuten


75













educativo



~ de trabajo







76





o Licencia




o Licencia




77

453 Eslogan




454 Colores














78






79


Tipografiacutea

- Tiacutetulo H1


- Tiacutetulo H2


- Tiacutetulo H3


- Paacuterrafo


Botones








80












Formularios

- Caja de texto



- Opciones


81



- Fecha



- Selector


- Adjuntar archivo



Modales

Modal informativo


82


Modal de error

Tabla


83

Calendario

Etiquetas y enlaces

Video

Cartas


84






85




86




87




88




89




90



91





92




93




94




95




96




97




98




99





100




101




102




103




104



















105

53 Docker Compose








windows-home













106


























107




contenedores











Cloud Platform












nuestra plataforma



108









109








docker images





110


docker container ls





en el puerto 3306


Windows)






111
































112




Microservicios











por los alumnos




Nuevos iacutetems

o Actividades

Debate

SCORM

H5P

Interactivos HTML5

Videoconferencias


o Recursos

Audio

Video

Archivos PDF

Paacuteginas HTML5




Infraestructura




113


API




Pruebas








o Jenkins

o Puppet






114






a-oauth-2-es





























onlinewebinar


115






tutorial


















para-que-sirve



your-needs-best





management-systems







116





































117








usuarios







118








Pro en formato PNG














119









PROGRAMADOR PHP



















virtual





Eurofighter



120

1 Introduccioacuten

11 Proacutelogo

12 Definicioacuten







16 Presupuesto






22 Competencia









3 Propuesta

31 Hypotesis Open


33 Hypotesis Pro

34 Hypotesis School

341 Hypotesis Code











4 Disentildeo





423 Hypotesis VPN




427 Hypotesis DB


429 Hypotesis Pro


43 Hypotesis API







453 Eslogan

454 Colores










53 Docker Compose





6 Demostracioacuten




71 Conclusiones



Bibliografiacutea

Recursos

Anexos


10

454 Colores 77



















71 Conclusiones 111




Recursos 117

Anexos 118


11

Figuras y tablas




12




13



14


























15

























16

12 Definicioacuten























17















School


18










educativa




discapacidades
















19






de archivos CSV






de estudio






















20














21









del proyecto







22




















23















24










Lo-Fi

Hi-fi






Framework Django





Backend (Django)



Frontend (VueJs)

bull Hypotesis Pro







25















26

16 Presupuesto















Marca 6



Prototipo Hi-Fi 8

Manager 8






Hypotesis Pro 20

Hypotesis School 60


TOTAL 35000 euro


27














TOTAL 1540 euro










TOTAL 3500 euro


28





















arquitecturas









29
































30

22 Competencia



Moodle (PHP)



















31

Sakai LMS (Java)










universitario



32

Claroline (PHP)















33

Dokeos (PHP)






servidores









34

Chamilo (PHP)






este proyecto










amplia



35















36








libre



37


Canvas LMS (Ruby)

















desarrolladores


38




















39

Cornerstone
















40

Schoology










de 10$ por usuario


41

































42

















aplicaciones




43




a alumnos


31 Hypotesis Open







44






por el momento




- Usuarios





- Contextos


















45

33 Hypotesis Pro











bull Usuarios




















46




bull Usuarios





Zoom Interactivos


usuarios




institucioacuten




certificados etc

34 Hypotesis School









bull Escuela



47

bull Usuario











bull Escuela




bull Usuario






bull Chat



341 Hypotesis Code






48


























49















usuario matriculado














50



51












- Campantildeas







la comunidad














52


- Campantildeas



novedades



visitantes


plataforma









o Empresas






o Escuelas privadas

Informaacutetica

Autoescuelas

Idiomas







53
















la comunidad






54





























55


Classroom



Rocket Chat14












proveedor cloud









56


















57


423 Hypotesis VPN















58











ownload





mework



headers





59









forma











60


















61














62








requirementstxt





63








- Hypotesis Context



Salida API REST



- Hypotesis Item


Salida API REST




64

- Hypotesis Enrol


Salida API REST






Salida API REST


Salida API REST


usuarios

Salida API REST



Salida API REST

- Hypotesis Chat



Salida API REST

- Hypotesis Forum


65


Salida API REST



Salida API REST

427 Hypotesis DB











HYPOTESIS DB


66









67



se configure



FROM mysql8019


versioacuten 8019












onhtml



axios


68


bootstrap


bootstrap-vue


vue-router


vuex


sass


frontales

429 Hypotesis Pro









69










70








aplicativo



71









o libreriacuteas



43 Hypotesis API













72



servicio






73
















74












Mis cursos

Escuela Comuacuten


75













educativo



~ de trabajo







76





o Licencia




o Licencia




77

453 Eslogan




454 Colores














78






79


Tipografiacutea

- Tiacutetulo H1


- Tiacutetulo H2


- Tiacutetulo H3


- Paacuterrafo


Botones








80












Formularios

- Caja de texto



- Opciones


81



- Fecha



- Selector


- Adjuntar archivo



Modales

Modal informativo


82


Modal de error

Tabla


83

Calendario

Etiquetas y enlaces

Video

Cartas


84






85




86




87




88




89




90



91





92




93




94




95




96




97




98




99





100




101




102




103




104



















105

53 Docker Compose








windows-home













106


























107




contenedores











Cloud Platform












nuestra plataforma



108









109








docker images





110


docker container ls





en el puerto 3306


Windows)






111
































112




Microservicios











por los alumnos




Nuevos iacutetems

o Actividades

Debate

SCORM

H5P

Interactivos HTML5

Videoconferencias


o Recursos

Audio

Video

Archivos PDF

Paacuteginas HTML5




Infraestructura




113


API




Pruebas








o Jenkins

o Puppet






114






a-oauth-2-es





























onlinewebinar


115






tutorial


















para-que-sirve



your-needs-best





management-systems







116





































117








usuarios







118








Pro en formato PNG














119









PROGRAMADOR PHP



















virtual





Eurofighter



120

1 Introduccioacuten

11 Proacutelogo

12 Definicioacuten







16 Presupuesto






22 Competencia









3 Propuesta

31 Hypotesis Open


33 Hypotesis Pro

34 Hypotesis School

341 Hypotesis Code











4 Disentildeo





423 Hypotesis VPN




427 Hypotesis DB


429 Hypotesis Pro


43 Hypotesis API







453 Eslogan

454 Colores










53 Docker Compose





6 Demostracioacuten




71 Conclusiones



Bibliografiacutea

Recursos

Anexos


11

Figuras y tablas




12




13



14


























15

























16

12 Definicioacuten























17















School


18










educativa




discapacidades
















19






de archivos CSV






de estudio






















20














21









del proyecto







22




















23















24










Lo-Fi

Hi-fi






Framework Django





Backend (Django)



Frontend (VueJs)

bull Hypotesis Pro







25















26

16 Presupuesto















Marca 6



Prototipo Hi-Fi 8

Manager 8






Hypotesis Pro 20

Hypotesis School 60


TOTAL 35000 euro


27














TOTAL 1540 euro










TOTAL 3500 euro


28





















arquitecturas









29
































30

22 Competencia



Moodle (PHP)



















31

Sakai LMS (Java)










universitario



32

Claroline (PHP)















33

Dokeos (PHP)






servidores









34

Chamilo (PHP)






este proyecto










amplia



35















36








libre



37


Canvas LMS (Ruby)

















desarrolladores


38




















39

Cornerstone
















40

Schoology










de 10$ por usuario


41

































42

















aplicaciones




43




a alumnos


31 Hypotesis Open







44






por el momento




- Usuarios





- Contextos


















45

33 Hypotesis Pro











bull Usuarios




















46




bull Usuarios





Zoom Interactivos


usuarios




institucioacuten




certificados etc

34 Hypotesis School









bull Escuela



47

bull Usuario











bull Escuela




bull Usuario






bull Chat



341 Hypotesis Code






48


























49















usuario matriculado














50



51












- Campantildeas







la comunidad














52


- Campantildeas



novedades



visitantes


plataforma









o Empresas






o Escuelas privadas

Informaacutetica

Autoescuelas

Idiomas







53
















la comunidad






54





























55


Classroom



Rocket Chat14












proveedor cloud









56


















57


423 Hypotesis VPN















58











ownload





mework



headers





59









forma











60


















61














62








requirementstxt





63








- Hypotesis Context



Salida API REST



- Hypotesis Item


Salida API REST




64

- Hypotesis Enrol


Salida API REST






Salida API REST


Salida API REST


usuarios

Salida API REST



Salida API REST

- Hypotesis Chat



Salida API REST

- Hypotesis Forum


65


Salida API REST



Salida API REST

427 Hypotesis DB











HYPOTESIS DB


66









67



se configure



FROM mysql8019


versioacuten 8019












onhtml



axios


68


bootstrap


bootstrap-vue


vue-router


vuex


sass


frontales

429 Hypotesis Pro









69










70








aplicativo



71









o libreriacuteas



43 Hypotesis API













72



servicio






73
















74












Mis cursos

Escuela Comuacuten


75













educativo



~ de trabajo







76





o Licencia




o Licencia




77

453 Eslogan




454 Colores














78






79


Tipografiacutea

- Tiacutetulo H1


- Tiacutetulo H2


- Tiacutetulo H3


- Paacuterrafo


Botones








80












Formularios

- Caja de texto



- Opciones


81



- Fecha



- Selector


- Adjuntar archivo



Modales

Modal informativo


82


Modal de error

Tabla


83

Calendario

Etiquetas y enlaces

Video

Cartas


84






85




86




87




88




89




90



91





92




93




94




95




96




97




98




99





100




101




102




103




104



















105

53 Docker Compose








windows-home













106


























107




contenedores











Cloud Platform












nuestra plataforma



108









109








docker images





110


docker container ls





en el puerto 3306


Windows)






111
































112




Microservicios











por los alumnos




Nuevos iacutetems

o Actividades

Debate

SCORM

H5P

Interactivos HTML5

Videoconferencias


o Recursos

Audio

Video

Archivos PDF

Paacuteginas HTML5




Infraestructura




113


API




Pruebas








o Jenkins

o Puppet






114






a-oauth-2-es





























onlinewebinar


115






tutorial


















para-que-sirve



your-needs-best





management-systems







116





































117








usuarios







118








Pro en formato PNG














119









PROGRAMADOR PHP



















virtual





Eurofighter



120

1 Introduccioacuten

11 Proacutelogo

12 Definicioacuten







16 Presupuesto






22 Competencia









3 Propuesta

31 Hypotesis Open


33 Hypotesis Pro

34 Hypotesis School

341 Hypotesis Code











4 Disentildeo





423 Hypotesis VPN




427 Hypotesis DB


429 Hypotesis Pro


43 Hypotesis API







453 Eslogan

454 Colores










53 Docker Compose





6 Demostracioacuten




71 Conclusiones



Bibliografiacutea

Recursos

Anexos


12




13



14


























15

























16

12 Definicioacuten























17















School


18










educativa




discapacidades
















19






de archivos CSV






de estudio






















20














21









del proyecto







22




















23















24










Lo-Fi

Hi-fi






Framework Django





Backend (Django)



Frontend (VueJs)

bull Hypotesis Pro







25















26

16 Presupuesto















Marca 6



Prototipo Hi-Fi 8

Manager 8






Hypotesis Pro 20

Hypotesis School 60


TOTAL 35000 euro


27














TOTAL 1540 euro










TOTAL 3500 euro


28





















arquitecturas









29
































30

22 Competencia



Moodle (PHP)



















31

Sakai LMS (Java)










universitario



32

Claroline (PHP)















33

Dokeos (PHP)






servidores









34

Chamilo (PHP)






este proyecto










amplia



35















36








libre



37


Canvas LMS (Ruby)

















desarrolladores


38




















39

Cornerstone
















40

Schoology










de 10$ por usuario


41

































42

















aplicaciones




43




a alumnos


31 Hypotesis Open







44






por el momento




- Usuarios





- Contextos


















45

33 Hypotesis Pro











bull Usuarios




















46




bull Usuarios





Zoom Interactivos


usuarios




institucioacuten




certificados etc

34 Hypotesis School









bull Escuela



47

bull Usuario











bull Escuela




bull Usuario






bull Chat



341 Hypotesis Code






48


























49















usuario matriculado














50



51












- Campantildeas







la comunidad














52


- Campantildeas



novedades



visitantes


plataforma









o Empresas






o Escuelas privadas

Informaacutetica

Autoescuelas

Idiomas







53
















la comunidad






54





























55


Classroom



Rocket Chat14












proveedor cloud









56


















57


423 Hypotesis VPN















58











ownload





mework



headers





59









forma











60


















61














62








requirementstxt





63








- Hypotesis Context



Salida API REST



- Hypotesis Item


Salida API REST




64

- Hypotesis Enrol


Salida API REST






Salida API REST


Salida API REST


usuarios

Salida API REST



Salida API REST

- Hypotesis Chat



Salida API REST

- Hypotesis Forum


65


Salida API REST



Salida API REST

427 Hypotesis DB











HYPOTESIS DB


66









67



se configure



FROM mysql8019


versioacuten 8019












onhtml



axios


68


bootstrap


bootstrap-vue


vue-router


vuex


sass


frontales

429 Hypotesis Pro









69










70








aplicativo



71









o libreriacuteas



43 Hypotesis API













72



servicio






73
















74












Mis cursos

Escuela Comuacuten


75













educativo



~ de trabajo







76





o Licencia




o Licencia




77

453 Eslogan




454 Colores














78






79


Tipografiacutea

- Tiacutetulo H1


- Tiacutetulo H2


- Tiacutetulo H3


- Paacuterrafo


Botones








80












Formularios

- Caja de texto



- Opciones


81



- Fecha



- Selector


- Adjuntar archivo



Modales

Modal informativo


82


Modal de error

Tabla


83

Calendario

Etiquetas y enlaces

Video

Cartas


84






85




86




87




88




89




90



91





92




93




94




95




96




97




98




99





100




101




102




103




104



















105

53 Docker Compose








windows-home













106


























107




contenedores











Cloud Platform












nuestra plataforma



108









109








docker images





110


docker container ls





en el puerto 3306


Windows)






111
































112




Microservicios











por los alumnos




Nuevos iacutetems

o Actividades

Debate

SCORM

H5P

Interactivos HTML5

Videoconferencias


o Recursos

Audio

Video

Archivos PDF

Paacuteginas HTML5




Infraestructura




113


API




Pruebas








o Jenkins

o Puppet






114






a-oauth-2-es





























onlinewebinar


115






tutorial


















para-que-sirve



your-needs-best





management-systems







116





































117








usuarios







118








Pro en formato PNG














119









PROGRAMADOR PHP



















virtual





Eurofighter



120

1 Introduccioacuten

11 Proacutelogo

12 Definicioacuten







16 Presupuesto






22 Competencia









3 Propuesta

31 Hypotesis Open


33 Hypotesis Pro

34 Hypotesis School

341 Hypotesis Code











4 Disentildeo





423 Hypotesis VPN




427 Hypotesis DB


429 Hypotesis Pro


43 Hypotesis API







453 Eslogan

454 Colores










53 Docker Compose





6 Demostracioacuten




71 Conclusiones



Bibliografiacutea

Recursos

Anexos


13



14


























15

























16

12 Definicioacuten























17















School


18










educativa




discapacidades
















19






de archivos CSV






de estudio






















20














21









del proyecto







22




















23















24










Lo-Fi

Hi-fi






Framework Django





Backend (Django)



Frontend (VueJs)

bull Hypotesis Pro







25















26

16 Presupuesto















Marca 6



Prototipo Hi-Fi 8

Manager 8






Hypotesis Pro 20

Hypotesis School 60


TOTAL 35000 euro


27














TOTAL 1540 euro










TOTAL 3500 euro


28





















arquitecturas









29
































30

22 Competencia



Moodle (PHP)



















31

Sakai LMS (Java)










universitario



32

Claroline (PHP)















33

Dokeos (PHP)






servidores









34

Chamilo (PHP)






este proyecto










amplia



35















36








libre



37


Canvas LMS (Ruby)

















desarrolladores


38




















39

Cornerstone
















40

Schoology










de 10$ por usuario


41

































42

















aplicaciones




43




a alumnos


31 Hypotesis Open







44






por el momento




- Usuarios





- Contextos


















45

33 Hypotesis Pro











bull Usuarios




















46




bull Usuarios





Zoom Interactivos


usuarios




institucioacuten




certificados etc

34 Hypotesis School









bull Escuela



47

bull Usuario











bull Escuela




bull Usuario






bull Chat



341 Hypotesis Code






48


























49















usuario matriculado














50



51












- Campantildeas







la comunidad














52


- Campantildeas



novedades



visitantes


plataforma









o Empresas






o Escuelas privadas

Informaacutetica

Autoescuelas

Idiomas







53
















la comunidad






54





























55


Classroom



Rocket Chat14












proveedor cloud









56


















57


423 Hypotesis VPN















58











ownload





mework



headers





59









forma











60


















61














62








requirementstxt





63








- Hypotesis Context



Salida API REST



- Hypotesis Item


Salida API REST




64

- Hypotesis Enrol


Salida API REST






Salida API REST


Salida API REST


usuarios

Salida API REST



Salida API REST

- Hypotesis Chat



Salida API REST

- Hypotesis Forum


65


Salida API REST



Salida API REST

427 Hypotesis DB











HYPOTESIS DB


66









67



se configure



FROM mysql8019


versioacuten 8019












onhtml



axios


68


bootstrap


bootstrap-vue


vue-router


vuex


sass


frontales

429 Hypotesis Pro









69










70








aplicativo



71









o libreriacuteas



43 Hypotesis API













72



servicio






73
















74












Mis cursos

Escuela Comuacuten


75













educativo



~ de trabajo







76





o Licencia




o Licencia




77

453 Eslogan




454 Colores














78






79


Tipografiacutea

- Tiacutetulo H1


- Tiacutetulo H2


- Tiacutetulo H3


- Paacuterrafo


Botones








80












Formularios

- Caja de texto



- Opciones


81



- Fecha



- Selector


- Adjuntar archivo



Modales

Modal informativo


82


Modal de error

Tabla


83

Calendario

Etiquetas y enlaces

Video

Cartas


84






85




86




87




88




89




90



91





92




93




94




95




96




97




98




99





100




101




102




103




104



















105

53 Docker Compose








windows-home













106


























107




contenedores











Cloud Platform












nuestra plataforma



108









109








docker images





110


docker container ls





en el puerto 3306


Windows)






111
































112




Microservicios











por los alumnos




Nuevos iacutetems

o Actividades

Debate

SCORM

H5P

Interactivos HTML5

Videoconferencias


o Recursos

Audio

Video

Archivos PDF

Paacuteginas HTML5




Infraestructura




113


API




Pruebas








o Jenkins

o Puppet






114






a-oauth-2-es





























onlinewebinar


115






tutorial


















para-que-sirve



your-needs-best





management-systems







116





































117








usuarios







118








Pro en formato PNG














119









PROGRAMADOR PHP



















virtual





Eurofighter



120

1 Introduccioacuten

11 Proacutelogo

12 Definicioacuten







16 Presupuesto






22 Competencia









3 Propuesta

31 Hypotesis Open


33 Hypotesis Pro

34 Hypotesis School

341 Hypotesis Code











4 Disentildeo





423 Hypotesis VPN




427 Hypotesis DB


429 Hypotesis Pro


43 Hypotesis API







453 Eslogan

454 Colores










53 Docker Compose





6 Demostracioacuten




71 Conclusiones



Bibliografiacutea

Recursos

Anexos

Plataforma e-Learning con metodología DevOps (Hypotesis)

Documents

Transcript of Plataforma e-Learning con metodología DevOps (Hypotesis)