e.t.s. ingeniería de sistemas...
TRANSCRIPT
UNIVERSIDAD POLITÉCNICA DE MADRID
E.T.S. Ingeniería de Sistemas Informáticos
PROYECTO FIN DE GRADO
Grado en Ingeniería del Software
QOS-UPM: Plataforma Web para la gestión de la valoración de la
actividad docente del profesorado universitario. Diseño, implementación, pruebas e implantación del
sistema
Curso 2018/19
Autor: Anthony Joseph Willis Muñoz
UNIVERSIDAD POLITÉCNICA DE MADRID
E.T.S. Ingeniería de Sistemas Informáticos
PROYECTO FIN DE GRADO
Grado en Ingeniería del Software
QOS-UPM: Plataforma Web para la gestión de la valoración de la
actividad docente del profesorado universitario. Diseño, implementación, pruebas e implantación del
sistema
Curso 2018/19
Autora: Anthony Joseph Willis Muñoz Tutora: Soledad Delgado Sanz
i
RESUMEN
El proyecto QOS-UPM (Quality of service) propone analizar, diseñar,
implementare implantarunsistema informáticoonlinepara lagestióndeencuestas
que califican la actividad docente del profesorado de la Universidad Politécnica de
Madrid. Las encuestas a los estudiantes constituyen uno de los procedimientos de
recogida de información más característicos en la valoración de las actividades
docentes.Lavisiónquelosestudiantestienensobrelosprogramasdelasmaterias,el
desarrollo de la enseñanza y sus resultados en términos de aprendizaje tienen un
indudablevalorenlaevaluacióndelaactividaddocentedelprofesoruniversitario.El
sistemadegestióndeencuestasalosalumnossehavenidodesarrollandoalolargode
losañosconunsoportedepapel,tantoenlarealizacióndelasmismasporpartedel
alumnado como en la comunicación de los resultados al profesorado. Este soporte
implica un gasto económico anual en papel y tiene un impacto negativo
medioambiental que puede evitarsemediante el uso de herramientas software que
gestionentodoesteprocesodemaneracompletamentedigital.
Lafinalidaddeesteproyectoeslacreacióndeunaplataformasoftwaredonde
todoslosalumnosdelaUniversidadPolitécnicadeMadridpuedanvalorarlaactividad
docentedemaneraorganizada,segeneren los resultadosestadísticosy los informes
de valoración del profesorado y las asignaturas y, finalmente, se gestione el
almacenamiento, comunicaciónypublicaciónde resultadosa losdistintosmiembros
de laUniversidad.A travésdeestaplataformase facilitará lamejoradelprocesode
evaluación, pudiendo actualizar de manera sencilla las preguntas de valoración del
profesoradoylasasignaturas,asícomolapresentacióndelosresultados.
Eldesarrollocompletodeestaplataformaconllevadiversas tareaspropiasde
unprocesosoftware,entrelasquecabedestacarlarecogidaderequisitosinformales,
formalización y especificación formal de requisitos, análisis ymodelado del sistema,
diseño,implementación,pruebaseimplantación.Dadalaenvergaduraquepresentael
ii
desarrollocompletodeestaplataforma,elproyectoQOS-UPMsehadivididoendos
ProyectosFindeGrado(PFG).EnelPFGquesehaceenestapropuestaseabarcarán
las siguientes fases del proceso software: diseño del sistema, implementación de la
aplicación, pruebas e implantación. Este PFG es la continuación del PFG de título:
“Plataforma Web para la gestión de la valoración de la actividad docente del
profesoradouniversitario.Especificaciónderequisitosyanálisisdelsistema”.
iii
ABSTRACT
QOS-UPM (Quality of service) project proposes the analysis, design, and
implementationofanonlineITsystemforthemanagementofsurveysthatqualifythe
teachingactivityoftheUniversidadPolitécnicadeMadrid.Thesurveystothestudents
areoneofthemostimportantandcharacteristicinformationcollectionproceduresin
the evaluation of teaching activities. The vision that the students have about the
subject’s programs, the development of the teaching and it´s result in terms of
learninghaveanundoubtedvaluefortheteachingactivityandtheirevaluation.This
systemofsurveytothestudentshasbeendevelopedoverthelastyearswithapaper
support,bothinthewaythestudentscompletethesurveyformandinthedeliveryof
resultstotheteachingstaff.Thismethodimpliesanannualeconomicexpenditureon
paperandithasanegativeimpactontheenvironmentthatcanbeavoidedbyusing
softwaretoolsfortheevaluationofuniversityteachingactivitiesinacompletedigital
way.
Thepurposeofthisprojectisthecreationofasoftwareplatformtoassessthe
teachingactivitybythestudentsattheUniversidadPolitécnicadeMadrid,togenerate
thestatisticalresultsandthecorrespondingreportsoftheteachingstaffandsubjects
and,finally,tomanagethestorage,communicationandpublicationofthosereportsto
the different members of the Universidad Politécnica de Madrid. Through this
software application the improvement of the evaluation process of the teaching
activitieswillbefacilitated,andboththeassessmentquestionsfortheteachingstaff
andsubjects,aswellasthepresentationoftheresultscanbeupdatedinasimpleway.
Thecompletedevelopmentprocessofthisplatforminvolvesseveraltasksofa
software process including the collection of the informal requirements, formal
requirements specification, analysis and modelling of the system, design,
implementation, testing and implantation. Given the magnitude of the full
developmentofthisapplication,theQOS-UPMprojecthasbeendividedintotwoPFG.
In thePFG that it ismade in thisproposal, the followingphasesof softwareprocess
willbecovered:softwaredesign, implementation,testingand implantation.ThisPFG
constitutesthesecondphaseofthePFGtitled:“PlataformaWebparalagestióndela
iv
valoración de la actividad docente del profesorado universitario. Especificación de
requisitosyanálisisdelsistema”.
v
INDICE
RESUMEN..........................................................................................................................i
ABSTRACT.......................................................................................................................iii
1. INTRODUCCIÓN.......................................................................................................1
2. OBJETIVOS...............................................................................................................6
3. DISEÑODELSISTEMA..............................................................................................8
3.1. PERSISTENCIA..................................................................................................9
3.1.1. ModeloEntidad-Relación(MER)...................................................................9
3.1.2. Tablas...........................................................................................................11
3.1.3. Atributos......................................................................................................12
3.2. DIAGRAMASDESECUENCIA..........................................................................14
3.2.1. DiagramadesecuenciaparaCasosdeUsotipoCRUD...............................14
3.2.2. DiagramadesecuenciaparaCasosdeUsotipoAsignación......................16
3.2.3. DiagramadesecuenciaparaelCasodeUsoRealizarEncuesta.................17
3.2.4. DiagramadesecuenciaparaelCasodeUsoAccesoaResultadosEstadísticos................................................................................................................18
3.3. DISEÑODEINTERFAZDEUSUARIO...............................................................19
3.3.1. Interfazdeautenticación............................................................................19
3.3.2. Interfazalumno...........................................................................................20
3.3.2.1. Opcionesdelalumno...............................................................................20
3.3.2.2. Opción“Misencuestas”..........................................................................20
3.3.2.3. Opción“VerEstadísticas”........................................................................22
3.3.3. Interfazprofesor..........................................................................................24
3.3.3.1. Opcionesdelprofesor.............................................................................24
3.3.3.2. Opción“Verestadísticas”........................................................................25
3.3.3.3. Opción“Planificaciónacadémica”..........................................................29
3.3.3.3.1. OpcionesdeSubdirectordeOrdenaciónAcadémica..........................30
3.3.3.3.2. OpcionesdeDirectordeDepartamento..............................................34
3.3.3.3.3. Opcionesdecoordinadorasignatura..................................................36
3.3.4. Interfazadministrador................................................................................38
3.3.4.1. Opcionesdeladministrador....................................................................39
3.3.4.2. OpciónConfiguracióndelaUniversidad.................................................39
3.3.4.2.1. OpciónCRUDEscuela...........................................................................40
vi
3.3.4.3. Opción“Asignaciones”............................................................................43
3.3.4.3.1. OpciónAsignacióndepartamentosaescuelas....................................43
3.3.4.4. Opción“Verestadísticas”........................................................................45
3.3.5. Interfazcomún............................................................................................45
3.3.5.1. Visualizaciónderesultadosestadísticos.................................................46
3.3.5.2. Opción“Porescuela”...............................................................................46
3.3.5.3. Opción“PorDepartamento”...................................................................47
3.3.5.4. Opción“PorAsignatura”.........................................................................49
3.3.5.5. Opción“PorAsignaturagrupo”...............................................................49
4. TECNOLOGÍASPARAELDESARROLLODELPROYECTO.........................................52
4.1. TECNOLOGÍABACK-END................................................................................52
4.1.1. Arquitectura................................................................................................53
4.1.1.1. ¿QuéesREST?..........................................................................................54
4.1.1.2. CaracterísticasREST.................................................................................55
4.1.1.3. VentajasdeusarREST.............................................................................55
4.1.1.4. EjemplosdeAPIREST..............................................................................56
4.1.2. Lenguajedeprogramaciónyframework....................................................57
4.1.2.1. Elecciónframework.................................................................................57
4.1.3. GestordeBBDD:MariaDB..........................................................................58
4.1.4. FrameworkparaREST.................................................................................58
4.1.4.1. SWAGGER.................................................................................................58
4.1.4.2. DOCUMENTACIONDEQUOSAPI.............................................................60
4.1.4.3. ResourceEscuelas....................................................................................61
4.1.5. PruebasdellamadasaAPI..........................................................................68
4.1.5.1. POSTMAN.................................................................................................68
4.2. TECNOLOGÍAFRONT-END..............................................................................70
4.2.1. HTML,CSSYJAVASCRIPT............................................................................70
4.2.2. ArquitecturaMVC........................................................................................71
4.2.3. ElecciónFrameworkJavaScript...................................................................72
4.2.3.1. FrameworkdeJavaScript:Angular..........................................................72
5. INSTALACIÓNYPRUEBAS......................................................................................74
5.1. INSTALACIÓN.................................................................................................74
5.1.1. Instalacióndelback-end.............................................................................74
5.1.1.1. AWSVPC..................................................................................................75
5.1.1.2. AWSEC2...................................................................................................75
vii
5.1.1.3. AWSRDS..................................................................................................75
5.1.1.4. InstalaciónydespliegueLaravelenEC2..................................................76
5.1.2. Instalacióndelfront-end.............................................................................79
5.1.2.1. DesplieguedeAngularenAWSS3..........................................................79
5.2. PRUEBAS........................................................................................................85
5.2.1. Definicióndelaestructuradeejemplo......................................................86
5.2.2. Validacióndelafuncionalidadderealizacióndeencuestas......................87
5.2.3. Validacióndelafuncionalidaddegeneracióndeestadísticas...................91
5.2.3.1. Informesestadísticosporasignatura/grupo/profesor...........................91
5.2.3.2. Informesestadísticosporasignatura......................................................98
5.2.3.3. Informesestadísticospordepartamento.............................................100
5.2.3.4. Informesestadísticosporescuela.........................................................102
6. CONCLUSIONES....................................................................................................105
BIBLIOGRAFÍA..............................................................................................................108
APÉNDICEA.Manualdeusuario.................................................................................110
1. Introducción.....................................................................................................110
2. ¿Aquiénvadirigidaestaguía?........................................................................110
3. Soporte............................................................................................................110
4. Manualusuario................................................................................................111
4.1 Funcionalidadcomún“Accesoalaaplicación”..........................................111
4.2 FuncionalidadrolProfesor..........................................................................112
4.3 Funcionalidadrolalumno............................................................................117
4.4 Funcionalidadroladministrador.................................................................120
4.5 Funcionalidadcomún“ExplorarEstadísticas”............................................122
viii
INDICEDEFIGURASFigura3.1.Diagramadeentidadrelación...................................................................10Figura3.2.Tablas.........................................................................................................12Figura3.3.Atributos....................................................................................................13Figura3.4.DiagramadesecuenciaCRUDESCUELA/CU-18.........................................15Figura3.5DiagramadesecuenciaasignarDEPARTAMENTO/ESCUELACU-27............16Figura3.6.DiagramadesecuenciarealizarEncuesta/CU-06.......................................17Figura3.7.Diagramadesecuenciaaccesoaresultadosestadísticos/CU-07...............18Figura3.8.Interfazdeautenticación...........................................................................19Figura3.9.InterfazOpcionesdelalumno....................................................................20Figura3.10.InterfazOpción“Misencuestas”.............................................................21Figura3.11.Interfazrealizarencuesta.........................................................................22Figura3.12.Interfazinformeenvíodeencuesta.........................................................22Figura3.13.Interfazopción“Verestadísticas”............................................................23Figura3.14.Interfazopción“Estadísticasasignaturasmatriculadas”.........................23Figura3.15.Interfazverresultadosestadísticosdeasignaturagrupo........................24Figura3.16.InterfazOpcionesdelprofesor.................................................................25Figura3.17.Interfazopción“Verestadísticas”-Profesor...........................................26Figura3.18.Interfazopción“Susasignaturas”............................................................26Figura3.19.Interfazverestadísticasasignatura-grupo...............................................27Figura3.20.Interfazopción“Asignacióndocente”.....................................................28Figura3.21.Interfazasignacióndocencia....................................................................28Figura3.22.Interfazreportarincidenciadeasignacióndocencia...............................29Figura3.23.Interfazenvióreportarincidencia............................................................29Figura3.24.Interfazopcionesdelsubdirectordeordenaciónacadémica..................30Figura3.25.Interfazopción“Gestióndegrupos”........................................................31Figura3.26.Interfazcreargrupo.................................................................................31Figura3.27.Interfazgrupocreado...............................................................................32Figura3.28.Interfazedicióndeungrupo....................................................................32Figura3.29.Interfazborrargrupo...............................................................................33Figura3.30.Interfazopción“Gestióndeperiododeencuestas”................................33Figura3.31.Interfazopcionesdirectordedepartamento...........................................34Figura3.32.Interfazopcionesdirectordedepartamento...........................................35Figura3.33.Interfazasignarcoordinadoryprofesoresaasignatura..........................35Figura3.34.Interfazopciónverincidenciasdeasignacióndocente............................36Figura3.35.Interfazincidenciasobreasignacióndocente..........................................36Figura3.36.Interfazopcionesdecoordinadorasignatura..........................................37Figura3.37.Interfazlistadeasignaturasquecoordino...............................................37Figura3.38.Interfazlistadeasignaturasgrupos.........................................................38
ix
Figura3.39.Interfazasignarprofesoresagrupo.........................................................38Figura3.40.Interfazopcionesdeladministrador........................................................39Figura3.41.Interfazopcionesdeconfiguracióndelauniversidad.............................40Figura3.42.InterfazopciónCRUDEscuela..................................................................40Figura3.43.Interfazcrearescuela...............................................................................41Figura3.44.Interfazescuelacreada............................................................................41Figura3.45.Interfazeditarescuela.............................................................................42Figura3.46.Interfazborrarescuela.............................................................................42Figura3.47.InterfazopcionesAsignaciones................................................................43Figura3.48.Interfazopciónasignacióndepartamentosaescuelas............................43Figura3.49.Interfazasignacióndepartamentosaescuelas........................................44Figura3.50.Interfazdepartamentoasignadocorrectamente.....................................44Figura3.51.Interfazdepartamentoeliminadocorrectamente...................................45Figura3.52.Interfazopcionesexplorar.......................................................................46Figura3.53.Interfazopción“porescuela”..................................................................47Figura3.54.Interfazverestadísticas“porescuela”.....................................................47Figura3.55.Interfazopción“pordepartamento”.......................................................48Figura3.56.Interfazverestadísticas“pordepartamento”.........................................48Figura3.57.Interfazopción“porasignatura”..............................................................49Figura3.58.Interfazverestadísticas“porasignatura”................................................50Figura3.59.Interfazopción“porasignaturagrupo”...................................................50Figura3.60.Interfazverestadísticas“porasignaturagrupo”.....................................51Figura4.1.ArquitecturaSOAP.....................................................................................53Figura4.2.ArquitecturaREST......................................................................................54Figura4.3.DiagramaarquitecturaREST......................................................................55Figura4.4.EjemploYMLdeswagger...........................................................................59Figura4.5.Ejemplodedocumentacióndeswagger....................................................60Figura4.6.DocumentaciónQOSAPIparte1................................................................60Figura4.7.DocumentaciónQOSAPIparte2................................................................61Figura4.8.DocumentaciónentidadEscuela................................................................61Figura4.9.ResourceGET/escuelas.............................................................................62Figura4.10.Parámetrosresource/escuelas................................................................63Figura4.11.Respuestaresource/escuelas..................................................................63Figura4.12.ResourcePUT/escuelas/{id_escuela}...........................................................64Figura4.13.Parámetrosresource/escuelas/{id_escuela}...........................................64Figura4.14.Respuestaresource/escuelas/{id_escuela}.............................................65Figura4.15.ResourceDELETE/escuelas/{id_escuela}.................................................66Figura4.16.ParámetrosyrespuestadeDELETE/escuelas/{id_escuela}.....................66Figura4.17.ResourcePOST/escuelas.............................................................................67Figura4.18.ParámetrosPOST/escuelas.........................................................................67Figura4.19.RespuestaPOST/escuelas........................................................................68Figura4.20.InterfazPOSTMAN...................................................................................69Figura4.21.LlamadaaGET/escuelasPOSTMAN........................................................69Figura4.22.ArquitecturaMVC....................................................................................71Figura5.1.LoginenEC2...............................................................................................76Figura5.2.BucketS3....................................................................................................79Figura5.3.CrearbucketPaso1...................................................................................80
x
Figura5.4.CrearbucketPaso2...................................................................................81Figura5.5.CrearbucketPaso3...................................................................................81Figura5.6.CrearbucketPaso4...................................................................................82Figura5.7.Vistabucketvacío......................................................................................82Figura5.8.Subidaficherosalbucket...........................................................................83Figura5.9.Vistabucketconnuestraaplicacióncompilada.........................................83Figura5.10.Pestañapermissionsdelbucket...............................................................84Figura5.11.Pólizaquetendráelbucket......................................................................84Figura5.12.Configuracióndelíndicedelwebserver...................................................85Figura5.13.PaginaQOSUPM......................................................................................85Figura5.14.EstructuraconD1.....................................................................................87Figura5.15.EstructuraconD2.....................................................................................88Figura5.16.Opción“Misencuestas”-App.................................................................89Figura5.17.OpciónRealizarencuestaInstrucciones-App.........................................89Figura5.18.OpciónRealizarencuestaPreguntasasignaturas-App...........................90Figura5.19.OpciónRealizarencuestaPreguntasprofesorparte1-App...................90Figura5.20.OpciónRealizarencuestaPreguntasprofesorparte2-App...................90Figura5.21.ResultadoestadísticoASG1/G11–Resultadoasignatura........................92Figura5.22.ResultadoestadísticoASG1/G11–ResultadopreguntaPF1...................92Figura5.23.ResultadoestadísticoASG1/G11–ResultadopreguntaPF2...................92Figura5.24.ResultadoestadísticoASG1/G11–Graficotipo1....................................93Figura5.25.ResultadoestadísticoASG1/G11–Graficotipo2profesor1..................93Figura5.26.ResultadoestadísticoASG1/G11–Graficotipo2profesor2..................93Figura5.27.ResultadoestadísticoASG1/G11–Graficotipo3....................................94Figura5.28.ResultadoestadísticoASG3/G12–Resultadoasignatura........................94Figura5.29.ResultadoestadísticoASG3/G12–ResultadopreguntaPF3...................94Figura5.30.ResultadoestadísticoASG3/G12–ResultadopreguntaPF4...................95Figura5.31.ResultadoestadísticoASG3/G12–Graficotipo1....................................95Figura5.32.ResultadoestadísticoASG3/G12–Graficotipo2profesor3..................95Figura5.33.ResultadoestadísticoASG3/G12–Graficotipo2profesor4..................96Figura5.34.ResultadoestadísticoASG3/G12–Graficotipo3....................................96Figura5.35.ConteoasignaturaASG1/G11..................................................................97Figura5.36.ConteoprofesoresPF1yPF2enASG1/G11.............................................97Figura5.37.ConteoasignaturaASG3/G12..................................................................97Figura5.38.ConteoprofesoresPF3yPF4enASG3/G12.............................................98Figura5.39.ResultadoestadísticoASG1–Resultadopreguntasasignatura...............98Figura5.40.ResultadoestadísticoASG1–Resultadopreguntasprofesorado............99Figura5.41.ResultadoestadísticoASG1–Gráficotipo1............................................99Figura5.42.ResultadoestadísticoASG1–Gráficotipo2............................................99Figura5.43.ResultadoestadísticoASG1–Gráficotipo3..........................................100Figura5.44.ResultadoestadísticoD1–Resultadopreguntasasignatura.................101Figura5.45.ResultadoestadísticoD1–Resultadopreguntasprofesorado..............101Figura5.46.ResultadoestadísticoD1–GráficoTipo1..............................................101Figura5.47.ResultadoestadísticoD1–GráficoTipo2..............................................102Figura5.48.ResultadoestadísticoD1–GráficoTipo3..............................................102Figura5.49.ResultadoestadísticoE1–Resultadopreguntasasignatura..................103Figura5.50.ResultadoestadísticoE1–Resultadopreguntasprofesorado...............103
xi
Figura5.51.ResultadoestadísticoE1–GráficoTipo1..............................................103Figura5.52.ResultadoestadísticoE1–GráficoTipo2..............................................104Figura5.53.ResultadoestadísticoE1–GráficoTipo3..............................................104FiguraA.1.Pantalla-Iniciarsesión............................................................................111FiguraA.2.Pantalla-Explorarestadísticas................................................................112FiguraA.3.OpciónAsignaciónprofesoresaasignaturaGrupos.................................113FiguraA.4.PantallaAsignaciónasignaturaGruposaalumnos..................................113FiguraA.5.PantallaProfesoresdelaasignaturagrupo.............................................114FiguraA.6.Pantalladesasignarprofesordelaasignaturagrupo..............................114FiguraA.7.Pantallaasignarprofesordelaasignaturagrupo....................................114FiguraA.8.OpciónCRUDCursos................................................................................115FiguraA.9.PantallaCRUDCursos..............................................................................116FiguraA.10.PantallaFiltradoCursos.........................................................................116FiguraA.11.PantallaAgregarCurso..........................................................................116FiguraA.12.PantallaEdición/EliminaciónCurso.......................................................117FiguraA.13.Opción“Misencuestas”-Anexo...........................................................118FiguraA.14.PantallaMisencuestasdisponibles.......................................................118FiguraA.15.PantallaEncuesta-Instrucciones..........................................................119FiguraA.16.PantallaEncuesta–Preguntasrelativasaasignatura............................119FiguraA.17.PantallaEncuesta–Preguntasrelativasaprofesoradoparte1.............119FiguraA.18.PantallaEncuesta–Preguntasrelativasaprofesoradoparte2.............120FiguraA.19.Opción“Explorarestadísticas”..............................................................122FiguraA.20.Pantalla“Explorarestadísticas”parte1................................................122FiguraA.21.Pantalla“Explorarestadísticas”parte2................................................123FiguraA.22.PantallaEscuelasderesultadosestadísticos.........................................123FiguraA.23.Pantalladeresultadosestadísticos-resultadosasignatura..................124FiguraA.24.Pantalladeresultadosestadísticos-resultadosprofesorado...............124FiguraA.25.Resultadosestadísticos–GráficoTipo1...............................................124FiguraA.26.Resultadosestadísticos–GráficoTipo2...............................................125FiguraA.27.Resultadosestadísticos–GráficoTipo3...............................................125
1
1. INTRODUCCIÓNEl Espacio Europeo de Educación Superior (EEES) es un plan puesto en marcha en
Europaapartirde laDeclaracióndeBoloniade1999,parafavorecer laconvergencia
europea en materia de Educación Superior [1]. Entre otras actuaciones, el EEES
establece el principio de calidad como base para la mejora en las universidades
europeas [2]. La European Association for Quality Assurance in Higher Education
(ENQA)esunaorganizaciónquerepresentaalasorganizacionesdecontroldecalidad
de los Estadosmiembros del EEES, que se ha encargado de formular los criterios y
directricespara lagarantíade lacalidadenelEEES [3]. LaConferenciadeMinistros
europeos responsables de la Educación Superior celebrada en Bergen en 2005 se
comprometió a introducir elmodelode calidadelaboradopor ENQAa travésde las
agenciasdecalidadyacreditaciónnacionales.
Enelámbitoespañol, laAgenciaNacionaldeEvaluaciónde laCalidadyAcreditación
(ANECA), en coordinación con las distintas agencias autonómicas, es la entidad
responsabledelaevaluacióndelaactividaddocentedelprofesoradouniversitario[4].
LaANECAhasidolaresponsabledeldesarrollodelProgramadeapoyoalaevaluación
delaactividaddocentedelprofesoradouniversitario(DOCENTIA),queestablecequeel
diseño y desarrollo de los títulos oficiales (grado/master) debe realizarse soportado
porunsistemadecalidad,enelquelaevaluacióndelaactividaddocentedebeestar
presente.
Las universidades públicas del territorio español y, entre ellas, la Universidad
PolitécnicadeMadrid(UPM),participaenelprogramaDOCENTIAdelaANECA.Eneste
ámbito, laUPMhaelaboradoelProcedimientodeevaluaciónde laactividaddocente
delprofesoradodelaUPM,queentreotrosaspectosrecogelosmodelos,protocolose
2
informes de evaluación a aplicar en el contexto del programa DOCENTIA-UPM
[5][6][7].
ElprocesodeevaluacióndelaactividaddocentedelprofesoradodelaUPMconstade
varioscomponentes,siendounodeelloslasencuestasperiódicasrealizadasporparte
de los alumnos, en las que se busca ponderar la visión de los estudiantes en lo
referente a los programas de las asignaturas y el desarrollo de la enseñanza y sus
resultadosenbasea la laborrealizadaporelprofesor.Lasencuestasde losalumnos
analizan la planificación, desarrollo y resultados de la actividad docente en aquellos
aspectos que puede valorar el estudiante, tal y como lo establece el programa
DOCENTIA.
En general, en las escuelas que conforman la UPM, el proceso de evaluación de la
actividaddocentedelprofesoradomedianteencuestasperiódicasalosalumnosseha
venidodesarrollandoalolargodelosañosconunsoportedepapel.Segúnpublicala
UPMensupáginaWeb(http://www.upm.es/UPM/UPMCifras),elnúmerodealumnos
matriculadosenel curso2017-2018enalgunadesus52 titulacionesdegradoesde
31387.Haciendouncálculogrossomodo,siconsideramosqueunalumnodegradose
matricula de un promedio de 10 asignaturas al año (5 por cuatrimestre), que cada
asignaturalaimparteunúnicoprofesoryqueelporcentajedealumnosquerealizala
encuesta es de un 50%, el número de encuestas que se rellenarían en la UPM
anualmenteseríade150000.Paralarealizacióndeunaencuestaseconsume,porun
lado,lahojaderespuestasquerellenaelalumnoy,porotrolado,lahojainformativa
sobre cómo realizar la encuesta. Esto significa que se precisan alrededor de 300000
foliosimpresos,loquesupone600paquetesde500folios.Considerandounpreciode
2,5€porpaquetede500foliosyhaciendouncálculoa labaja (el folioenelque los
alumnosrellenanlasrespuestasesunpapeldealtacalidad,especialparalaslectoras
deencuestasymáscaroqueunDINA4normal),elgastorelacionadoconesteaspecto
rondaría los 1500€ anuales. También hay que valorar el consumo de toner para
imprimirtantolasencuestascomolahojainformativa.Considerandountonermedio,
conuncostede100€yconcapacidadparaimprimir1000páginas,senecesitarían300
cartuchos, por lo que el gasto relacionado con este factor estaría alrededor de los
30000€.Solamentevalorandoelgastoenfoliosytoner,elsistemaderealizacióndelas
encuestasbasadoen soportedepapel suponeungastodeunos31500€anuales.Al
3
costeeconómiconecesarioparalarealizacióndelasencuestashayquesumartambién
elnecesarioenpapely tónerpara imprimir los resultadosde lasmismas (resultados
por profesor, asignatura, departamento y centro) que se envían a los profesores
encuestados,asícomoalosdirectoresdedepartamentoydecentro.
Además del gasto económico que supone el sistema de encuestas de los alumnos
basadoensoportedepapel,cabedestacarel impactomedioambientalqueproduce,
ya que fabricar papel necesita demuchos recursos, principalmente celulosa, que se
extraede losárboles.Hoyendía, latecnologíanosofrece lasherramientassoftware
necesarias para transformar estos procesos costosos económica y
medioambientalmente,permitiendosugestióndemaneracompletamentedigital.
Varias Universidades del territorio español han puesto en marcha aplicaciones
informáticaspara larealizaciónde lasencuestasalprofesorado,comolaUniversidad
AutónomadeMadrid[8],laUniversidaddelPaísVasco[9]olaUniversidaddeSevilla
[10]. Estas aplicaciones han permitido agilizar el proceso de realización de las
encuestasydeemisióndelosresultados,hanfacilitadoelusodenuevoscuestionarios
y han ayudado en la elaboración de informes más completos, todo ello mediante
sistemasonline.
Unodelosproblemasquepresentaelsistemadeevaluacióndeencuestasactualesla
baja participación de los estudiantes en lasmismas. La posibilidad de realizar estas
encuestas mediante un sistema online no asegura una mejora en este aspecto. De
hecho, es previsible que la participación de los alumnosmediante el sistema online
inclusoseamenorquemedianteelsistemadeencuestasenpapel.Sinembargo,eluso
de una aplicación online permite plantear nuevas estrategias que incentiven su
realización, teniendoen cuenta que algunas de ellas no serían viables en el sistema
actualbasadoenpapel.Enestalínea,laUniversidadAutónomadeMadrid[8]propone
lassiguientessugerenciasparafomentarlaparticipacióndelosalumnos:
● Explicara losalumnosque lasencuestasson importantes institucionalmente:
sonnecesariasenlaacreditacióndetítulos,losresultadossetienenencuenta
enlosprocesosdepromocióndelprofesorado,sonsolicitadasporlasagencias
de evaluación para la acreditación de los docentes y son necesarias para la
promocióndelacalidadenlauniversidad.
4
● Destinar tiempo de clase para que los alumnos completen la encuesta
utilizandosusteléfonosmóviles,sustabletasosusordenadoresportátiles(un
producto software completo ofrecería la gestión de encuestas tanto por
accesoWebatravésdeunnavegadorcomomedianteAppsparamóviles).
● Recordar a los alumnos que las encuestas son cortas, y se rellenan en poco
tiempo.
● Indicar a los alumnos que tendrán acceso abierto a los resultados de las
encuestasyquepuedenserlesmuyútiles.Podránconsultarelresultadodelas
encuestas (asignatura, Departamento y Centro) por curso y semestre, para
saber lo queopinaron sus compañeros sobre las asignaturas que cursarono
quevayanacursar.
Porotrolado,tenerlaposibilidaddedisponerdeunsistemaonlineparalagestiónde
encuestas,talycomoseplanteaenestePFG,presentalassiguientesventajas:
● Resultaeconómico.Ahorroenpapel,en tonersde impresorasyencompray
mantenimientodelectorasdeencuestaseimpresoras.
● El alumnado puede dar su opinión en cualquier momento (dentro del plazo
establecido) y desde cualquier lugar, siempre y cuando cuente con un
ordenador/móvil (este último caso sólo si llega a desarrollarse la App para
móvil).
● Elalumnadoexpresasuopinióncontotallibertadaltiempoquesegarantizael
anonimato.
● Laspersonasencuestadastienentiempoparaelaboraryrevisarsusrespuestas.
● Adiferenciadel sistema"autopase"ydeldeencuestadores,opinaronlineno
requiereinterrumpirladocenciadadoquenohayqueencuestarenelaula.
El resto de este documento está organizado de la siguiente manera: el capítulo 2
presenta los objetivosdel PFG; el capítulo 3 incluye los aspectos considerados en la
fase de diseño de la aplicación QOS-UPM; el capítulo 4 contiene una descripción y
justificacióndelatecnologíaseleccionadaparala implementacióndelaaplicación;el
capítulo 5 incluye los detalles de la instalación de la aplicación, así como una
5
descripcióndelaspruebasdefuncionalidadalasquesehasometidoalamisma;por
último,elcapítulo6 incluye lasconclusionesyposibles líneasdeampliacióndelPFG.
Además,estamemoriacontieneunapéndiceconelmanualdeusuariodelaaplicación
QOS-UPM.
6
2. OBJETIVOSEnestePFGseplanteacomoobjetivoprincipaleldiseño,implementación,pruebase
implantación de un sitio Web para la gestión de encuestas de calificación de la
actividaddocentedelprofesorado,siguiendolanormativaqueexistealrespectoenla
UniversidadPolitécnicadeMadrid (UPM).Estetrabajoes lacontinuacióndelPFGde
título “QOS-UPM: PlataformaWeb para la gestión de la valoración de la actividad
docente del profesorado universitario. Especificación de requisitos y análisis del
sistema”desarrolladoporVerónicaMerinoGómez[11].
Engeneral,LafuncionalidadqueabordarálaimplementacióndeQOS-UPMabarca:
• La realización de las encuestas por parte de los alumnos (garantizando su
anonimato),
• Lagestiónde laorganizacióndelprocesodeencuestasalprofesoradodentro
de cada centro (períodos de realización de las encuestas, grupos por curso,
profesoresporasignaturaygrupo,alumnosmatriculadosencadaasignaturay
grupo,etc.
• Lageneracióndelosinformesypublicacióndelosresultadosdelasencuestas
para su consulta vía online (garantizando la privacidad de acceso
correspondiente).
Adiferenciade las fasesdeanálisis ymodeladode requisitosasí comoelmodelado
conceptualdelaaplicación,lasfasesdelprocesosoftwarerealizadasenesteproyecto
son totalmente dependientes de la tecnología. Sin embargo, dado que el objetivo
principaldelproyectoplanteaeldesarrollodeunsitioWebcomoplataformasoftware
para la aplicación propuesta, el back-end final podría reutilizarse para alguna
7
ampliación concretadel sistema, comopuede sereldesarrollodeAPIsparamóviles
AndroidyiOSparalarealizacióndelasencuestasyconsultaporpartedelosalumnos,
asícomoparalaconsultadelosresultadosporpartedelosprofesores,directoresde
departamentoyeldirectordelcentro.
Talycomosehacomentadopreviamente,unodelosobjetivosconcretosdeestePFG
plantea como funcionalidad la gestión de la organización de los centros,
departamentos, profesorado, alumnos, etc. Actualmente, los sistemas informáticos
centralesdelaUPMrealizanymantienengranpartedeestagestión(organizaciónde
centros,titulaciones,asignaturasportitulación,departamentos,profesoresadscritosa
cadadepartamento,asignaturasen lasqueestámatriculadocadaalumno,etc.).Por
otrolado,cadaEscuelaseencargadeorganizarcadacursoacadémicolosgruposque
seabrenparacadaasignaturaimpartidaenelCentro.LamayoríadelasEscuelasdela
UPMdisponendeaplicacionesqueusanlosalumnosantesdelcomienzodecursopara
seleccionarelgrupoalquequierenasistirencadaunade lasasignaturasen lasque
está matriculado. Teniendo en cuenta estos dos aspectos, se plantea como futura
ampliación la integración del sistema de gestión de encuestas de calificación de la
actividad docente del profesorado (QOS-UPM) con los sistemas informáticos de la
UPM, tanto centrales como locales a cada Escuela, de forma que se simplifique la
gestiónquesevaaconsiderarparaestePFG,evitandodeestamaneraduplicidadesde
funcionalidad.
8
3. DISEÑODELSISTEMA
ParaeldesarrollodeestePFGseoptóporelusodeunmodelodeprocesosoftware
tradicional,talycomosejustificaen[11].Además,enlafasedeanálisisseseleccionó
unaarquitecturasoftwaredetresniveles(capadepresentación,capadelógicadela
aplicaciónycapadedatosopersistencia),quepermitiómodelarlacapadelógicadela
aplicacióndemaneraindependientealosaspectosdediseño,comosonellenguajede
programaciónyelgestordeBBDD.Enesteapartadoseincluyelaformalizacióndelas
otras dos capas de esta arquitectura software para la aplicación QOS-UPM:
persistenciaypresentación,ambasdependientesdelatecnologíaqueseseleccione.
La capadepersistencia se formalizará conunModeloEntidad-Relación (MER), dado
quesehaseleccionadoungestordeBBDDrelacionalparadarsoportealapersistencia
(ver capítulo 4). Además, mediante diagramas de secuencia se modelarán las
interacciones entre los objetosde la aplicación, dejando constancia de losmensajes
que se intercambianpara implementar la funcionalidadprincipaldefinidaen [11], lo
quepermitirá identificar loscomponentessoftwarequetendránrelacióndirectacon
lasentidadesyrelacionesdelaBBDD.Porotrolado,lacapadepresentaciónsecubrirá
con la propuesta de diseño de la interfaz de usuario de la aplicación, siguiendo los
requisitosdocumentadosen[11]. Paralaformalizacióndelacapadepersistenciase
ha seleccionado el diagrama MER con el estilo de Chen y UML (Unified Modelling
Language)comolenguajedemodeladoparalosdiagramasdesecuencia[12],mientras
queparalacapadepresentaciónsehautilizadounaherramientallamadaLucidChart,
quepermitelarealizacióndeinterfacesdeusuarioconmockspredefinidos.
9
3.1. PERSISTENCIAEnesteapartadoserecogenlosdiferentesaspectosparalarealizacióndelmodelado
de la BBDD que dará soporte a la persistencia de la aplicación. El gestor de BBDD
escogido para la persistencia de los datos de la aplicación ha sido el MARIADB
(detallado en el capítulo 4). Al ser MARIADB un gestor de BBDD relacional, para
modelarlacapadepersistenciasehaseleccionadoMER,queencajaconelgestorde
BBDD escogido. Además, siguiendo en la línea del lenguaje de modelado de la
aplicación seleccionado y justificado en [11], se utilizará UML para realizar los
diagramasdesecuencia.
ParaexplicarendetalleelmodelodepersistenciaymejorarelentendimientodelMER
sehadivididoesteapartadoen3subapartados:modeloEntidad-Relaciónqueincluye
soloeldiagramasinatributosparafacilitarsu legibilidad, lastablasquesegenerana
partirdeldiagramaMERylosatributosquetendrácadaunadelastablas.
3.1.1. ModeloEntidad-Relación(MER)Elmodeloentidad-relación representa lasentidades relevantesdel sistemaasí como
lasrelacionesquesurgenentreellas,siendounaentidaduncomponentededatosque
dasoportealainformaciónlógicadelaaplicación.Pararealizarestemodeladoseha
usadoeldiagramaMERconelestiloChen,querecogetodalaestructuralógicadela
basededatosquedarásoporteaQOS-UPM(Figura3.1).
10
Figura3.1.Diagramadeentidadrelación.
11
El diagrama MER guarda cierta similitud con el modelo conceptual (diagrama de
clases) de QOS-UPM [11], exceptuando ciertos aspectos, como la relación entre
PersonayEstadística,necesariaeneldiagramadeclasesdelaaplicaciónparamodelar
el acceso de los usuarios a las estadísticas, pero innecesaria a nivel de persistencia.
Otrocambiodestacableeslaausenciadelascabecerasydelatabladeresultadosen
el MER, ya que no es necesario almacenarlas. Por último, en el MER cambian las
relaciones entre los conceptos AsignaturaGrupo, Grupo y Curso a nivel estructural,
perosinmodificarelsignificadológicodelmismo.
3.1.2. Tablas
EnesteapartadoseincluyenlastablasfinalmenteobtenidasapartirdelMERexpuesto
enelapartadoanterior.Lamayoríadelastablasgeneradassecorrespondenconuna
entidad delMER. Además, todas las relaciones con cardinalidadN:M también crean
finalmenteunatablarelacionalquemantiene lasreferenciasentreambasentidades,
asícomoposiblesatributosdelapropiarelación
Losnombresdecadatablasecorrespondenconelnombredecadaentidadenplural
(por ejemplo, la entidad Alumno se corresponde con la tabla “alumnos”). Por otro
lado, el nombre de las tablas relacionales sigue una fusión de los nombres de cada
entidadseparadospor“_”(porejemplo,AsignaturayGradoformanlatablarelacional
“asignatura_grado”).AlgunadelastablasquesemuestranenlaFigura3.2nohansido
generadas a partir del MER (Figure 3.1), pero están incluidas en el framework que
hemosdecididoutilizarparaeldesarrollodelaaplicación(vercapítulo4).
12
Figura3.2.Tablas.
3.1.3. AtributosEn este apartado se exponen los atributos correspondientes al MER presentado
previamente Hemos generado el diagrama que vemos en la figura 3.3 con la
herramientaMYSQLWORKBENCHconlacaracterísticadenominadaingenieríainversa.
Como podemos ver en la figura, cada tabla tiene sus respectivos atributos que se
corresponden con los que tendrían las entidades definidas en elMER y también los
quetendríanlastablasrelacionales.Lasprimarykeyestánmarcadasconunallaveylos
atributosconunrombo.
13
Figura3.3.Atributos.
14
3.2. DIAGRAMASDESECUENCIA
Enesteapartadousaremoslosdiagramasdesecuenciaparamodelarlasinteracciones
entre los objetos y las clases de la aplicación involucradas en un escenario
determinado, reflejando la secuenciademensajesque se intercambianpara llevara
cabounafuncionalidadenconcreto.Estosdiagramassehandesarrolladopartiendode
la basedequeQOS-UPMes una aplicaciónWeb y por tanto existirán componentes
queresidenenelfront-end(cliente)oenelback-end(servidor),siendoestosúltimos
losquetendránaccesoalastablasdelaBBDD.
Paramodelarlosdiagramasdesecuenciaexpuestosenesteapartadosehautilizadoel
lenguajedemodeladoUML[12].Elapartadosehaorganizadoen4subapartadosque
representan el agrupamiento de todos los requisitos en base a la lógica de la
funcionalidadde laaplicación:a) losrequisitosdetipoCRUD(Crear,Leer,Actualizar,
Borrar)sobreentidades;b)losrequisitosdetipoasignaciónquerepresentanaltasde
las relaciones entre entidades (por ejemplo, asignar alumnos a una escuela); c) la
realización de una encuesta por parte de un alumno; d) el acceso a los resultados
estadísticosporpartedecualquierusuariodelaaplicación.
3.2.1. DiagramadesecuenciaparaCasosdeUsotipoCRUDEnelcontextodelaaplicaciónsurgeconbastantefrecuencialafuncionalidaddetipo
CRUDqueseaplicaalamayoríadelasentidadesdelmodeloMER.Enesteapartadose
expone un ejemplo del flujo de esta funcionalidad con un diagrama de secuencia,
concretamente para el caso de la entidad Escuela, donde podremos ver cómo se
realizaunalta,modificación,consultayborradodeunaescuela(Figura3.4).
Eldiagramadesecuenciatienecomoactorprincipalaladministrador,dadoqueesel
únicotipodeusuarioquepuedellevaracaboestafuncionalidadenlaaplicación.Por
otra parte, tenemos EscuelaController (back-end) que se encargara de resolver las
peticionesrealizadasporelcontroladordelfront-endllamadoEscuelaComponent.
15
Figura3.4.DiagramadesecuenciaCRUDESCUELA/CU-18.
16
3.2.2. DiagramadesecuenciaparaCasosdeUsotipoAsignaciónOtra funcionalidad habitual en la aplicación es la de asignación, que representa la
realización de un alta de una relación entre entidades del MER. Como ejemplo de
asignación, la Figura 3.5 visualiza el diagrama de secuencia quemuestra el flujo de
mensajesqueseproduceenlaasignacióndedepartamentosaunaescuela.
Figura3.5.DiagramadesecuenciaasignarDEPARTAMENTO/ESCUELACU-27.
Eldiagramadesecuenciatienecomoactorprincipalaladministrador,dadoqueesel
únicotipodeusuarioquepuedellevaracaboestafuncionalidadenlaaplicación.Por
otra parte, tenemos EscuelaController y EscuelaDepartamentoController (back-end)
que se encargarande resolver las peticiones realizadaspor el controladordel front-
endllamadoAsignarEscuelaComponent.
17
3.2.3. DiagramadesecuenciaparaelCasodeUsoRealizarEncuestaLa realización de encuestas representa una de las principales funcionalidades que
tendrá laaplicaciónymodelaelhechodequeunalumnorellene laencuestadeuna
asignaturadelaqueestámatriculado,enungrupoconcretoqueimpartenunoomás
profesores(Figura3.6).
Figura3.6.DiagramadesecuenciarealizarEncuesta/CU-06.Eldiagramadesecuenciatienecomoactorprincipalalalumnoporqueeselúnicotipo
de usuario que puede llevar a cabo esta de funcionalidad en la aplicación. Por otra
parte, tenemos AsignaturaGrupoController, PreguntaController y EncuestaController
(back-end)queseencargaránderesolver laspeticionesrealizadasporelcontrolador
delfront-endllamadoShowEncuestasComponent.
18
3.2.4. DiagramadesecuenciaparaelCasodeUsoAccesoaResultados
EstadísticosElaccesoa losresultadosestadísticosesotrade lasfuncionalidadesprincipalesde la
aplicación.Englobalosrequisitosdevisualizacióndelosinformesderesultadosdelas
encuestas por escuela, departamento, asignatura y asignatura-grupo-profesor,
solicitadosporpartede cualquierade losusuariosdel sistema.Comoejemplo seha
modelado el diagrama de secuencia correspondiente al acceso de un alumno a los
resultadosestadísticosdeunaasignaturagrupo(Figura3.7).
Figura3.7.Diagramadesecuenciaaccesoaresultadosestadísticos/CU-07.
El diagrama de secuencia modelado como ejemplo tiene como actor principal al
alumno, aunque todos los tipos de usuario pueden acceder a todos los resultados
estadísticos.Porotraparte,tenemosAsignaturaGrupoController,RecuentoControllery
EstadisticaAsignaturaController (back-end) que se encargarán de resolver las
peticiones realizadas por el controlador del front-end llamado
ShowEstadisticasComponent.
19
3.3. DISEÑODEINTERFAZDEUSUARIOEn este apartado se aborda la capa de presentación y para ello se realiza una
aproximacióno prototipo de lo que será la interfaz de usuario final de la aplicación
QOS-UPM.Estediseñodeinterfazdeusuarioservirácomoguíaalahoradedesarrollar
laaplicación,peronoimplicaquenopuedanvariarciertosaspectosdelamismaenla
implementaciónfinal.
El prototipo de interfaz de usuario se ha realizado con la herramienta online
Lucidchart,quepermitehacermocksparaestecometido.
3.3.1. InterfazdeautenticaciónLa Figura 3.8 muestra la propuesta de interfaz de autenticación, que contiene un
formulariodonde se introduciráelusuarioy la contraseña.Esta interfaz será común
para todo tipodeusuarios y constituye la primerapantalla quemostrará el sistema
paraaccederalaaplicación.
Figura3.8.Interfazdeautenticación.
20
3.3.2. InterfazalumnoEnesteapartadoseexponelapropuestadeinterfazparalosusuariosdetipoalumno,
contodaslasopcionesdefuncionalidadqueofreceráelsistemaparaestetipoderol
delaaplicación.
3.3.2.1. Opcionesdelalumno
Unalumnodispondrádeunmenúcondosopciones(Figura3.9):a)“Misencuestas”,
quedaráaccesoavisualizarlasencuestasqueharealizadoylasquetienependientes
derealizardelasasignaturas-gruposdelasqueestématriculado;b)“Verestadísticas”,
donde el alumno podrá acceder a ver los resultados estadísticos de las encuestas
(escuela,departamento,asignaturayasignatura-grupo-profesor).
Figura3.9.InterfazOpcionesdelalumno.
3.3.2.2. Opción“Misencuestas”
Al navegar a la opción “Mis encuestas” aparecerá una lista con la información
referentea lasasignaturas-gruposen lasqueelalumnoestématriculadoenelcurso
activo (Figura 3.10). Esta lista visualizará una columna de acción que mostrará un
botón para navegar a la realización de la encuesta referente a la asignatura-grupo
21
seleccionado. Dicho botón estará desactivado en el caso de que el alumno ya haya
realizadolaencuestadeesaasignatura-grupo.
Figura3.10.InterfazOpción“Misencuestas”.
Alpresionarelbotónderealizarencuestasenavegaráhastalainterfazquepermitirá
queelalumnorelleneelcuestionariodelaasignatura-gruposeleccionado,enlaquese
distinguen dos apartados (Figura 3.11). El primero de ellos recoge las preguntas
referentesalaasignaturaencuestión,mientrasqueelsegundosecorrespondeconlas
preguntas referentes al profesor o profesores que han dado docencia en esa
asignatura-grupo(estebloquedepreguntasserepetirátantasvecescomoprofesores
hayan impartidodocenciadeesaasignaturaenesegrupo).Porultimo,estapantalla
contieneunbotónquepermite al usuario realizar el envióde la encuesta.Al pulsar
este botón, se mostrará una nueva ventana que informará si la encuesta se ha
realizadoconéxitoono(Figura3.12).
22
Figura3.11.Interfazrealizarencuesta.
Figura3.12.Interfazinformeenvíodeencuesta.
3.3.2.3. Opción“VerEstadísticas”
Alnavegara laopción“Verestadísticas”apareceráunsubmenúquecontendráotras
dos opciones (Figura 3.13). La primera de ellas es “Estadísticas de asignaturas
matriculadas”, quepermitirá visualizar los resultados estadísticosde las asignaturas-
grupo de las que el alumno estématriculado. La segunda opción es “Explorar”, que
23
permitirá visualizar el resto de tipos de informes de resultados estadísticos
(asignaturas por grupo –aunque el alumno no esté matriculado-, asignatura,
departamentoyescuela).
Figura3.13.Interfazopción“Verestadísticas”.
a) Opción“Estadísticasasignaturasmatriculadas”
Cuandoseseleccioneestaopciónsenavegaráalainterfazdeusuario,quevisualizará
una listacon lasasignaturas-gruposen losqueestématriculadoelalumno.Porcada
elementode la listasemostraráunbotónconformadeojopara lavisualizacióndel
informeestadístico(Figura3.14).
Figura3.14.Interfazopción“Estadísticasasignaturasmatriculadas”.
24
Cuando se seleccione una asignatura-grupo para la visualización de su informe
estadístico, se navegará a la interfaz quemostrará los resultados estadísticos de la
asignatura-gruposeleccionada,tantodelaspreguntasreferentesalaasignaturacomo
delasdecadaprofesorqueimpartadichaasignaturaenesegrupo(Figura3.15).
Figura3.15.Interfazverresultadosestadísticosdeasignaturagrupo.
b) Opción“Explorar”
Estaopciónseexplicaenelapartado3.3.5dadoqueescomúnatodoslosroles.
3.3.3. Interfazprofesor
Enesteapartadoseabordanlaspropuestasdeinterfacesdelusuariodetipoprofesor,
y todos sus posibles roles, como el de subdirector de ordenación académica,
coordinadorasignaturaodirectordedepartamento.
3.3.3.1. Opcionesdelprofesor
Dependiendodel roldelprofesor, elmenúdispondrádeunaodosopciones (Figura
3.16).Laopción“VerEstadísticas”estarádisponibleparatodoslosrolesdeprofesory
25
permitirá visualizar los informes estadísticos en todas sus variantes así como
comprobar la asignación docente designada. Por otro lado, la opción “Planificación
académica”,quedependedelroldelusuarioautenticado,estarásolodisponiblepara
profesoresqueseansubdirectordeordenaciónacadémica,directordedepartamento
ocoordinadordeasignatura.
Figura3.16.InterfazOpcionesdelprofesor.
3.3.3.2. Opción“Verestadísticas”
Alseleccionarlaopción“Verestadísticas”,apareceráunsubmenúquecontendrátres
opciones(Figura3.17):a)“Susasignaturas”,paraaccederalosresultadosestadísticos
de las asignaturas y grupos en los que haya impartido docencia; b) “Explorar”, para
accederalrestodetiposdeinformesderesultadosestadísticos(asignaturasporgrupo
–aunque el profesor no haya impartido docencia-, asignatura, departamento y
escuela); c) “Asignacióndocente”, para visualizar la asignacióndocenteque se leha
designado.
26
Figura3.17.Interfazopción“Verestadísticas”-Profesor.
a) Opción“Susasignaturas”
Enestaopciónsemostraráunlistadodetodaslasasignaturas-grupoenlasquehaya
impartidodocenciaelprofesorenelcursoactualycursosanteriores(Figura3.18).Se
dispondrádeunbotónconformadeojopara lavisualizacióndel informeestadístico
decadaasignatura-grupo.
Figura3.18.Interfazopción“Susasignaturas”.
Al seleccionar una asignatura-grupo en concreto se navegará al informe estadístico
correspondienteque tendrádospartesdiferenciadas, los resultados referentes a las
27
preguntas de asignatura y los referentes a las preguntas de los profesores que han
impartidodocenciaenlaasignaturaygrupo(Figura3.19).
Figura3.19.Interfazverestadísticasasignatura-grupo.
b) Opción“Explorar”Estaopciónseexplicaenelapartado3.3.5dadoqueescomúnatodoslosroles.c) Opción“Asignacióndocente”Al seleccionar esta opción el profesor podrá visualizar las asignaturas que le ha
asignado el director de departamento (Figura 3.20). Además, podrá reportar una
incidencia general que no esté vinculada a ninguna de las asignaturas de la lista
eligiendolaopción“Reportarincidencia”.Sedispondrádeunbotónconformadeojo
paravisualizarlaasignacióndegruposdecadaunadelasasignaturasdelalista.
Una vez seleccionada una asignatura en concreto, el sistema mostrará los grupos
asignadosporelcoordinadordelaasignaturaalprofesorencuestión(Figura3.21).Si
elprofesordetectaalgúnerrorenlaasignacióndeungrupodeunaasignatura,podrá
reportarelfallopresionandoelbotóncorrespondientedelacolumnaacción.
28
Figura3.20.Interfazopción“Asignacióndocente”.
Figura3.21.Interfazasignacióndocencia.
Alseleccionarel iconodereportar incidenciadeungrupoconcreto,sevisualizaráun
formulariodondeelprofesorpodráinformarydetallarlaincidencia(Figura3.22)
29
Figura3.22.Interfazreportarincidenciadeasignacióndocencia.
Al pulsar al botón de enviar incidencia, se informará al director de departamento,
adjuntando los datos del profesor que envía la incidencia y una descripción de la
misma y semostraráuna alerta avisandodel correcto envióde la incidencia (Figura
3.23).
Figura3.23.Interfazenvióreportarincidencia.
3.3.3.3. Opción“Planificaciónacadémica”
Estaopciónmostraraunsubmenúcondiferentesalternativasdependiendodelroldel
usuarioautenticadoenelsistema.Aestasecciónsolopodránacceder losprofesores
30
que tenganel roldesubdirectordeordenaciónacadémica,directordepartamentoo
coordinadordeasignatura.
3.3.3.3.1. OpcionesdeSubdirectordeOrdenaciónAcadémica
Si el usuario autenticado tiene el rol de subdirector de ordenación académica
dispondrádeunsubmenúcondosopciones(Figura3.24).Laprimeraeslade“Gestión
degrupos”quepermitiráalsubdirectordeordenaciónacadémicarealizarlagestiónde
gruposporcurso,semestre,titulaciónycursoacadémico,asícomolasasignaturaspor
grupo. La segunda es la de “Gestión del periodo de encuestas” que permitirá al
subdirector de ordenación académica establecer el periodo de realización de
encuestas. Una vez expire la fecha final de este periodo se generarán
automáticamentelosdiferentestiposderesultadosestadísticos.
Figura3.24.Interfazopcionesdelsubdirectordeordenaciónacadémica.
Alseleccionarlaopciónde“Gestióndegrupos”semostraráunlistadoconlosgrupos
existenteshastaelmomentoouna lista vacía si todavíano sehaagregadoninguno
(Figura 3.25). En la última columna de cada ítem de la lista se dispondrá de tres
botones asociados a las accionesde consultadeungrupo (conel botóndeunojo),
edición de un grupo (con el botón de un lápiz) y eliminación de un grupo (con una
papelera). Por último, en la parte inferior de la lista se dispondrá del botón que
permitiráagregarungruponuevo.
31
Figura3.25.Interfazopción“Gestióndegrupos”.
Pulsandoelbotóndecreargruposemostraráunformularioconloscamposarellenar
(Figura3.26).
Figura3.26.Interfazcreargrupo.
Al seleccionar el botón de Enviar se validarán los datos del formulario y si todo es
correctosemostraráundialogoconeléxitodelacreacióndelgrupo(Figura3.27).
32
Figura3.27.Interfazgrupocreado.
Por otra parte, la opción de editar grupo de la Figura 3.25mostrará un formulario
similaraldecreacióndegrupo,quecontendrálosdatosdelgruposeleccionadoydos
botonesquepermitiránguardarloscambiosocancelarlaedición(Figura3.28).
Figura3.28.Interfazedicióndeungrupo.
Porúltimo,alpulsarelbotóndeborrargrupode laFigura3.25apareceráunaalerta
para confirmar si se desea borrar el grupo seleccionado (Figura 3.29). En caso
afirmativoseborraráelgrupoyencasonegativoelgrupoquedaráintacto.
33
Figura3.29.Interfazborrargrupo.
Al seleccionar la opción de “Gestión del periodo de encuestas” (Figura 3.24) se
mostraráunformulariocondosdropdownsy2calendarios(Figura3.30).Enelprimer
dropdownpodremosescogerentreellistadodecursosacadémicosdisponiblesyenel
segundodropdownsepodráescogerelsemestre.
Figura3.30.Interfazopción“Gestióndeperiododeencuestas”.
Por otra parte, el primer calendario representa la fecha de inicio de la realización
encuestas por parte del alumnado,mientras el segundo representa la fecha de fin,
momento en el que los alumnos no podrán seguir realizando encuestas para el
semestre seleccionado y se generarán todos los tipos de resultados estadísticos
34
automáticamente.Finalmentesedisponedelosbotones“guardar”,queguardarálas
fechas de inicio y fin de encuesta para el curso/semestre seleccionado, y “cancelar”
queserviráparanavegaralaventanadelaFigura3.24sinsalvarningúncambio.
3.3.3.3.2. OpcionesdeDirectordeDepartamento
Si el usuario autenticado tiene el rol de director de departamento dispondrá de un
submenú con dos opciones (Figura 3.31): a) “Asignar profesores”, para indicar los
profesores que impartirán docencia en cada asignatura; b) “Ver incidencias de
asignación docente”, que como su propio nombre indica servirá para visualizar las
incidenciasreportadasporlosprofesoressobrelaasignacióndocente.
Figura3.31.Interfazopcionesdirectordedepartamento.
Si se selecciona la opción “Asignar profesores” se visualizará la lista de asignaturas
cuyadocenciaestáasignadaaldepartamento(Figura3.32).
Pulsandoelbotón“Asignarprofesor”asociadoaunaasignaturasemostraráunalista
contodoslosprofesoresdeldepartamento,dondeeldirectordedepartamentopodrá
elegirquéprofesoresestaránasignadosalaasignaturaytambiéntendrálaopciónde
elegiralcoordinadordelamisma(Figura3.33).
35
Figura3.32.Interfazopcionesdirectordedepartamento.
Figura3.33.Interfazasignarcoordinadoryprofesoresaasignatura.
La opción “Ver incidencias de asignación docente” (Figura 3.31) visualizará una lista
con todas las incidencias reportadas por los profesores relativas a la asignación
docente(Figura3.34).Eldirectordedepartamentopodráinspeccionarelcontenidode
unaincidenciaconcretapulsandoelbotónconformadeunojoenlaúltimacolumna
delalista.Estaacciónmostraráeldetalledelaincidencia,incluyendoladescripciónde
lamismayel profesorque lahaenviado (Figura3.35). El directordedepartamento
podrámarcarlaincidenciacomoresuelta,loqueladaráporterminadayseinformará
alprofesorquehasidosolventada.
36
Figura3.34.Interfazopciónverincidenciasdeasignacióndocente.
Figura3.35.Interfazincidenciasobreasignacióndocente.
3.3.3.3.3. Opcionesdecoordinadorasignatura
Si el usuario autenticado tiene el rol de coordinador asignatura dispondrá de un
submenúconunaúnicaopción:“Asignaturasquecoordino”(Figura3.36)
37
Figura3.36.Interfazopcionesdecoordinadorasignatura.
Estaopciónvisualizaráun listado con todas las asignaturasque coordinaelprofesor
autenticado(Figura3.37).
Figura3.37.Interfazlistadeasignaturasquecoordino.
Pulsandoelbotón“Vergrupos”sevisualizaráunlistadoconlosgruposenlosquese
impartelaasignaturaseleccionada(Figura3.38).
38
Figura3.38.Interfazlistadeasignaturasgrupos.
Pulsandoelbotón“Asignarprofesores”deungrupoconcretosevisualizaráunlistado
con los profesores que ya tienen asignada docencia de esa asignatura en ese grupo
(Figura 3.39). También se dispondrá de un dropdown con la lista de todos los
profesoresasignadosalaasignaturayalpulsaralbotónagregarseañadiráelprofesor
algruposeleccionado.
Figura3.39.Interfazasignarprofesoresagrupo.
3.3.4. Interfazadministrador
La interfaz propia de un usuario con rol de administrador es la que más funciones
puederealizarenlaaplicación.Lamayoríadefuncionalidadessonparalaorganización
39
de lasescuelas,quesepuedenagruparen funcionalidadde tipoCRUDdeentidades
(porejemploparalaentidadEscuela),altasderelacionesentreentidades(porejemplo
asignardepartamentosaescuelas)y,porúltimo,funcionalidadparaexplorarcualquier
tipodeestadística.
Enlossiguientesapartadosmostraremosunejemplodecadagrupomencionadopara
hacernosunaideadecómoserálainterfazdelasfuncionalidadesquetendráesterol.
3.3.4.1. Opcionesdeladministrador
Elusuarioautenticadoquetengaelroldeadministradordispondrádetresopciones:a)
“ConfiguracióndelaUniversidad”;b)Asignaciones;c)Verestadísticas(Figura3.40).
Figura3.40.Interfazopcionesdeladministrador.
3.3.4.2. OpciónConfiguracióndelaUniversidad
Mostraráunsubmenúcontodas lasopcionesdetipoCRUDdeentidadesdisponibles
enlaaplicación(Figura3.41).EnestecasosolomostraremoselejemplodeCRUDde
Escuela,yaquetodas las interfacessonsimilaresysolocambian losatributosquese
pidenenelformularioalcrearoeditareltipodeentidad.
40
Figura3.41.Interfazopcionesdeconfiguracióndelauniversidad.
3.3.4.2.1. OpciónCRUDEscuela
Laopciónde“CRUDEscuela”mostraráunlistadocontodaslasescuelasexistentes(si
noexisteningunalalistaestarávacía)(Figura3.42).Enlaúltimacolumnadecadaítem
de la lista se dispondrá de tres botones que representan las acciones que el
administrador puede realizar sobre la escuela seleccionada, que en este caso son
accionesrelacionadasconunCRUD.
Figura3.42.InterfazopciónCRUDEscuela.
Elbotónconformadeojorepresentalaconsultadedatosdelaescuelaseleccionada,
el botón con formadeun lápiz la ediciónde los datos de la escuela y el botón con
41
formadepapeleradereciclajerepresentalaeliminacióndelaescuela.Porúltimo,en
la parte inferior tendremos un botón que permitirá la agregación de una nueva
escuela.
Pulsando el botón de crear escuela se mostrará un formulario con los campos
necesariosparadardealtaunanuevaescuelaenelsistema(Figura3.43).
Figura3.43.Interfazcrearescuela.
Al seleccionarelbotóndeGuardar sevalidarán losdatosdel formularioy si todoes
correctosemostraráundialogoconeléxitodelacreacióndelaescuela(Figura3.44)
Figura3.44.Interfazescuelacreada.
42
Porotraparte, laopcióndeeditar escuelade la Figura3.42mostraráun formulario
similaraldecreacióndeescuela,quecontendrálosdatosdelaescuelaseleccionaday
dosbotonesquepermitiránguardarloscambiosocancelarlaedición(Figura3.45)
Figura3.45.Interfazeditarescuela.
Porúltimo,alpulsarelbotóndeborrarescueladelaFigura3.42apareceráunaalerta
para confirmar si se desea borrar la escuela seleccionada (Figura 3.46). En caso
afirmativoseborrarálaescuelayencasonegativolaescuelaquedaráintacta.
Figura3.46.Interfazborrarescuela.
43
3.3.4.3. Opción“Asignaciones”
Mostrará un submenú con todas las opciones de tipo asignación disponibles en la
aplicación (Figura3.47). Eneste caso solomostraremosel ejemplodeasignaciónde
departamentosaescuelas,yaquetodaslasinterfacessonsimilaresysolocambianlos
tiposdeasignacionesentrelasentidades.
Figura3.47.InterfazopcionesAsignaciones.
3.3.4.3.1. OpciónAsignacióndepartamentosaescuelas
Al seleccionar la opción de “Asignación departamentos a escuelas” se mostrará un
listado con todas las escuelas disponibles en el sistema (Figura 3.48). En la última
columnadecadaítemdelalistaapareceráunbotónparaasignarlelosdepartamentos
quesedeseen.
Figura3.48.Interfazopciónasignacióndepartamentosaescuelas.
44
Alseleccionarlaasignacióndedepartamentosaunaescuelaconcretasemostraráun
listado con todos los departamentos que tiene asociados en ese momento (Figura
3.49). El botón con forma de aspa de la última columna del listado representa la
eliminacióndelarelaciónentreeldepartamentoseleccionadoylaescuela.
Figura3.49.Interfazasignacióndepartamentosaescuelas.
Enlaparteinferiordeestaventanasevisualizaráunalistadesplegablequecontendrá
todosdepartamentosdisponiblesenelsistema(sepodránelegirNdepartamentosala
vez para agregar a la escuela que se haya seleccionado). El alta en la relación de
departamentos con escuela se llevará a cabo al pulsar el botón de asignar
departamento, que mostrará una ventana de alerta para informar que el
departamentosehaasignadocorrectamente(Figura3.50).
Figura3.50.Interfazdepartamentoasignadocorrectamente.
45
Laúltimaopcióndisponibleenestainterfazeslaposibilidaddeeliminarlarelaciónde
undepartamentoconlaescuela,queseproducealpulsarelbotóndelaspa.Alrealizar
esta acción aparecerá una ventana de alerta para confirmar la eliminación de la
relaciónentreeldepartamentoylaescuela(Figura3.51).
Figura3.51.Interfazdepartamentoasignadocorrectamente.
3.3.4.4. Opción“Verestadísticas”
Estaopciónseexplicaenelapartado3.3.5dadoqueescomúnatodoslosroles.
3.3.5. InterfazcomúnLainterfazcomúnseráaccesibleparatodoslosrolesdeusuariodelaaplicaciónyestá
relacionada con la visualización de los informes de resultados estadísticos de las
encuestasentodassusvariantes(porescuela,pordepartamento,porasignaturaypor
asignatura-grupo). A esta funcionalidad se accederá con la opción Explorar (Figura
3.13)sielrolesdealumno,conlaopciónExplorar(Figura3.17)sielrolesdeprofesor
y,finalmenteconlaopciónVerestadísticas(Figura3.40)sielrolesdeadministrador.
46
3.3.5.1. Visualizaciónderesultadosestadísticos
La opción de visualización de resultados dispondrá de un submenú con cuatro
opcionesrelacionadascon lascuatrovariantesdeinformesestadísticos(Figura3.52):
a) “Por escuela”, para mostrar los resultados de una escuela en concreto; b) “Por
departamento”, para mostrar los resultados de los departamentos; c) “Por
asignaturas”,paramostrarlosresultadosdelasasignaturas;d)“Porasignaturagrupo”,
paramostrarlosresultadosdetodaslasasignaturas-gruposquesedeseen.
Figura3.52.Interfazopcionesexplorar.
3.3.5.2. Opción“Porescuela”
Mostrará un listado con todas las escuelas disponibles en el sistema, que podrán
filtrarse por nombre u otros atributos relacionados con la entidad Escuela (Figura
3.53). En la última columnade cada ítemde la lista se dispondrá de un botón para
navegaralavisualizacióndelosresultadosestadísticosdelaescuelaseleccionada.
Al seleccionar una escuela se navegará a la interfaz que mostrará los resultados
estadísticos de la misma. Por un lado, se mostrarán los resultados del bloque de
preguntasrelativosalaasignatura,obtenidosapartirdelconteodelasencuestasde
todas las asignaturas impartidas en la escuela seleccionada y, por otro lado, los
obtenidosdelconteodelosbloquesdepreguntasdetodoslosprofesoresquelashan
impartido(Figura3.54).
47
Figura3.53.Interfazopción“porescuela”.
Figura3.54.Interfazverestadísticas“porescuela”.
3.3.5.3. Opción“PorDepartamento”
Mostrará un listado con todos los departamentos disponibles en el sistema, que
podrán filtrarse por nombre u otros atributos relacionados con la entidad
Departamento(Figura3.55).Enlaúltimacolumnadecadaítemdelalistasedispondrá
de un botón para navegar a la visualización de los resultados estadísticos del
departamentoseleccionado.
48
Figura3.55.Interfazopción“pordepartamento”.
Alseleccionarundepartamentosenavegaráalainterfazquemostrarálosresultados
estadísticos del mismo. Por un lado, se mostrarán los resultados del bloque de
preguntasrelativasa laasignatura,obtenidosapartirdelconteode lasencuestasde
todaslasasignaturasimpartidasporeldepartamentoseleccionadoy,porotrolado,los
obtenidosdelconteodelosbloquesdepreguntasdetodoslosprofesoresquelashan
impartido(Figura3.56).
Figura3.56.Interfazverestadísticas“pordepartamento”.
49
3.3.5.4. Opción“PorAsignatura”
Mostraráun listado con todas las asignaturas disponibles enel sistema,quepodrán
filtrarsepornombreuotrosatributos relacionadoscon laentidadAsignatura (Figura
3.57). En la última columna de cada ítemde la lista se dispondrá de un botón para
navegaralavisualizacióndelosresultadosestadísticosdelaasignaturaseleccionada.
Figura3.57.Interfazopción“porasignatura”.
Al seleccionar una asignatura se navegará a la interfaz quemostrará los resultados
estadísticos de la misma. Por un lado, se mostrarán los resultados del bloque de
preguntasrelativasa laasignatura,obtenidosapartirdelconteodelasencuestasde
todoslosgruposenlosquesehaimpartidolaasignaturaseleccionaday,porotrolado,
losobtenidosdelconteodelosbloquesdepreguntasdetodoslosprofesoresquehan
impartidodocenciadeesaasignatura(Figura3.58).
3.3.5.5. Opción“PorAsignaturagrupo”
Mostrará un listado con todas las asignaturas-grupos disponibles en el sistema, que
podránfiltrarsepornombreuotrosatributosrelacionadosconlaentidadAsignatura-
Grupo(Figura3.59).Enlaúltimacolumnadecadaítemdelalistasedispondrádeun
50
botónparanavegara la visualizaciónde los resultadosestadísticosde laasignatura-
gruposeleccionado.
Figura3.58.Interfazverestadísticas“porasignatura”.
Figura3.59.Interfazopción“porasignaturagrupo”.
Al seleccionar una asignatura-grupo se navegará a la interfaz que mostrará los
resultados estadísticos de la misma. Por un lado, se mostrarán los resultados del
bloque de preguntas relativas a la asignatura, obtenidos a partir del conteo de las
encuestasdelaasignatura-gruposeleccionadoy,porotro,losobtenidosdelconteode
los bloques de preguntas de los profesores que han impartido docencia en esa
asignaturaygrupoconcreto(Figura3.60).
51
Figura3.60.Interfazverestadísticas“porasignaturagrupo”.
52
4. TECNOLOGÍASPARAELDESARROLLODELPROYECTO
Laimplementacióndeunproductosoftwareconllevalaseleccióndelosdistintostipos
detecnologíasquesevanaemplearparaeldesarrollodelproyecto,comolenguajes
de programación, gestores de bases de datos, frameworks de desarrollo, etc. Este
capítulo documenta las distintas tecnologías finalmente seleccionadas para la
implementacióndeQOS-UPM,asícomolajustificacióndecadaelección,explicándolas
endetalle.
Cabe recordar que QOS_UPM será una aplicación web por lo que dispondrá de un
back-end (lapartedel servidor) yun front-end (lapartedel cliente). Esporelloque
estecapítuloconstadedossubapartados,tecnologíaback-endytecnologíafront-end,
cada uno de ellos dedicado a comparar tecnologías disponibles para un aspecto
concreto del desarrollo, justificar la elección realizada y documentar las principales
característicasdelatecnologíafinalmenteseleccionada.
4.1. TECNOLOGÍABACK-ENDElback-enddeunaaplicaciónestáformadaporelsoftwareresponsabledelaccesoala
capadedatosyde la lógicade laaplicación.Concretamente, losusuariosdeunsitio
Webnotienenaccesodirectonialalógicanialosdatos,realizandolainteraccióncon
laaplicacióna travésdelsoftwaredel front-end,queactúacomo intermediariopara
presentarestosdatosconlalógicaqueseleshayaaplicado.
53
Enelmomentoactual,eldesarrollodeaplicacioneswebenglobaunagrancantidadde
tecnología,entrelaquecabedestacarladiversidaddelenguajesdeprogramaciónpara
la parte de back-end como Python, Php, C# o Java. Además, cada uno de estos
lenguajes dispone de frameworks de desarrollo o entornos de trabajo que brindan
buenasprácticasyabordanproblemascomunesyaresueltosparaevitarvolverapasar
porellos.
En los siguientes apartados veremos todas las tecnologías relacionadas con el back-
end escogidas. Además, trataremos patrones y arquitecturas que usaremos en el
proyectorelacionadasconelback-end.
4.1.1. ArquitecturaEnesteapartadoanalizaremoslaarquitecturaqueusarálaaplicaciónwebQOS-UPM.
EnesteámbitoexistendosarquitecturasbastantepopularesquesonSOAPyREST,las
dosbasadasenSOA.
SOAP,conocidacomowebservices,sonserviciosquesecomunicanporelprotocolo
SOAP(SimpleObjectAccessProtocol),quebásicamenteesunprotocoloquepermite
la comunicación mediante XML. Aunque los servicios SOAP funcionan
mayoritariamente bajo el protocolo http, éste puede ser sustituido por otros como
FTP,POP3,etc.Lafigura4.1recogeestaarquitectura[13].
Figura4.1.ArquitecturaSOAP.
LaprincipaldiferenciadeSOAPconRESTsebasaen lacomunicaciónmedianteXML,
quehacequeseamuypesadayporlotantomáslenta.Además,SOAPespocoflexible
54
dado que solo permite XMLmientras que REST acepta JSON, lo que facilita que su
procesamientoseamásrápido.
En base a esta comparativa, para la aplicación hemos escogido la arquitectura REST
porque además encaja con las tecnologías front-end que utilizaremos, dado que
transmiten usando el formato JSON. También tenemos que destacar que hemos
escogidoRESTporquees laarquitecturaqueencajacon los serviciosde laUPM. La
figura4.2recogeestaarquitectura[13].
Figura4.2.ArquitecturaREST.
4.1.1.1. ¿QuéesREST?
La arquitectura REST surgió aproximadamente en el 2000 cuando al padre de la
especificación HTTP Roy Fielding presento su tesis doctoral REST, que se ha
popularizadoadíadehoyyseempleaenlamayoríadeaplicacioneswebsmodernas.
REST se define de manera sencilla como cualquier interfaz entre sistemas que use
HTTPytodaslasposiblesoperacionesquesoportaHTTPquesonGET,POST,UPDATE,
DELETE y PATCH, devolviendo cualquiera de ellas datos en un formato que pueda
entenderunapersonademanerasencilla.Enlaactualidadelformatomásutilizadoes
JSON[14].Lafigura4.3recogeestaarquitectura.
55
Figura4.3.DiagramaarquitecturaREST.
4.1.1.2. CaracterísticasREST
LascaracterísticasdelaarquitecturaRESTsonlassiguientes:
● Protocolocliente/servidorsinestado:Enotraspalabras,quieredecirquecada
peticiónHTTPdebecontenertodalainformaciónnecesariaparaejecutarla.
● UsartodaslasoperacionesHTTP:POST,GET,PUT,DELETE,PATCH.
● TodalainformaciónomanipulaciónsehaceapartirdelaURIquetrabajarade
identificadorúnicodecadarecursodelsistemaREST.
● Interfaz Uniforme: Al usar las operaciones HTTP nos brinda una interfaz
uniformesobrelosrecursos.
● Sistema de capas: Porque usamos una arquitectura jerárquica entre
componentes.
4.1.1.3. VentajasdeusarREST
Actualmente REST no tiene ninguna desventaja asociada con el desarrollo de
aplicaciones web, por lo que solo expondremos las ventajas que esta arquitectura
implica,queson:
56
● Separaciónentreclienteyservidor:Lagranventajadeusarestaarquitecturaes
una total separación de la interfaz de usuario con el servidor y el
almacenamiento de datos. Esta separación implica numerosas ventajas como
escalabilidaddelossistemas,portabilidaddelainterfazdeusuariosadistintas
plataformas,etc.
● RESTesindependiente:UsarRESTestotalmenteindependientedellenguajede
programaciónqueseuseparasufuncionamiento,conelúnicorequisitoquelas
respuestasquedevuelvaelservidorseanenformatoJSON.
● ControlsobretodaslaspeticionesqueserealizanalaAPIREST.
4.1.1.4. EjemplosdeAPIREST
Realizaremosdos ejemplos simples deAPI REST condos estados comunes deHTTP,
concretamentePOST(crear)YGET(obtener).
Una llamada POST a una API creara un registro nuevo en nuestro back-end. Por
ejemplo,enlasiguientellamadaagregaremosunanimalenformatoJSON,siguiendoel
modeloquerequieraelendpointapi,queenestecasosolicitaunobjetoconformato
{“id”:Integer,“type”:string,“name”:string,“photoUrls”:string,“age”:Integer}.
LlamadaPOSTawww.apitest.com/agregarAnimal{
"id": 0, "type": “dog” "name": "kira", "photoUrls": “www.perros.com/kira” "age": "13" }
Una llamadaGETaunaAPIobtendrá los registrosque tengaguardadoelapiquese
consulte.Enelejemploanteriorcreamosunanimal,porloquealhacerahoraunGET
sobre www.apitest.com/obtenerAnimal obtendremos al perro que agregamos
previamente.
LlamadaGETawww.apitest.com/obtenerAnimal{ "id": 0, "type": “dog” "name": "kira", "photoUrls": “www.perros.com/kira” "age": "13" }
57
4.1.2. Lenguajedeprogramaciónyframework.Ladecisióndequélenguajedeprogramaciónusarenel ladodelback-endenelcaso
de nuestra aplicación QOS-UPM es sencilla, porque el lenguaje elegido por la
UniversidadPolitécnicadeMadridparaeldesarrollodesoftwarewebesPHP,quese
usa actualmente en el departamento de sistemas informáticos del rectorado de la
misma.
Unavezelegidoellenguajedeprogramación,tenemosqueescogerunframeworkde
desarrollodePHP.ExistenmuchosframeworksparaPHP,aunqueparadecidircuálde
ellosutilizarhemos seleccionadoy comparadosoloSymphonyy Laravel,porqueson
losmáspopularesenlacomunidad[15].
4.1.2.1. Elecciónframework
VentajasdeLaravel:
• Estructuraorganizadadelosarchivosyelcódigo.
• Testunitarios.
• Lamejordocumentacióndetodoslosframeworks.
• Nivelbastantealtodeabstracción.
• ORM.
• UsadependenciasdeSymphony.
DesventajasdeLaravel:
• Realizamuchasqueriesalabasededatos.
VentajasdeSymphony:
• Estable.
• Biendocumentado.
• Buensoporteyunframeworkbastantemaduro.
DesventajasdeSymphony:
• Aunqueladocumentaciónesbuenalacurvadeaprendizajeesmuyalta.
58
Unavezanalizadaslasventajasydesventajasdeestosdosframeworksehaelegidoel
frameworkLaravelporqueusamuchasdelasdependenciasdeSymphonyyportanto
seagregansusventajasyporquelacurvadeaprendizajedeLaravelesmenoralade
Symphony[15].
4.1.3. GestordeBBDD:MariaDB
Laravelsoportamuchasbasesdedatos,aunqueparanuestraaplicaciónbuscamosuna
que sea open source para poder realizar su uso sin disponer de una licencia. Con
anterioridad a que fuese comprada por Oracle, la base de datos por excelencia de
Laravelopensourceeramysql.AlcomprarlaOracle, labasededatosquecomenzóa
usar Laravel fue MariaDB. En base a este dato y porque Laravel le da el máximo
soporte,hemosescogidoestabasededatos relacionalparaeldesarrollodenuestra
aplicación[16].
4.1.4. FrameworkparaREST
EnesteapartadoelegiremoselframeworkparalaarquitecturaREST,quenosbrindará
unentornodetrabajomássencilloparadefinirnuestroAPIREST.
NoexisteningunaalternativaqueestétanavanzadaysoportadacomoSwaggerpara
la arquitectura API REST y, por ello, hemos elegido ésta para definir el API REST de
nuestraaplicación.
4.1.4.1. SWAGGER
Swaggeresun frameworkopensourcequeestárespaldadoporun largoecosistema
deherramientasqueayudanalosdesarrolladoresadiseñar,construir,documentary
consumir API’s REST. Swagger incluye documentación automática, generación de
códigoycasosdepruebaparalosAPI’sdefinidos.
SwaggersoportaladefinicióndelAPIRESTapartirdeunarchivo.ymlo.json,queson
formatosdeserializaciónoarchivosparacompartirdatosyqueson legiblespara los
sereshumanos.LosdosestánbasadosenXML,peroactualmentesonmáspopulares
queesteúltimo.
59
AcontinuaciónveremosunejemplodeunarchivoymlquedefineunAPIdeunatienda
demascotas,dondepodremosrealizarlasdiferentesllamadasconlasoperacionesque
nos define REST para obtener, modificar, borrar mascotas, etc. Este ejemplo se ha
obtenidodehttps://editor.swagger.io/,quesigue laespecificaciónOPENAPI2.0,que
es el estándar que usa swagger. Esta especificación puede consultarse en
https://github.com/OAI/OpenAPI-Specification/blob/master/versions/2.0.md.
Lafigura4.4recogeunsegmentodelarchivoyml[17].
Figura4.4.EjemploYMLdeswagger.
De ladefinicióndelejemplo,eneleditoronlinedeswaggerobtenemosunresultado
comoelquemuestralafigura4.5,dondeseincluyenalgunasllamadas:
• POST-/PETesunallamadapostparacrearunamascota.
• PUT-/PETesunallamadaputparamodificarunamascotaexistente.
• GET-/PET/FINDBYSTATUSesunallamadagetqueobtieneunamascotaporsu
status.
• GET– /PET/{petID} esuna llamadagetqueobtieneuna llamadapor el id de
mascota.
60
Figura4.5.Ejemplodedocumentacióndeswagger.
4.1.4.2. DOCUMENTACIONDEQUOSAPI
Enesteapartadosemuestra ladocumentación finaldenuestraaplicaciónQOS-UPM
definidaenSwagger,dondepuedeobservarsequecadaunadelasentidadesincluidas
en[11]aparecenporseparado(Figuras4.6y4.7).
Figura4.6DocumentaciónQOSAPIparte1.
61
Figura4.7DocumentaciónQOSAPIparte2.
4.1.4.3. ResourceEscuelas
Enesteapartadoexplicaremosunresourceenconcreto,entendiendocomoresource
unobjetojsonounacoleccióndeobjetosjsonalosqueseaccedemedianteunaURI,
por ejemplo www.qosapi.com/escuelas, que devolverá un array de objetos de tipo
escuela.
No explicaremos todos los resources que tiene la aplicación porque son
aproximadamente200,pero realizaremosunejemplode cómousarelAPIREST con
unamuestracadatipodellamadaREST(POST,GET,PUT,DELETE)paralosrecursosde
laentidadEscuela.Lafigura4.8recogeladocumentación.
Figura4.8DocumentaciónentidadEscuela.
62
a) GET-ObtenertodaslasescuelasEnesteejemplorealizaremosunallamadadetipoGET,quepermiteobtenerdatos.En
nuestro ejemplo queremos obtener todas las escuelas que tiene nuestra aplicación.
Paraellorealizaremosunallamadaalresource/escuelas.
Enladocumentaciónpodremosverlosparámetrosquesenecesitanpararealizaresta
llamada(algunossonobligatoriosyotrosopcionales).Normalmenteenlasllamadasde
tipo GET en nuestra API REST usaremos parámetros opcionales, que sirven para
devolver los resources filtrados por algún atributo. También cabe destacar el
parámetrocomúnpage,quenosserviráparaelpaginadodelosrecursos.Porejemplo,
en /escuelas podremos filtrar por nombre y ubicación. La figura 4.9 recoge este
resource.
Paraprobarelresourcepulsamoselbotón“Try itout”,quesolicitará losparámetros
que acepta el resource. En este caso solo rellenaremos el de page con un “1” para
obtener la primera página y los otros dos parámetros en blanco porque son
opcionales.ComopuedeobservarseenlaFigura4.10,unavezincluidoslosparámetros
sepulsaelbotón“execute”,loquenosdevolveráunarespuestaconlasescuelasque
existanennuestraaplicaciónenunarrayconobjetosJSON,talycomopuedeverseen
laFigura4.11.
.
Figura4.9ResourceGET/escuelas.
63
Figura4.10Parámetrosresource/escuelas.
Figura4.11Respuestaresource/escuelas.
b) PUT-ModificarunaescuelaporIDEn este ejemplo realizaremosuna llamadade tipo PUT, que sirve paramodificar un
resourceexistente.Ennuestroejemploqueremosmodificarunaescuelaexistentepor
suID.
Enladocumentaciónpodremosverlosparámetrosquesenecesitanpararealizaresta
llamada (algunos de ellos son obligatorios y otros opcionales). En el caso de las
llamadasPUTdelaaplicaciónelcampoobligatorioseráel identificadordelrecursoa
64
modificar,ennuestrocasounIDdeescuela.Porotrolado,serequiereunbody,quees
unobjeto JSONcon laestructuradelobjeto tipoescuela. LaFigura4.12 recogeeste
resource.
Figura4.12ResourcePUT/escuelas/{id_escuela}.
Para probar nuestro Resource pulsamos el botón “Try it out”, que solicitará los
parámetrosqueaceptaelresource,.EnestecasorellenaremoselparámetroIDdela
escuelaquequeremosmodificaryelbodyconlosatributosquequeremoscambiardel
resourceexistente(Figura4.13).
Figura4.13Parámetrosresource/escuelas/{id_escuela}.
65
Unavezincluidoslosparámetrossepulsaelbotón“execute”pararealizarlapeticióna
nuestraAPIy,sitodohaidocorrectamente,devolveráunarespuestaconelresource
modificado,talycomopuedeverseenlaFigura4.14.
Figura4.14Respuestaresource/escuelas/{id_escuela}.
c) DELETE-BorrarunaescuelaporIDEnesteejemplorealizaremosunallamadadetipoDELETE,queseutilizaparaeliminar
un resource existente. En nuestro ejemploqueremos eliminar una escuela existente
porsuID.
Enladocumentaciónpodremosverlosparámetrosquesenecesitanpararealizaresta
llamada (algunos de ellos son obligatorios y otros opcionales). En el caso de las
llamadasDELETEdelaaplicaciónelcampoobligatorioseráelidentificadordelrecurso
amodificar,ennuestrocasounIDdeescuela.LaFigura4.15recogeesteresource.
Para probar nuestro Resource pulsamos al botón “Try it out”, que solicitará los
parámetrosqueaceptael resource.enestecasorellenaremoselparámetro IDde la
escuelaquequeremoseliminar, tal y comopuedeobservarseen laFigura4.16.Una
vez rellenado el parámetro se pulsa el botón “execute” para realizar la petición a
66
nuestraAPIy, si todoha idocorrectamente,devolveráuna respuestavacía, como la
quesemuestraenlaFigura4.16.
Figura4.15ResourceDELETE/escuelas/{id_escuela}.
Figura4.16ParámetrosyrespuestadeDELETE/escuelas/{id_escuela}.
d) Crearunaescuela–POSTEn este ejemplo realizaremos una llamada de tipo POST, que sirve para crear un
resourcenuevo.Ennuestroejemplocrearemosunrecursonuevomandandounobjeto
json con el formato que nos pide la documentación de nuestra API. La Figura 4.17
recogeesteresource.
67
Paraprobarelresourcepulsamoselbotón“Try itout”,quesolicitará losparámetros
que acepta el resource. En este caso rellenaremos el body con los atributos que
requiereelresource,talycomopuedeobservarseenlaFigura4.18.Unavezrellenado
elparámetrosepulsaelbotón“execute”para realizar lapeticiónanuestraAPIy, si
todo ha ido correctamente, devolverá una respuesta con el resource creado, tal y
comosemuestraenlaFigura4.19.
Figura4.17ResourcePOST/escuelas.
Figura4.18ParámetrosPOST/escuelas.
68
Figura4.19RespuestaPOST/escuelas.
4.1.5. PruebasdellamadasaAPI
En este apartado seleccionaremos una herramienta para poder realizar pruebas a
nuestra API. Las pruebas de llamadas REST incluidas en el apartado anterior
simplementeconstituyenunadocumentaciónparalosusuariosfinales.Sinembargo,a
lahoradedesarrollaryprobarlaAPIdelaaplicaciónnecesitaremosunaherramienta
potentequepermitavalidarlosdiferentesaspectosdelamisma.
4.1.5.1. POSTMAN
Para realizar las pruebas a nuestra API hemos escogido POSTMAN porque es una
herramienta completa para este cometido y porque no existe un competidor que
incluyatodaslascaracterísticasquePOSTMANnospuedebrindar.Alavezeslamejor
documentada y por ello no realizaremos una comparación con otras herramientas,
seleccionandoPOSTMANparaestecometido.
ParavercómofuncionaPOSTMANmostraremoscómorealizarunapruebadenuestra
API.EnlaFigura4.20podemosverelinterfazqueofrecePOSTMAN.Incluyetodoslos
recursos de nuestra API, así como la posibilidad de probar los distintos tipos de
69
llamadasalAPIparaunrecursoconcreto.Pararealizarunapruebaintroduciremosla
URI al recurso que queremos acceder y seleccionamos el tipo de llamada. En el
ejemplodelaFigura4.20,elrecursoes/escuelasyeltipodellamadaunGET.Sepulsa
el botón “Send” y seobtiene la respuestadeeste resource, queeneste casoesun
arrayconobjetosdetipoescuela,talycomopodemosobservarenlaFigura4.21.
Figura4.20InterfazPOSTMAN.
Figura4.21LlamadaaGET/escuelasPOSTMAN.
70
4.2. TECNOLOGÍAFRONT-ENDEl front-enddeunaaplicaciónabarca todas las tecnologías relacionadascon laparte
del cliente, y no se limita al lenguaje de programación porque también está
relacionadoconmásaspectos.
Actualmenteelfront-endparaaplicacionesWebestárelacionadocontrestecnologías:
el lenguaje demarcas HTML, las hojas de estilo CSS y el lenguaje de programación
JavaScript.enlossiguientesapartadosexpondremosbrevementeestasherramientas,
la arquitectura software a seguir y un framework para el lenguaje de programación
escogido.
4.2.1. HTML,CSSYJAVASCRIPT
Enesteapartadoexplicaremosbrevementelas3tecnologíastrípodeparaeldesarrollo
delfront-end.
Comenzaremos conHTML (HyperTextMarkup Language), que referencia al lenguaje
demarcasparalaelaboracióndepaginasweb.HTMLesunestándaracargodelaW3C
(World Wide Web Consortium). Actualmente HTML es usado por todos los
navegadores y, por ende, no se puede desarrollar front-end sin este lenguaje de
marcado[18].
Por otro lado, CSS (Cascading Style Sheets) es un lenguaje de diseño grafico para
definir y crear el estilo de presentación de un documento de lenguaje de marcas
(mayormenteHTML).ActualmenteCSSseusapara realizar interfacesatractivaspara
losusuarios[19].
Por último, Javascript es un lenguaje de programación interpretado estándar de
ECMAScript.Sedefinecomoorientadoaobjetos,basadoenprototiposydébilmente
tipado.Estelenguajedeprogramaciónseutilizaactualmenteenelladofront-endpara
realizarpáginaswebdinámicas[20].
71
4.2.2. ArquitecturaMVCEl patrón de arquitectura software seleccionado para el desarrollo del proyecto es
MVC (Modelo, Vista, Controlador). Esta arquitectura se fundamenta en separar los
datos y la lógica denegocio deuna aplicaciónde su representación, potenciando la
reutilizacióndecódigoylaseparacióndeasuntos, intentadoreducirlacomplejidada
lahoradeldesarrollodeaplicacionesysuposteriormantenimiento[21].
EnMVCexisten3componentesdiferenciados:elmodelo,querepresentalosdatos,la
vista,querepresenta lavisualizacióndeestosdatos juntocon la lógicadenegocioy,
por ultimo el controlador, que ejecuta la lógica de negocio y además sirve de
intermediarioparalosotrosdoscomponentes(Figura4.22).
Figura4.22ArquitecturaMVC.
ElpatrónMVCoriginalmenteseplanteóparaeldesarrollodesoftwaredeescritorio,
aunque ha sido adaptado por los principales lenguajes de programación para el
desarrollo de aplicacionesWeb. En los primeros frameworks de desarrolloWeb el
MVCplanteabaunenfoqueenelquetodoelpatróneraresponsabilidaddelservidor.
Sin embargo, hoy en día lamadurez que ha alcanzado el desarrollo de aplicaciones
webpermitequeciertoscomponentesdelMVCseejecutenparcialototalmenteenel
cliente.
72
4.2.3. ElecciónFrameworkJavaScriptActualmenteeneldesarrollofront-endsesigueunacorrientellamadaSPA(SinglePage
application),quesignificaqueelusuariopercibequelaaplicaciónwebconstadeuna
paginaúnica con el propósito dedar una experienciamas fluida a los clientes, tal y
comoocurreconunaaplicacióndeescritorio.Laaplicación interactúaconelusuario
reescribiendo dinámicamente la página actual en lugar de cargar páginas enteras
desde un servidor, eliminando así el efecto retardo de carga de páginas. Todos los
códigos HTML, Javascript y CSS se cargan de una solo vez o se van cargando
dinámicamentesegúnlasaccionesqueelusuariorealiceenlapágina.
Actualmenteexistenenelmercadonumerosos frameworkso libreríasqueusanesta
arquitectura. Las más populares son React (Facebook), Vue.js (Libre) y Angular
(Google). Todos los frameworks nombrados tienen prácticamente las mismas
propiedadesyadíadehoyhanadoptadocaracterísticasunosdeotros, loquehace
queseanmuysimilares.Porello,laseleccióndelframeworklarealizaremosenbasea
pequeñosmatices.Reactesunalibreríaynounframework,porloquehacedifícilel
comienzodeunproyecto,yaquenecesitamosdefinirmuchasdependenciasparaun
productosoftwaresimple.Porotro lado,aunqueVue.jsesactualmentemuypopular
entrelosdesarrolladores,noestámuymadurocomopararealizarunproyectodegran
envergadura.Porúltimo,Angularcumpleconnuestrasnecesidadesporquetienetodas
las dependencias que se necesitan para comenzar con un proyecto y dispone de
muchasherramientasparaeldesarrollo front-end, loque simplificaeldesarrollodel
mismo. Por ello, finalmente hemos escogido este último framework respaldado por
Google.
4.2.3.1. FrameworkdeJavaScript:Angular
LasprincipalescaracterísticasqueofreceAngularalahoradedesarrollaraplicaciones
SPA’ssonlassiguientes[23]:
73
• Velocidadyrendimientograciasalageneracióndecódigoylareutilizaciónde
componentes. Esta velocidad también la aporta la compilación en AOT que
simplificaelcódigocompilado.
• Angular Universal permite que las SPA’s tengan las posibilidades de
posicionamientoweb.
• OfreceAngularCli,queesunaherramientade líneadecomandosquefacilita
muchaslabores,comolageneracióndeplantillasbaseparalarealizacióndelos
diversoscomponentesquetieneAngular.
• Angularestácentradoeneltestingylaaccesibilidadyporellotienenmuchas
característicasyfacilidadespararealizartestunitariosytestend-to-end.
• Angularusa lasprincipalesherramientasdelfront-endactualquesonHTML5,
CSSYTYPESCRIPTOJAVASCRIPT.
74
5. INSTALACIÓNYPRUEBASEneste apartadoabordaremos lapartede instalación ypruebasde la aplicación. La
instalación que realizaremos será el despliegue del back-end y front-end en AWS
(AmazonWeb Services), que actualmente en elmercado es lamejor opción para el
desplieguedeaplicaciones,escalandolosrecursoshardwaresegúnlasnecesidadesdel
momento y, por tanto aportando un ahorro de dinero a largo plazo al eliminar el
mantenimientodelhardwaredenuestrosistema.
Por otro lado, realizaremos pruebas a la aplicación para validar que cumple los
requisitos funcionales definidos en [11]. En estas pruebas nos focalizaremos en la
funcionalidadrelacionadaconlarealizacióndeencuestasygeneracióndeestadísticas,
ambasobjetivosprincipalesdeestePFG.
5.1. INSTALACIÓNEnesteapartadodescribiremos lospasosa seguirparadesplegar la aplicaciónQOS-
UPMtantoparaelladoback-endcomoparaeldefront-end.Comosehamencionado
previamente,desplegaremoslaaplicaciónenlanubedeAWSporquetienelasmejores
solucionesenelmercadoycumpleconlasnecesidadesdenuestraaplicación.
5.1.1. Instalacióndelback-endParalainstalacióndelback-endenlanubedeAWSnecesitaremostener3serviciosde
AWS preparados para usar. Dado que no se plantea como propósito de este PFG
analizar cómo usar los servicios de AWS, simplemente referenciaremos las guías de
instalacióndelosmismas.
75
Los3serviciosdeAWSquenecesitaremospreviamenteinstaladossonlossiguientes:• VPC
• InstanciaEC2
• RDS
En los siguientes subapartados explicaremos brevemente estos 3 servicios, y por
último documentaremos la instalación de nuestra aplicación Laravel en nuestra
instanciaEC2.
5.1.1.1. AWSVPC
AWSVPC(VirtualPrivateCloud)esunserviciodeAWSfundamentalparadefiniruna
redvirtualen lanube.Ennuestro caso lousaremosparaalojar la instanciaEC2que
explicaremosenelsiguienteapartado.
En esta red virtual se puede definir un rango de direcciones IP, crear subredes y
configurar tablas de ruta y gateways de red, como ocurre en nuestro caso que
usaremosunGatewayparasalirainternetpública.Podemosencontrarcómocrearun
VPCpasoporpasoenladocumentaciónoficialdeAWS[24].5.1.1.2. AWSEC2
AWSEC2(ElasticComputeCloud)esunodelosserviciosmásimportantesqueofrece
AWSporquenospermitedesplegarservidores(instanciasEC2)enlanubedemanera
quesepuedanescalarsegúnlademanda.
Ennuestrocaso,necesitaremosunodeestosservidoresparadesplegar laaplicación,
un servidor con la imagen de Ubuntu Server 16.04 LTS. Para crear este servicio
seguiremoslaguía[25].
5.1.1.3. AWSRDS
AWSRDS(RelationalDatabaseService)esunservicioquepermiteconfigurar,utilizary
escalarbasesdedatosrelacionalesenlanube.
ParanuestraaplicaciónnecesitaremosdesplegarunabasededatosMariaDB,quees
unadelasquesoportaAWS.Pararealizareldespliegueseguiremosladocumentación
76
oficial de Amazon [26] y simplemente cambiaremos el nombre por QOS-UPM-db-
instance.
5.1.1.4. InstalaciónydespliegueLaravelenEC2
EnesteapartadosedocumentalainstalacióndeLaravelennuestrainstanciaEC2.Para
elloprecisamosdeunosrequisitosennuestrainstancia:
• Nginx1.14
• PHP-7.2
• PHP7.2-FP
Lospasosarealizarparaeldespliegueson:
1. HacerLoginenlainstanciaEC2(Figura5.1).
Figura5.1LoginenEC2.
2. Actualizar(update)laslibreríasdelainstancia.
$sudoapt-getupdate
$sudoapt-getupgrade
3. InstalarelservidorHTTPNginx.
Agregarunavariableglobal.
77
$nginx=stable
Agregarelrepositoriodenginxusandolavariablequesehadefinido.
$add-apt-repositoryppa:nginx/$nginx
Actualizardenuevolaslibreríasparaobtenerlaúltimaversióndenginx.
$apt-getupdate
Instalarnginx.
$apt-getinstallnginx
4. InstalarPhp
InstalarPython.
$apt-getinstallpython-software-properties
AgregarlasdependenciasdePhpalrepositorio.
$add-apt-repositoryppa:ondrej/php
Actualizarlasdependencias.
$apt-getupdate
InstalarPhp7.2yPhp7.2fpm.
$apt-get installphp7.2php7.2-msqlphp7.2-mysqlphp7.2-fpmphp7.2-
xmlphp7.2-gdphp7.2-opcachephp7.2-mbstring
Phptambiénnecesitaráinstalarlossiguientespaquetes.
$aptinstallzipunzipphp7.2-zip
5. InstalarLaravelydesplegarnuestrocódigo.Descargarcomposer.
$curl-sShttps://getcomposer.org/installer|php
HacercomposerejecutableennuestroEC2.
$mvcomposer.phar/usr/local/bin/composer
Bajar a la carpetadonde se va adesplegarnuestro código y subir nuestro
códigoporftpavar/www.
cd/var/www
Agregarpermisosypropietariodeldirectorio
$chown-Rwww-data:www-datatest/
$chmod-R775test/
78
6. ConfigurarelVirtualHostennginx
bajaraldirectoriodondeestánlossitiosdisponiblesdenginx
$cd/etc/nginx/sites/available
Modificarelarchivovirtualhostparaquequedeigualque:
1. server{
2. listen80default_server;
3. listen[::]:80default_server;
4.
5. root/var/www/qos/public;
6.
7. indexindex.phpindex.htmlindex.htmindex.nginx-debian.html;
8.
9. server_name_;
10.
11. location/{
12. try_files$uri$uri/=404;
13. }
14.
15. location~\.php${
16. includesnippets/fastcgi-php.conf;
17.
18. #Withphp-fpm(orotherunixsockets);
19. fastcgi_passunix:/var/run/php/php7.2-fpm.sock;
20. #Withphp-fpm(orotherunixsockets);
21. }
22. }
Reiniciarnuestroservidornginx.
$servicenginxrestart
Unavezrealizadosestospasoselproyectoestarádesplegadoylistoparausaratravés
deinternet.
79
5.1.2. Instalacióndelfront-endEnesteapartadosedocumentaeldesplieguedelfron-end,queennuestrocasoesuna
aplicaciónAngular.Ladesplegaremosenlanube,específicamenteconelservicioAWS
S3, que permite el almacenamiento de ficheros en la nube demanera segura, pero
tambiénsoportaeldesplieguedepáginasweb.
5.1.2.1. DesplieguedeAngularenAWSS3
ParadesplegarlaaplicaciónAngularenAWSS3serealizanlossiguientespasos:
1. Enlacarpetadondeseencuentrelocalizadoelcódigodenuestroproducto,en
este caso en un ordenador local en la ruta /TFG/frontend, se ejecutará un
comandoparacompilarelcódigo:
ngbuild--prod--aot
Despuésdelaejecucióndeestecomandoen/TFG/frontend/sehabrácreado
unacarpetadistquehabráquesubiraAWSenlossiguientespasos.
2. Hacer loginenAWSy seleccionarel servicio S3en la consola. Semostraráel
paneldelservicioS3(Figura5.2).
Figura5.2ArquitecturaMVC.
3. Seleccionarelbotón“Createbucket”paracrearunbucket,queessimilarauna
carpetavirtual.Apareceráunmodalquetendrá4pasos.Enelprimerpasose
solicitará el nombre a asignarle al bucket, ennuestro caso com.qosupm, y la
región donde se desplegará el mismo (Figura 5.3). En el segundo paso se
podránañadirextrascomologgingyotrascaracterísticas(Figura5.4),aunque
enla instalaciónrealizadasimplementepasaremosalsiguientepasopulsando
80
“Next”. Enel tercerpasopodremos configurar lospermisosdeaccesode los
usuariosa losarchivosqueseubicaránenesebucket,así como lospermisos
públicos desde el exterior (internet), de una forma similar a un sistema de
archivos de Windows (Figura 5.5), aunque en la instalación realizada no
necesitaremos cambiar esta configuración y simplementepulsaremos “Next”.
En el último paso se mostrará un resumen con la configuración realizada
(Figura5.6),queverificaremosyfinalizaremosasílacreacióndelbucket.
Figura5.3CrearbucketPaso1.
81
Figura5.4CrearbucketPaso2.
Figura5.5CrearbucketPaso3.
82
Figura5.6CrearbucketPaso4.
4. Unavezcreadoelbucket(Figura5.7),pulsarelbotón“Upload”quevisualizará
unaventanamodaldondeseseleccionaránlosarchivosgeneradosenelpaso1
para subirlos al bucket (Figura5.8). Existenmáspasos, pero en la instalación
realizada simplemente se pulsa “Upload” con los valores por defecto,
quedandolosficherossubidosenelbucket(Figura5.9).
Figura5.7Vistabucketvacío.
83
Figura5.8Subidaficherosalbucket.
Figura5.9Vistabucketconnuestraaplicacióncompilada.
5. Configurar el S3 como un webserver, para lo que se debe seleccionar en la
pestaña “Permissions” del panel principal del S3 la opción “Bucket Policy”
(Figura 5.10). Como queremos dar permisos a usuarios anónimos para que
puedan acceder a nuestro bucket, usaremos el ejemplo que facilita AWS en
84
[27]ysimplementecambiaremos lapropiedad“Resources”porelnombrede
nuestrobucketcom.quosupm(Figura5.11)yguardaremoselcambio.
Figura5.10Pestañapermissionsdelbucket.
Figura5.11Pólizaquetendráelbucket.
6. Por último, en la pestaña “Properties” se configura el bucket para que actúe
comounwebserver.Seindicaelnombredelficheroindex(páginadeentradaal
sitioweb)yfinalmentesepulsaelbotón“Save”(Figura5.12).
85
Figura5.12Configuracióndelíndicedelwebserver.
Cuandounusuarioentreenlaaplicaciónwww.qous.ioelresultadoquevisualizaráen
elnavegadorseráelmostradoenlaFigura5.13.
Figura5.13PaginaQOSUPM.
5.2. PRUEBASEsteapartadodocumentatodoslosaspectosrelacionadosconlaspruebasquesehan
realizadosobreaplicaciónQOS-UPM.Talycomosehaindicadoenlaintroducciónde
estecapítulo,laspruebassecentraránenlarealizacióndeencuestasporpartedelos
alumnosylageneracióndelosinformesderesultadosestadísticos.Paraello,hasido
86
necesaria la creación de una estructura base organizativa de Universidad (Escuela,
Departamento, Grado, Profesorado, alumnado, asignatura, cursos, grupos) para
probarelfuncionamientodelaaplicacióndemaneraordenada.
Unavezcreadaestaestructuradeejemploseprocederáarealizarpruebasfuncionales
delaaplicación,centrándoseenlarealizacióndeencuestasyenlavisualizacióndelos
diferentestiposdeinformesestadísticosquetendrálaaplicación.
5.2.1. Definicióndelaestructuradeejemplo.
En este apartado definiremos una estructura de ejemplo, que contendrá una
configuración similar, pero simplificada, respecto a la que tiene la UPM. La
organizaciónserálasiguiente:
• SedispondrádeunaEscuela,quecontaráconungradoG1yuncursoC1quese
impartiráen2grupos,G11YG12(Figura5.14).
• La escuela tendrá 2 departamentos, D1 y D2. El departamento D1 será
responsabledelasasignaturasASG1yASG2(Figura5.14)yeldepartamentoD2
delasasignaturasASG3yASG4(Figura5.15).Las4asignaturasseimpartiránen
losdosgrupos(G11yG12).
• El departamento D1 tendrá adscritos a los profesores PF1 y PF2 y el
departamento D2 a los profesores PF3 y PF4. Los profesores PF1 y PF2
impartirándocenciaen losdosgrupos (G11yG12)de lasasignaturasASG1y
ASG2.LosprofesoresPF3yPF4 impartirándocenciaen losdosgrupos(G11y
G12)delasasignaturasASG3yASG4.
• ElprofesorPF1serádirectordeD1yPF3loserádeD2.
• Existirán10alumnosmatriculadosen las4asignaturas (ASG1-ASG4):AL1-AL5
enelgrupoG11yAL6-AL10enelgrupoG12.
• Por último, el subdirector deordenación académica será unprofesor queno
seadirectordepartamento,ennuestrocasoPF4.
Lasfiguras5.14y5.15recogentodaestaorganizacióndemaneraesquematizada.
87
Figura5.14EstructuraconeldepartamentoD1.
5.2.2. Validacióndelafuncionalidadderealizacióndeencuestas.Para validar la funcionalidad de realización de encuestas, basada en la estructura
organizativa expuesta en el apartado anterior, cada alumno (AL1-Al10) realizaráuna
encuestadecadaasignatura/grupoenlaqueestématriculado.
LosalumnosAL1,AL2,AL3,AL4,AL5realizaranlasencuestas:
• ASG1–GrupoG11paralosprofesoresPF1YPF2.
• ASG2–GrupoG11paralosprofesoresPF1YPF2.
• ASG3–GrupoG11paralosprofesoresPF3YPF4.
88
• ASG4–GrupoG11paralosprofesoresPF3YPF4.
LosalumnosAL6,AL7,AL8,AL9,AL10realizaranlasencuestas:
• ASG1–GrupoG12paralosprofesoresPF1YPF2.
• ASG2–GrupoG12paralosprofesoresPF1YPF2.
• ASG3–GrupoG12paralosprofesoresPF3YPF4.
• ASG4–GrupoG12paralosprofesoresPF3YPF4.
Figura5.15EstructuraconeldepartamentoD2.
Amododeejemplo,acontinuaciónseexponelarealizacióndeunaencuestaporparte
deunalumno.Enprimerlugar,elalumnodebelogearseenQOS-UPM.Acontinuación,
leaplicaciónlemostraráenelpanelizquierdolasopcionesdisponibles,entrelasque
89
seencuentra laopciónde“Misencuestas”.Alseleccionarestaopciónsevisualizarán
enelpanelcentral lasencuestasdecadaasignaturagrupo-disponiblesquetendráel
alumno(Figura5.16).
Figura5.16Opción“Misencuestas”-App.
Alpulsarelbotónconeliconodelalupasobreunaasignatura-gruposenavegaráala
pantalla de realización de encuestas, donde aparecerán 3 apartados: el de las
instrucciones(Figura5.17),eldelaspreguntasrelativasalaasignatura(Figura5.18)y,
porultimo,elde laspreguntasrelativasalprofesorado(Figura5.19),queserepetirá
tantas veces comoprofesores impartandocenciaendichaasignatura-grupo. Enesta
pantallasedispondrádelbotónde“Send”(Figura5.20)queunavezpulsadoenviarála
encuestaalsistemaparasualmacenamiento.
Figura5.17OpciónRealizarencuestaInstrucciones-App.
90
Figura5.18OpciónRealizarencuestaPreguntasasignaturas-App.
Figura5.19OpciónRealizarencuestaPreguntasprofesorparte1-App.
Figura5.20OpciónRealizarencuestaPreguntasprofesorparte2-App.
91
5.2.3. Validacióndelafuncionalidaddegeneracióndeestadísticas.Una vez rellenadas todas las encuestas, se generarán los informes de resultados
estadísticos y se podrán visualizar en la aplicación. Teniendo en cuenta la
configuración organizativa que se ha empleado como base para las pruebas, en los
siguientessubapartadosseexponenlosinformesobtenidosagrupadosporasignatura-
grupo-profesor,asignatura,departamentoyescuela.
5.2.3.1. Informesestadísticosporasignatura/grupo/profesor
Losinformesgeneradosson:
• InformeestadísticodePF1YPF2enASG1/G11.
• InformeestadísticodePF1YPF2enASG2/G11.
• InformeestadísticodePF1YPF2enASG1/G12.
• InformeestadísticodePF1YPF2enASG2/G12.
• InformeestadísticodePF3YPF4enASG3/G11.
• InformeestadísticodePF3YPF4enASG4/G11.
• InformeestadísticodePF3YPF4enASG3/G12.
• InformeestadísticodePF3YPF4enASG4/G12.
Para validar los informes estadísticos se han comprobado los resultados de la
asignatura-grupo ASG1/G11 realizada a PF1 Y PF2 y de la asignatura ASG3/G12
realizadaaPF3yPF4.
a) AsignaturaASG1/G11realizadaaPF1yPF2
La Figura 5.21 muestra la cabecera del informe junto con los resultados de las
preguntasrelativasalaasignatura.Porotraparte,lafigura5.22yla5.23visualizanlos
resultadosrelativosalosprofesoresquehanimpartidodocenciaendichaasignatura-
grupo.
Además, el informe incorpora 3 tipos de gráficos que visualizarán las medias y
desviaciones de las preguntas: el primer tipo recogerá las preguntas relativas a la
asignatura (Figura 5.24); el segundo tipo recogerá las preguntas relativas al
92
profesorado, incluyéndoseungráficoporcadaprofesorquehayaimpartidodocencia
enlaasignatura-grupo(ennuestroejemplosetratadedosgráficos,talycomopuede
observarseenlasFiguras5.25y5.26);finalmenteeltercertiporecogerálasmediasy
desviaciones relativas a los totales del bloque de preguntas de la asignatura, del
bloquedepreguntasdelosprofesoresydeltotaldepreguntasdelaencuesta(Figura
5.27).
Figura5.21ResultadoestadísticoASG1/G11–Resultadopreguntasasignatura.
Figura5.22ResultadoestadísticoASG1/G11–ResultadopreguntaPF1.
Figura5.23ResultadoestadísticoASG1/G11–ResultadopreguntaPF2.
93
Figura5.24ResultadoestadísticoASG1/G11–Graficotipo1.
Figura5.25ResultadoestadísticoASG1/G11–Graficotipo2profesor1.
Figura5.26ResultadoestadísticoASG1/G11–Graficotipo2profesor2.
94
Figura5.27ResultadoestadísticoASG1/G11–Graficotipo3.
b) AsignaturaASG3/G12realizadaaPF3yPF4
La Figura 5.28 muestra la cabecera del informe junto con los resultados de las
preguntasrelativasalaasignatura.Porotraparte,lafigura5.29yla5.30visualizanlos
resultadosrelativosalosprofesoresquehanimpartidodocenciaendichaasignatura-
grupo.
Figura5.28ResultadoestadísticoASG3/G12–Resultadoasignatura.
Figura5.29ResultadoestadísticoASG3/G12–ResultadopreguntaPF3.
95
Figura5.30ResultadoestadísticoASG3/G12–ResultadopreguntaPF4.
Además,elinformeincorporalosgráficosquevisualizanlasmediasydesviacionesde
las preguntas relativas a la asignatura (Figura 5.31), las preguntas relativas al
profesorado (Figuras 5.32 y 5.33) y las relativas a los totales de los bloques de
preguntas de la asignatura y profesorado, así como del total de preguntas de la
encuesta(Figura5.34).
Figura5.31ResultadoestadísticoASG3/G12–Graficotipo1.
Figura5.32ResultadoestadísticoASG3/G12––Graficotipo2profesor3.
96
Figura5.33ResultadoestadísticoASG3/G12–Graficotipo2profesor4.
Figura5.34ResultadoestadísticoASG3/G12–Graficotipo3.
c) Validaciónderesultados
Para corroborar que los resultados mostrados son correctos se han comparado los
datos de la tabla de conteo, que almacena todos los resultados registrados, con los
datosdelosinformesgenerados.
Laasignatura-grupoASG1/G11secorrespondeconlaasignatura-grupo_id6enlatabla
de conteo (Figura 5.35), el profesor PF1 con profesor_id 1 y el profesor PF2 con
profesor_id 2 (Figura 5.36). En las tablas de conteo, el atributo orden identifica la
pregunta (1-7 las relativas a la asignatura y 8-17 las relativas al profesor). Cabe
destacarqueen lastablasdeconteoqueaparecenenesteapartadolastuplasestán
ordenadasporlacolumnaidynoporlacolumnaorden.Sehavalidadoquelosdatos
97
de la tabla conteode lasFiguras5.35y5.36 son losmostradosenel informede las
Figuras5.24-5.27yquelasmedias,lasdesviacionesylostotalessoncorrectos.
Figura5.35ConteoasignaturaASG1/G11.
Figura5.36ConteoprofesoresPF1yPF2enASG1/G11.
Por otro lado, la asignatura-grupo ASG3/G12 se corresponde con la asignatura-
grupo_id 11 en la tabla conteo (Figura 5.37), el profesor PF3 con profesor_id 3 y el
profesorPF4conprofesor_id4(Figura5.38).Denuevo,sehavalidadoquelosdatosde
la tabladeconteode lasFiguras5.37y5.38 son losmostradosenel informede las
Figuras5.31-5.34yquelasmedias,lasdesviacionesylostotalessoncorrectos.
Figura5.37ConteoasignaturaASG3/G12.
98
Figura5.38ConteoprofesoresPF3yPF4enASG3/G12.
5.2.3.2. Informesestadísticosporasignatura
Losinformesgeneradosson:
• InformeestadísticodeASG1.
• InformeestadísticodeASG2.
• InformeestadísticodeASG3.
• InformeestadísticodeASG4.
Para validar los informes se han comprobado los resultados estadísticos de la
asignatura ASG1. La Figura 5.39 muestra la cabecera del informe junto con los
resultados de las preguntas relativas a la asignatura. Por otra parte, la Figura 5.40
visualizalosresultadosrelativosalosprofesoresquehanimpartidodocenciaendicha
asignatura.
Figura5.39ResultadoestadísticoASG1–Resultadopreguntasasignatura.
99
Figura5.40ResultadoestadísticoASG1–Resultadopreguntasprofesorado.
Además,elinformeincorporalosgráficosquevisualizanlasmediasydesviacionesde
las preguntas relativas a la asignatura (Figura 5.41), las preguntas relativas al
profesorado(Figura5.42)ylasrelativasalostotalesdelosbloquesdepreguntasdela
asignaturayprofesorado,asícomodeltotaldepreguntasdelaencuesta(Figura5.43).
Figura5.41ResultadoestadísticoASG1–Gráficotipo1.
Figura5.42ResultadoestadísticoASG1–Gráficotipo2.
100
Figura5.43ResultadoestadísticoASG1–Gráficotipo3.
Aunqueenesteapartadonosehaincluidounacapturadelatabladeconteoapartir
de la cual se han obtenido los resultados del informe, se ha validado que todos los
datos,asícomolasmedias,desviacionesyvalorestotalescalculadossoncorrectos.
5.2.3.3. Informesestadísticospordepartamento
Losinformesgeneradosson:
• InformeestadísticodeD1.
• InformeestadísticodeD2.
Para validar los informes estadísticos se han comprobado los resultados estadísticos
del departamentoD1. La Figura 5.44muestra la cabecera del informe junto con los
resultados de las preguntas relativas a las asignaturas de las que es responsable el
departamentoD1(ASG1yASG2)).Porotraparte,laFigura5.45visualizalosresultados
relativosatodoslosprofesoresquehanimpartidodocenciaentodaslasasignaturas-
gruposquepertenecenadichodepartamento.
Además,elinformeincorporalosgráficosquevisualizanlasmediasydesviacionesde
las preguntas relativas a la asignatura (Figura 5.46), las preguntas relativas al
profesorado(Figura5.47)ylasrelativasalostotalesdelosbloquesdepreguntasdela
asignaturayprofesorado,asícomodeltotaldepreguntasdelaencuesta(Figura5.47).
101
Figura5.44ResultadoestadísticoD1–Resultadopreguntasasignatura.
Figura5.45ResultadoestadísticoD1–Resultadopreguntasprofesorado.
Figura5.46ResultadoestadísticoD1–GráficoTipo1.
102
Figura5.47ResultadoestadísticoD1–GráficoTipo2.
Figura5.48ResultadoestadísticoD1–GráficoTipo3.
De nuevo, se ha validado que todos los datos del informe del departamento se
correspondencon losobtenidosde la tabladeconteos,ysehacomprobadoque las
medias,desviacionesytotalescalculadossoncorrectos.
5.2.3.4. Informesestadísticosporescuela
Enestecasosegeneraunúnicoinforme,eldelaescuelaE1.
Paravalidarelinformeestadísticosehancomprobadolosresultadosestadísticosdela
escuelaE1.LaFigura5.49muestralacabeceradelinformejuntoconlosresultadosde
laspreguntasrelativasalasasignaturasqueseimpartenenlaescuelaE1(ASG1-ASG4).
103
Porotraparte, laFigura5.50visualiza los resultados relativosa todos losprofesores
quehan impartidodocenciaen todas lasasignaturas-gruposquepertenecenadicha
escuela.
Además,elinformeincorporalosgráficosquevisualizanlasmediasydesviacionesde
las preguntas relativas a la asignatura (Figura 5.51), las preguntas relativas al
profesorado(Figura5.52)ylasrelativasalostotalesdelosbloquesdepreguntasdela
asignaturayprofesorado,asícomodeltotaldepreguntasdelaencuesta(Figura5.53).
Figura5.49ResultadoestadísticoE1–Resultadopreguntasasignatura.
Figura5.50ResultadoestadísticoE1–Resultadopreguntasprofesorado.
Figura5.51ResultadoestadísticoE1–GráficoTipo1.
104
Figura5.52ResultadoestadísticoE1–GráficoTipo2.
Figura5.53ResultadoestadísticoE1–GráficoTipo3.
Finalmente, se ha validado que todos los datos del informe de la escuela se
correspondencon losobtenidosde la tablade conteosy seha comprobadoque las
medias,desviacionesytotalescalculadossoncorrectos.
105
6. CONCLUSIONESEsteproyectoFindeGradoconstituye la segundapartedeldesarrollodeQOS-UPM,
unaaplicaciónWebparalagestióndeencuestasdecalificacióndelaactividaddocente
del profesorado en el contexto de la Universidad Politécnica de Madrid.
Concretamentesehaabordadoeldiseñodelsistema,análisisdelastecnologíaspara
eldesarrollodelproyecto,implementación,instalaciónypruebasdelaaplicación.
Los objetivos planteados al comienzodel proyecto se han cumplido en su totalidad,
tanto en lo relativo a todas las fases dedesarrollo softwareplanteadas, comoen la
funcionalidad propuesta originalmente para la aplicación QOS-UPM: realización de
encuestas por parte de los alumnos, gestión de la organización del proceso de
realización de encuestas y organización de los centros y, finalmente, generación de
informesyresultadosdelasencuestasparasuconsultavíaonline.
Para el desarrollo de este PFG se ha hecho uso de una metodología de proceso
softwaretradicional.Enunaprimerafaseseharealizadoeldiseñodelsistema,donde
se ha abarcado la capa de persistencia recogida mediante un MER, así como los
diagramasde secuenciade las funcionalidadesprincipalesde laaplicaciónusandoel
lenguaje UML. Posteriormente se ha abordado la capa de interfaz, planteando un
prototiporealizadomediantemocksparatenerunaideadelainterfazdeusuariofinal.
Enunasegundafasesehananalizado,comparadoyseleccionadolastecnologíasque
se han usado en la realización de este proyecto. Por último, se ha realizado la
instalaciónde laaplicaciónen lanube,y sehavalidado la funcionalidadprincipalde
QOS-UPM, creando una configuración base de la universidad, generando diversas
106
encuestas, visualizando los resultados estadísticos y verificando los datos contra la
tabladeconteos.
Este trabajo de fin de carrera tiene un impacto social amplio porque permitirá a la
comunidadeducativaaccedervíaonlinearesultadosestadísticossobrelacalidaddela
enseñanzaeducativaenlauniversidad,ymásconcretamenteenlaUPM,facilitandode
esta manera la posibilidad de tomar medidas para su mejora. Respecto al impacto
ambiental, tal y como se comentóen la introducción, elusodelpapel y tónerenel
sistema actual de realización de encuestas afecta negativamente almedioambiente,
mientrasqueconesteproyectosemejorasustancialmente,eliminandoporcompleto
elusodepapelytónerparatodoelprocesoderealizacióndeencuestasyvisualización
deresultadosestadísticos.
En el aspecto de responsabilidad ética y profesional este proyecto aborda dos
cuestionesimportantes.Laprimeraesqueelmodelofinaldelaaplicaciónasegurael
anonimato de los alumnos que realizan las encuestas, para que nunca se pueda
relacionar las respuestas sobre un profesor a un alumno en particular. El segundo
aspecto de responsabilidad es el relacionado con la decisión de que los resultados
estadísticos estén abiertos a todos los usuarios de la aplicación. Cabe destacar que
estehechoesasísimplementeportransparenciadedatosatodalacomunidadyque
los datos que se recogen sobre el profesorado, que en primera instancia son los
actores a los que se evalúa en su aspecto profesional, únicamente tienen como
propósitolamejoraensuactividaddocente.
LarealizacióndeesteProyectodeFindeGradohasidomuyimportanteparafinalizar
misestudiosporquehepodidollevaralaprácticagranpartedelosconocimientosque
he obtenido a lo largo de los 4 años del grado, pudiendo realizar diversas tareas
relacionadasconeldesarrollodesoftwareactual,haciendousodebuenasprácticasy
detectando los errores comunes que se cometen en el proceso software. Cabe
destacarqueelgradoquehecursadoeseldeIngenieríadeSoftware,porloqueeste
proyecto me ha permitido profundizar en aspectos y conceptos de ingeniería del
software que se tratan en alguna de las asignaturas de este grado, si bien quiero
107
destacar el aprendizaje autodidacta que he tenido que realizar de la tecnología
abordadaparaeldesarrollodelproyecto.Porúltimo, tambiénhepodidoaprendera
documentarcorrectamenteunproyectosoftware,asícomoaorganizaryelaborar la
documentacióndeuntrabajodefindecarrera.
Talycomosecomentóenlosobjetivosdelproyecto,estePFGeslacontinuacióndel
PFG[11],dondeseabordaron las fasespreviasdelprocesosoftwarede laaplicación
QOS-UPM.
Lasposiblesampliacionesde laaplicaciónQOS-UPMsondiversas.Unadeellases la
realización de aplicaciones nativas para Android e IOS para la realización de las
encuestas y consulta por parte de los alumnos, así como para la consulta de los
resultadosporpartede losprofesores,directoresdedepartamentoyeldirectordel
centro. La aplicación Web QOS-UPM podrá ejecutarse en móviles mediante un
navegador,pero,alnosernativa,elfrontendnoseadaptacorrectamente.Parahacer
estaampliaciónsereutilizaríalaAPIdesarrolladaysecambiaríaelcódigodefrontend
enangularparaagregarleNATIVESCRIPT,queesunframeworkquepermitecompilar
códigoangularaAndroideIOS.Otraposibleampliacióntrataríaconlaintegraciónde
QOS-UPM con los sistemas informáticos de la UPM, tanto centrales como locales a
cadaEscuela,paraevitarreplicardatosygestionesdelaaplicación,comopuedeserla
matriculacióndealumnosylagestiónyorganizacióndecentros.
108
BIBLIOGRAFÍA
[1]. EuropeanHigherEducationAreaandBolognaprocess.
URL:http://www.ehea.info.
[2]. EspacioEuropeodeEducaciónSuperior.
URL:http://www.eees.es.
[3]. EuropeanAssociationforQualityAssuranceinHigherEducation(ENQA).
URL:http://www.enqa.eu.
[4]. AgenciaNacionaldeEvaluacióndelaCalidadyAcreditación.
URL:http://www.aneca.es.
[5]. DOCENTIA UPM. Procedimiento de evaluación de la actividad docente delprofesorado.UniversidadPolitécnicadeMadrid.
URL:http://www.upm.es/Personal/PDI/Docentia?id=44e361d431a41410VgnVCM10000009c7648a____&fmt=detail&prefmt=articulo.
[6]. DOCENTIA UPM. ANEXO. Guías, protocolos y métodos de evaluación de laactividaddocentedelprofesorado.UniversidadPolitécnicadeMadrid.
URL:http://www.upm.es/Personal/PDI/Docentia?id=44e361d431a41410VgnVCM10000009c7648a____&fmt=detail&prefmt=articulo.
[7]. DOCENTIAUPM.Normativadelprocedimientodeevaluaciónde laactividaddocentedelprofesoradode laUniversidadPolitécnicadeMadrid (ProgramaDOCENTIA-UPM).
URL:http://www.upm.es/Personal/PDI/Docentia?id=44e361d431a41410VgnVCM10000009c7648a____&fmt=detail&prefmt=articulo.
[8]. Encuestasdeactividaddocente.UniversidadAutónomadeMadrid.
URL:https://www.uam.es/UAM/GEEI-Encuestas-Actividad-Docente/1242656740663.htm?language=es.
[9]. Encuesta de opinión al alumnado sobre la docencia de su profesorado.Manual de usuario para el Profesorado de la Aplicación Renovada para laEncuestadeOpiniónalAlumnado(AROA).UniversidaddelPaísVasco.
URL:https://www.ehu.eus/documents/1882427/1952726/ManualAroaCast.pdf/3ce0e7f9-3e24-4970-8859-9248a9104935.
[10]. EncuestasdesatisfaccióndelAlumnado.UniversidaddeSevilla.
URL:https://sfep.us.es/wsfep/sfep/encuestas_alumnado.html.
[11]. QOS-UPM: PlataformaWeb para la gestión de la valoración de la actividaddocentedelprofesoradouniversitario. Especificaciónde requisitos y análisis
109
delsistema.VerónicaMerinoGómez.ProyectoFindeGrado.ETSIdeSistemasInformáticos,2018.
[12]. ElLenguajeUnificadodeModeladoUML,2ºedición.BoochG.RumbaughJ.,JacobsonI.Editorial:Addison-Wesley(ObjectTechnologySeries),2006.
[13]. https://www.oscarblancarteblog.com/2017/03/06/soap-vs-rest-2/.
[14]. https://bbvaopen4u.com/es/actualidad/api-rest-que-es-y-cuales-son-sus-ventajas-en-el-desarrollo-de-proyectos.
[15]. https://coderseye.com/best-php-frameworks-for-web-developers/.
[16]. https://laravel.com/docs/5.6-Documentaciónoficialdelframeworklaravel.
[17]. https://swagger.io/solutions/api-documentation/ - Documentación oficial deapisdeswagger.
[18]. https://es.wikipedia.org/wiki/HTML
[19]. https://es.wikipedia.org/wiki/Hoja_de_estilos_en_cascada
[20]. https://es.wikipedia.org/wiki/JavaScript
[21]. https://es.wikipedia.org/wiki/Modelo%E2%80%93vista%E2%80%93controlador
[22]. https://es.wikipedia.org/wiki/Single-page_application
[23]. https://angular.io/guide/quickstart-Documentaciónoficialdeangular.
[24]. https://docs.aws.amazon.com/es_es/directoryservice/latest/admin-guide/gsg_create_vpc.html
[25]. https://www.clickittech.com/aws/create-amazon-ec2-instance/
[26]. https://docs.aws.amazon.com/es_es/AmazonRDS/latest/UserGuide/CHAP_Tutorials.WebServerDB.CreateDBInstance.html
[27]. https://docs.aws.amazon.com/es_es/AmazonS3/latest/dev/example-bucket-policies.html#example-bucket-policies-use-case-2
110
APÉNDICEA.Manualdeusuario
1. IntroducciónLaUniversidadPolitécnicadeMadridofreceel servicioQOSpara toda la comunidad
universitaria.Esteservicioestádestinadoa laevaluaciónde ladocenciauniversitaria
por parte del alumnado así como a informar de los resultados recogidos a toda la
comunidaduniversitariaenformadeestadísticas.
2. ¿Aquiénvadirigidaestaguía?El presente manual de usuario se dirige a toda la comunidad universitaria que
dispongan de un dispositivo móvil u ordenador, teniendo conexión a internet y un
navegador,accediendoawww.upm.es/qos.
3. SoporteSitienecualquierdudaoproblemasobreelserviciopuededirigirsusconsultasoabrir
incidencia en el Centro de Atención a Usuarios (CAU) que tiene disponible en
PolitécnicaVirtual.
https://www.upm.es/politecnica_virtual/
Atención al usuario à Atención Informática al usuario à Solicitudes à Red y
ComunicacionesàIncidenciaopeticiónrelacionadaconelservicioQOS.
Paraestar al díade los cambios ynovedadesque seproducenenel serviciode red
privadavirtual,recomendamosconsultarperiódicamenteladocumentaciónpublicada
enlawebInstitucionaldelaUniversidad(http://www.upm.es/qos)
111
4. Manualusuario
EstemanualdeusuariocubreelservicioQOSUPM,queescompatibleconcualquier
navegadorcomoChrome,Firefox, IE,etc., tantoparadispositivosdeescritoriocomo
móviles.
Estemanualestádivididoporlasfuncionalidadesquetendrácadarolenlaaplicación,
comenzando por un apartado común que es el de acceso a la aplicación, y seguido
posteriormenteporlafuncionalidadparalosrolesdeprofesor,alumno,administrador
yterminandoconelapartadocomúnvisualizarestadísticas.
4.1 Funcionalidadcomún“Accesoalaaplicación”
Paraaccederalaaplicaciónseseguiránlossiguientespasos:
1. AccederalaaplicaciónatravésdelaURLwww.upm.es/qos.
2. Laprimerapantallaqueapareceráseráladeiniciarsesión(FiguraA.1).Aeste
servicio podrá acceder cualquier persona de la comunidad universitaria que
tenga un correo UPM. Para iniciar sesión en usuario tendrá que indicar su
correo institucionalysucontraseña.Porúltimo,sedeberápulsarenelbotón
iniciarsesión.
FiguraA.1Pantalla-Iniciarsesión.
112
3. Pordefecto,aliniciarsesiónseaccedealaopciónexplorarestadísticas(Figura
A.2).
FiguraA.2Pantalla-Explorarestadísticas.
4.2 FuncionalidadrolProfesor
Enesteapartadosecubrentodaslasfuncionalidadesquetendráunusuarioconrolde
profesor.Esterolenparticulartienemuchossubrolesque,ademásdedisponerdelas
funcionalidadesdelrolprofesor,tendránfuncionalidadesextras.
Funcionalidadespropiasdelrolprofesor:
a) Funcionalidad de acceso a resultados estadísticos. Esta funcionalidad se
explicará en el último apartadode estemanual, al ser comúnpara todos los
roles.
4.2.1Roltipocoordinador
Además de tener las funcionalidades propias de un profesor tendrá la siguiente
funcionalidad:
113
a) Asignarprofesoresagrupo.Paraesta funcionalidadseseguirán lossiguientes
pasos(previamentesedebehaberiniciadosesiónenlaaplicación):
1. En el menú lateral aparecerá la opción “Asignación profesores a
asignaturaGrupos”(FiguraA.3).
FiguraA.3OpciónAsignaciónprofesoresaasignaturaGrupos.
2. Al seleccionardichaopción semostraraun listadocon lasasignaturas-grupos
delascualeselusuarioescoordinador(FiguraA.4).
FiguraA.4PantallaAsignaciónasignaturaGruposaalumnos.
3. Seseleccionaunaasignatura-grupopulsandola lupaenlacolumnadeacción.
Semostraránlosprofesoresasignadosalaasignatura-gruposeleccionadayse
tendrálaposibilidaddeasignarnuevosprofesoresodesasignarprofesorespara
laasignatura-grupo(FiguraA.5).
114
FiguraA.5PantallaProfesoresdelaasignaturagrupo.
4. Paradesasignarunprofesordelaasignaturagrupobastaraconpulsarelbotón
conunaXenlacolumnadeacciones(FiguraA.6).
FiguraA.6Pantalladesasignarprofesordelaasignaturagrupo.
5. Para asignar un nuevo profesor a la asignatura-grupo se seleccionarán los
profesoresdeldropdown,quecontendráuna listacon las identificacionesdel
profesorado,y sepresionaráelbotón“Asignarprofesor”paraagregarlosa la
asignatura-grupo(FiguraA.7).
FiguraA.7Pantallaasignarprofesordelaasignaturagrupo.
4.2.2Roltipodirectordeescuela
Ademásde tener las funcionalidadespropiasdeunprofesorno tendráningunaotra
funcionalidadadicional.
115
4.2.3Roltipodirectordedepartamento
Además de tener las funcionalidades propias de un profesor tendrá las siguientes
funcionalidades:
a) Asignar profesores a asignaturas.No explicaremos esta funcionalidad porque
todaslasfuncionalidadesdetipoasignarsiguenelpatrónexpuestoen4.2.1–a.
b) Asignar coordinador de asignaturas. No explicaremos esta funcionalidad
porquetodaslasfuncionalidadesdetipoasignarsiguenelpatrónexpuestoen
4.2.1–a.
4.2.4Roltiposubdirectordeordenaciónacadémica
Además de tener las funcionalidades propias de un profesor tendrá la siguiente
funcionalidad:
a) CRUD de Curso. Para esta funcionalidad se seguirán los siguientes pasos
(previamentesedebehaberiniciadosesiónenlaaplicación):
1. En el menú lateral aparecerá el menú de configuración de universidad. Se
deberáseleccionar“Cursos”(FiguraA.8).
FiguraA.8OpciónCRUDCursos.
2. Al seleccionar dicha opción semostrará en la parte superior un conjunto de
filtrosparamejorarlabúsquedadeuncursoenconcreto.Despuésdelosfiltros
apareceráun listado con todos los cursosexistenteshastaelmomentoypor
últimosedispondrádeunbotónparaagregaruncursonuevo(FiguraA.9).
116
FiguraA.9PantallaCRUDCursos.
3. Parafiltrarlosresultadosesnecesariorellenarelformulariodefiltrado.Eneste
caso,grupotienedosatributosporloscualessepuedefiltrar,quesoncursoy
semestre. Una vez indicado el curso y/o el semestre se podrá filtrar
seleccionando el botón “Find”. Por último, el botón “Reset” servirá para
reiniciarelformulariodefiltrado(FiguraA.10).
FiguraA.10PantallaFiltradoCursos.
4. Paraagregarunnuevocursosedeberápulsarelbotón“AgregarCurso”(Figura
A.9), quemostrará un dialogo con un formulario a rellenar con los atributos
necesariosparalacreacióndeunnuevocurso.Finalmente,seagregaráelcurso
alpulsarelbotón“Save”(FiguraA.11).
FiguraA.11PantallaAgregarCurso.
117
5. Si sedeseaeditar o eliminar un cursobastará con seleccionarlo enel listado
(haciendoclicksobraél).Sedesplegaráundialogocon losatributosdelcurso
(cursoysemestre)quepodránmodificarse.Paraguardarloscambiossepulsará
elbotón“Save”.Porotrolado,siloquesedeseaeseliminarelcurso,bastará
con pulsar el botón de “Delete”, que eliminará el curso seleccionado (Figura
A.12).
FiguraA.12PantallaEdición/EliminaciónCurso.
b) CRUD de Grupo. No explicaremos esta funcionalidad porque todas las
funcionalidadesdetipoCRUDsiguenelpatrónexpuestoen4.2.4–a.
c) Asignar Grupo a Curso. No explicaremos esta funcionalidad porque todas las
funcionalidadesdetipoasignarsiguenelpatrónexpuestoen4.2.1–a.
d) AsignarAsignaturaaGrupo.Noexplicaremosestafuncionalidadporquetodas
lasfuncionalidadesdetipoasignarsiguenelpatrónexpuestoen4.2.1–a.
e) Asignar fecha comienzo/fin encuesta. No explicaremos esta funcionalidad
porquetodaslasfuncionalidadesdetipoasignarsiguenelpatrónexpuestoen
4.2.1–a.
4.3 Funcionalidadrolalumno
Enesteapartadoseverántodaslasfuncionalidadesquetendráunusuarioconrolde
alumno.
Funcionalidadespropiasdelrolalumno:
118
a) Funcionalidad realizar encuesta asignaturas. Para esta funcionalidad se
seguiránlossiguientespasos(previamentesedeberáhaberiniciadosesiónen
laaplicación):
1. EnelmenúlateralsedispondrádelmenúOpciones.Seleccionarlaopción“Mis
encuestas”(FiguraA.13).
FiguraA.13Opción“Misencuestas”-Anexo.
2. Apareceráunlistadocontodaslasencuestasrelativasalasasignaturas-grupos
de lasqueelalumnoestámatriculadoenelsemestreactual.Elestadode las
encuestaspuedeserpendienteorealizado(FiguraA.14).
FiguraA.14PantallaMisencuestasdisponibles.
3. Pararealizarunaencuestasedeberápulsarelbotóndelalupa,quevisualizará
laencuestaarellenarporelalumno.Éstaestaráformadaporlasinstrucciones
(Figura A.15), preguntas relativas a la asignatura (Figura A.16) y preguntas
relativasalprofesorado(tantosbloquescomoprofesoresimpartandocenciaen
laasignatura-gruposeleccionado)(FiguraA.17yFiguraA.18).Unavezrellenada
laencuestasepulsaráelbotón“Send”.
119
FiguraA.15PantallaEncuesta-Instrucciones.
FiguraA.16PantallaEncuesta–Preguntasrelativasaasignatura.
FiguraA.17PantallaEncuesta–Preguntasrelativasaprofesoradoparte1.
120
FiguraA.18PantallaEncuesta–Preguntasrelativasaprofesoradoparte2.
b) Funcionalidad de acceso a resultados estadísticos. Esta funcionalidad se
explicará en el últimoapartadode estemanual, al ser comúnpara todos los
roles.
4.4 Funcionalidadroladministrador
Enesteapartadoveremostodaslasfuncionalidadesquetendráunusuarioconrolde
administrador.
Funcionalidadespropiasdelroladministrador:
a) CRUD de Escuelas. No explicaremos esta funcionalidad porque todas las
funcionalidadesdetipoCRUDsiguenelpatrónexpuestoen4.2.4–a.
b) CRUDdeDepartamentos.Noexplicaremosestafuncionalidadporquetodaslas
funcionalidadesdetipoCRUDsiguenelpatrónexpuestoen4.2.4–a.
c) CRUD de Profesores. No explicaremos esta funcionalidad porque todas las
funcionalidadesdetipoCRUDsiguenelpatrónexpuestoen4.2.4–a.
121
d) CRUD de Grados. No explicaremos esta funcionalidad porque todas las
funcionalidadesdetipoCRUDsiguenelpatrónexpuestoen4.2.4–a.
e) CRUD de Asignaturas. No explicaremos esta funcionalidad porque todas las
funcionalidadesdetipoCRUDsiguenelpatrónexpuestoen4.2.4–a.
f) CRUD de Alumnos. No explicaremos esta funcionalidad porque todas las
funcionalidadesdetipoCRUDsiguenelpatrónexpuestoen4.2.4–a.
g) AsignarDirectordeEscuela.Noexplicaremosestafuncionalidadporquetodas
lasfuncionalidadesdetipoasignarsiguenelpatrónexpuestoen4.2.1–a.
h) AsignarDirectordedepartamento.Noexplicaremosestafuncionalidadporque
todaslasfuncionalidadesdetipoasignarsiguenelpatrónexpuestoen4.2.1–a.
i) Asignar subdirector de ordenación académica. No explicaremos esta
funcionalidadporquetodaslasfuncionalidadesdetipoasignarsiguenelpatrón
expuestoen4.2.1–a.
j) Asignar Departamento a Escuela. No explicaremos esta funcionalidad porque
todaslasfuncionalidadesdetipoasignarsiguenelpatrónexpuestoen4.2.1–a.
k) Asignar Profesores a departamentos. No explicaremos esta funcionalidad
porquetodaslasfuncionalidadesdetipoasignarsiguenelpatrónexpuestoen
4.2.1–a.
l) Asignarasignaturaagrados.Noexplicaremosestafuncionalidadporquetodas
lasfuncionalidadesdetipoasignarsiguenelpatrónexpuestoen4.2.1–a.
m) Asignar asignatura a departamentos. No explicaremos esta funcionalidad
porquetodaslasfuncionalidadesdetipoasignarsiguenelpatrónexpuestoen
4.2.1–a.
n) Asignar alumnos a asignaturas. No explicaremos esta funcionalidad porque
todaslasfuncionalidadesdetipoasignarsiguenelpatrónexpuestoen4.2.1–a.
o) Funcionalidad de acceso a resultados estadísticos. Esta funcionalidad se
explicará en el último apartado de estemanual al ser común para todos los
roles.
122
4.5 Funcionalidadcomún“ExplorarEstadísticas”
Enesteapartadosecubrelafuncionalidadcomún“ExplorarEstadísticas”quetendrán
todoslosroles,dondesepodránvisualizarlosdiferentestiposdeestadísticas:
a) Visualizar estadísticas escuelas. Para esta funcionalidad se seguirán los
siguientespasos(previamentesedebehaberiniciadosesiónenlaaplicación):
1. Enelmenúlateral“Verestadísticas”sedeberáseleccionarlaopción“Explorar
estadísticas”(FiguraA.19).
FiguraA.19Opción“Explorarestadísticas”.
2. Aparecerá lapantalladonde sepodráelegir el tipodeestadística a visualizar
(FiguraA.20yFiguraA.21).Enestecasoseseleccionaráelbotón“Explore”de
estadísticasEscuelas.
FiguraA.20Pantalla“Explorarestadísticas”parte1.
123
FiguraA.21Pantalla“Explorarestadísticas”parte2.
3. Al explorar estadísticas de escuelas, se mostrará en la parte superior un
conjunto de filtros para mejorar la búsqueda de las escuelas. En la parte
inferior se visualizará un listado con todas las escuelas que disponen de
resultados estadísticos. Para acceder a los resultados estadísticos de una
escuela se pulsará el botón lupa correspondiente de la columna de acción
(FiguraA.22).
FiguraA.22PantallaEscuelasderesultadosestadísticos.
4. Semostrará el informede resultados estadísticos de la escuela seleccionada,
queestaráformadoporlacabecera,losresultadosdelaspreguntasrelativasa
laasignatura (FiguraA.23) y los resultados relativosa losprofesoresquehan
impartidodocenciaen lasasignaturasquepertenecenadichaescuela (Figura
A.24).
124
Además,elinformeincorporará3tiposdegráficosquevisualizaránlasmedias
ydesviacionesdelaspreguntas:elprimertiporecogerálaspreguntasrelativas
alaasignatura(FiguraA.25);elsegundotiporecogerálaspreguntasrelativasal
profesorado (Figura A.26); finalmente el tercer tipo recogerá las medias y
desviaciones relativas a los totales del bloquede preguntas de la asignatura,
del bloque de preguntas de los profesores y del total de preguntas de la
encuesta(FiguraA.27).
FiguraA.23Pantalladeresultadosestadísticos-resultadosasignatura.
FiguraA.24Pantalladeresultadosestadísticos-resultadosprofesorado.
FiguraA.25Resultadosestadísticos–GráficoTipo1.
125
FiguraA.26Resultadosestadísticos–GráficoTipo2.
FiguraA.27Resultadosestadísticos–GráficoTipo3.
b) Visualizar estadísticas departamentos. No explicaremos esta funcionalidad
porquetodaslasfuncionalidadesdetipovisualizarestadísticassiguenelpatrón
expuestoen4.5–a.
c) Visualizarestadísticasasignaturas.Noexplicaremosestafuncionalidadporque
todas las funcionalidades de tipo visualizar estadísticas siguen el patrón
expuestoen4.5–a.
126
d) Visualizar estadísticas asignatura grupos. No explicaremos esta funcionalidad
porquetodaslasfuncionalidadesdetipovisualizarestadísticassiguenelpatrón
expuestoen4.5–a.