scieee AI-readable full text Open interactive document viewer

Web para la gestión electrónica de una carpeta de aprendizaje

Forte Romera, David

Abstract

Aplicació web que té com a objectiu ser utilitzada com a eina d'aprenentatge en línia per part d'alumnes i professors de l'assignatura Robòtica i automatització industrial (Escola d'Enginyeria, UAB).

Full text

  Webparalagestión electrónicadeunaCarpeta deAprendizaje  Memoriadelproyecto DeIngenieríaTécnicaen InformáticadeSistemas realizadopor DavidForteRomera ydirigidopor AsierIbeasHernández   EscuelaUniversitariadeInformática Sabadell,Septiembrede2009      Elabajofirmante,AsierIbeasHernández,profesordelaEscuela UniversitariadeInformáticadelaUAB,  CERTIFICA: Queeltrabajoalquecorrespondelapresentememoriahaestado realizadobajosudirecciónporDavidForteRomera.  Yparaqueconstefirmalapresente. Sabadell,Septiembredel2009      ‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐ Firmado:AsierIbeasHernández  RESUMENDELPROYECTO  Larápidaevolucióndelatecnologíahapermitidoquelagranmayoríadepersonas tenganaccesotantoaunaconexiónaInternetcomoaunordenadordeforma habitual,haciendoposibleuncambiodementalidadalahoraderealizarlasdiferentes tareasdesutrabajo.Conesaideaaplicadaalcampodeladocencia,sehadecidido implementarunaaplicaciónwebconelobjetivodeaprovecharestanuevarealidadala horadehacerlasdiferentesactividadesdelcursoparalaasignaturadeRobóticay AutomatizaciónIndustrial. Elproyectoestádivididoendospartesbiendiferenciadas.Laprimeraeslapartedel alumno,quecomousuariodeestaaplicaciónpodráañadirymodificarlasrespuestasa losejerciciosqueseproponganduranteelcurso,ademásdeobtenerlainformación referentealaasignatura. Lasegundapartesetratadelaseccióndelprofesor,quecomoadministradortendrála posibilidaddeañadiroeliminaractividadeseinformacióndelaasignaturaademásde teneraccesoatodaslaspáginasdelosalumnosparahacerelseguimiento. Elobjetivoesconseguirunacomunicaciónfluidaentreprofesoryalumno,asícomoun controlmásexhaustivodeltrabajorealizadoporcadaestudianteyunseguimiento máscontinuadodelaasignaturaporpartedeéste,ademásdelosobjetivos mencionadostambiénsepretendeagilizareltrabajodecorrecciónporpartedel profesor. Entrelasprioridadesdeestaaplicaciónestánlasdeminimizarlomáximoposiblelos inconvenientesporelcambiodemetodologíadetrabajo,tantodelosalumnoscomo delosprofesores,utilizandoundiseñointuitivo,ademásdebuscarundiseñorobustoy fiablequepermitagarantizarelaccesoseguroalaaplicación,yuncontroladecuado delainformacióncontenidaenlabasededatos.  ÍNDICE  1Introducción..................................................................................... 7 1.1Presentación.............................................................................................. 7 1.2Objetivos...................................................................................................... 7 1.3Estadodelarte........................................................................................... 7 1.4Estructuradelamemoria.................................................................... 8 2Estudiodeviabilidad..................................................................... 9 2.1Introducción............................................................................................... 9 2.2Objeto............................................................................................................ 9 2.2.1Descripcióndelasituaciónactual.............................................. 9 2.2.2Perfildelusuario............................................................................ 9 2.2.3Objetivos.......................................................................................... 10 2.2.4Fuentesdeinformación................................................................. 10 2.3Sistemaarealizar...................................................................................... 10 2.3.1Descripción...................................................................................... 10 2.3.2Modelodedesarrollo..................................................................... 11 2.3.3Recursosdedesarrollo.................................................................. 11 2.3.4Recursosdeimplementación........................................................ 12 2.4Análisisdecostebeneficio.................................................................... 13 2.5Evaluaciónderiesgos.............................................................................. 14 2.6Planificación............................................................................................... 14 2.7Viabilidadtécnica..................................................................................... 15 2.7.1Alternativas.................................................................................... 15 2.7.2Análisisdetecnologías.................................................................. 16 2.7.3Tablacomparativadetecnologíasweb..................................... 19 2.7.4Tecnologíawebparaelproyecto................................................. 19 2.8Conclusiones............................................................................................... 20 3Análisis............................................................................................... 21 3.1Requisitosfuncionales............................................................................ 21 3.2Requisitosnofuncionales...................................................................... 21 3.3Diagramadecasosdeuso...................................................................... 22 3.3.1Alumno............................................................................................. 22 3.3.2Profesor........................................................................................... 23 3.4Descripcióndeloscasosdeuso............................................................ 24 3.4.1Alumno............................................................................................. 24 3.4.2Profesor........................................................................................... 28 4Herramientasutilizadas............................................................... 35 4.1Struts2......................................................................................................... 35 4.2JavaScript..................................................................................................... 35 4.2.1JSMath.............................................................................................. 36 4.2.2Prototype......................................................................................... 36 4.2.3Tiny_mce.......................................................................................... 36 4.3CSS.................................................................................................................. 36 4.4Jasypt............................................................................................................. 37 4.5MySQL........................................................................................................... 37 4.5.1MySQLAdministrator.................................................................... 37 4.6Hibernate..................................................................................................... 37 4.7Tomcat.......................................................................................................... 38 4.8Eclipse........................................................................................................... 38 4.9OpenSSL........................................................................................................ 38 5Diseñodelaaplicación................................................................. 39 5.1Basededatos.............................................................................................. 39 5.1.1Diagrama......................................................................................... 39 5.1.2Estructura....................................................................................... 40 5.2Interfazgráfica.......................................................................................... 44 5.2.1Inicio................................................................................................ 44 5.2.2Alumno............................................................................................. 46 5.2.2.1Diario................................................................................................. 48 5.2.2.2Notas................................................................................................. 50 5.2.3Profesor........................................................................................... 50 5.2.3.1Listadealumnos............................................................................... 52 5.2.3.2Notas................................................................................................. 52 5.2.3.3Introduccióndeejercicios.................................................................. 53 5.2.4Subirarchivos................................................................................. 54 5.2.5Editordetextos.............................................................................. 54 5.2.6Botonera.......................................................................................... 55 6Implementación............................................................................... 56 6.1Capadelmodelo........................................................................................ 56 6.2Capadelavista.......................................................................................... 58 6.3Capadelcontrolador............................................................................... 59 6.4Internacionalizacióni18n..................................................................... 60 7Pruebas............................................................................................... 61 8Conclusiones..................................................................................... 67 9Bibliografía....................................................................................... 68 9.1Fuentesbibliográficas............................................................................. 68 9.2Fuenteselectrónicas................................................................................ 68 9.3Fuentestecnológicas………………………………………………………………69 Anexo........................................................................................................ 70   Webparalagestiónelectrónicadeunacarpetadeestudiante INTRODUCCIÓN  7  1.INTRODUCCIÓN  1.1Presentación Elproyectosebasaeneldesarrollodeunaaplicaciónwebquepermitaactualizarla metodologíadetrabajoutilizadahastaelmomentoenlaasignaturadeRobóticay AutomatizaciónIndustrialqueesunaasignaturaoptativadecuartodeIngeniería informáticaenlaEscueladeBellaterra. Eldesarrollodedichaaplicaciónpermitirámayoragilidadenlacorreccióny seguimientodelosalumnosporpartedelprofesor,yenelcasodelosalumnosse obtendrámásdinamismoenelseguimientodelaasignatura.  1.2Objetivos Elprincipalobjetivodelaaplicaciónesquepuedaserutilizadacomoherramientade trabajoenlaasignaturaanteriormentemencionadahaciendoquelaadaptaciónpor partedelosprofesoressearápida. Laaplicacióntienequeserdinámicaparapodermostraromodificardiferentes actividades,yseguraparaevitarintrusismoentrelascuentasdelosdistintosalumnos. Lapartedelaadministracióntambiéndebeserprivada,ypermitirverymodificarel restodecuentasdeusuario.  1.3Estadodelarte Enlaactualidad,conlairrupcióndelaweb2.0,sehapuestomásdemodaquenunca elusodeaplicacioneswebdondeelpapelquetienenlosusuariosescadavezmás activo,laswikissonunclaroejemplodeesatendencia,dondesefavorece principalmenteeltrabajoengrupoutilizandounaaplicaciónfácildeusarydebajo coste.OtraalternativaesMoodlequeesunsistemadegestiónderecursosconelque sepuedecrearcomunidadesdeaprendizajeenlíneayquetienedisponiblesdiferentes módulosparalacomunicaciónprofesor‐estudiante.Porúltimoestálaopcióndel CampusVirtualdelaUABmedianteelcuallosalumnosyprofesoresdeunaasignatura puedencomunicarseeintercambiarsediferentematerialpedagógicodeformarápida ysencilla. Enesteproyectosehabuscadounavariacióndeestaideaconelobjetivodeconseguir trabajosmásindividualizadosyañadirciertascomodidadesalusuariofinalcomoun Webparalagestiónelectrónicadeunacarpetadeestudiante INTRODUCCIÓN  8   editorWYSIWYG,oevitarquesetengaquecrearunapáginanuevaantesdepoder empezaraeditaruntexto.  1.4Estructuradelamemoria Lamemoriasehadivididoennuevecapítulosatravésdeloscualesseexplicaránlos objetivosdelproyectoasícomolastecnologíasusadasparasudesarrollo,ademásde cómosehadiseñadoycodificadolaaplicación. Enelprimercapítuloseveráunaintroducciónalproyectoconlosobjetivosprincipales quesepersiguenconsuimplementaciónademásdelasdiferentesalternativasquese puedenencontrarparaunusosimilar. Elsegundocapítuloestádedicadoalestudiodeviabilidad.Enélseestudiarála situaciónactual,elcostederealizaresteproyecto,losrecursosnecesariosdurantesu implementaciónyposteriorpuestaenmarchaolaplanificaciónparasudesarrollo. Eneltercercapítuloseharáunestudiomásenprofundidaddelosrequisitos funcionalesynofuncionalesdelproyecto.Tambiénseveránlosdiferentescasosde usoparacadaunodelosfuturosusuariosdelproyecto. Elcuartocapítuloserviráparadescribirlastecnologíasutilizadasparaeldesarrollodel proyectoademásdelsoftwareutilizadoparallevarloacabo. Elquintocapítulomostraraeldiseñodelaaplicacióndandounaespecialatención tantoaldiseñodelabasededatoscomoaldiseñodelainterfazgráfica. Elsextocapítuloseutilizaráparaexplicarlosdetallesdelaimplementación,comoel patróndedesarrolloqueutilizaStruts2olainternacionalizacióndelproyecto. Elséptimocapítuloestarádedicadoalapartadodepruebas,endondesecomprobará elbuenfuncionamientodelproyectoutilizandolosdosrolesdisponiblesdela aplicación. Enelcapítulooctavo,seencontrarálabibliografíautilizadaduranteeldesarrollodel proyecto. Finalmente,enelanexoseexplicarálamaneradecrearunusuarioadministradorpara podercomenzarautilizarlaaplicación.  Webparalagestiónelectrónicadeunacarpetadeestudiante ESTUDIODEVIABILIDAD  9  2.ESTUDIODEVIABILIDAD  2.1Introducción Enesteapartadoseanalizarálasituaciónactualylosrequisitosdelproyecto.También severánlosobjetivosprincipalesasícomoeltipodeusuarioalquesedestinarála aplicación. Acontinuaciónsemostraráelmodelodedesarrolloqueseutilizarádurantela realizacióndelproyectoademásdesuplanificación. Parafinalizar,seevaluarálaviabilidaddelproyectoteniendoencuentatodosestos factores.  2.2Objeto 2.2.1Descripcióndelasituaciónactual Actualmenteenlaasignaturaseutilizaunacarpetafísicadondelosalumnosguardan lasolucióndelasdiferentesactividadespropuestasduranteelcurso,yqueenciertas fechaslímitetienenqueentregarenmanoalprofesorparaqueestehagaun seguimientoyunaevaluacióndelalumno. Lasfuncionalidadesprincipalesquesepretendenconseguirsonunseguimientomás continuadodelaasignaturaporpartedelalumno,ademásdeaumentarlainteracción conelprofesor.Encuantoalprofesor,elobjetivoquesepersigueestenerunmayor controldeltrabajorealizadoporpartedelalumno.  2.2.2Perfildelusuario Estaaplicaciónseráutilizadatantoporlosalumnoscomoporlosprofesoresdela asignaturadeRobóticayAutomatizaciónIndustrial,loscualestienenunnivelmedio‐ altoenelmanejodeaplicacionesinformáticas.  Webparalagestiónelectrónicadeunacarpetadeestudiante ESTUDIODEVIABILIDAD  16   CampusVirtual ElCampusVirtualesunaaplicaciónwebutilizadaporlagranmayoríadeasignaturas impartidasenlaUAByconlaqueseconsigueunacomunicaciónbastantefluidaentre losprofesoresdeunaasignaturaylosalumnosmatriculadosenella. Laprincipalbazadeestaopcióneslafacilidaddeusoylasdiversasformasde comunicaciónentrelosusuarios,dondedestacaelusodeforosyelserviciode mensajeríainterna. ElCampusVirtual,aunquetambiénpresentalaposibilidaddeutilizarunawikipara cadaunadelasasignaturas,seusaprincipalmenteparahacerllegarelmaterial docentealosalumnosyparaqueestospuedanrealizarlasdiferentesentregasen formadearchivosadjuntosenlasfechasestablecidas.  Wiki Unawikiesunaaplicaciónquepermitealosusuarioseditarsucontenidoatravésde unnavegadorweb. Elprincipalusoquetienenlaswikiseslaedicióncolectivadeciertosdocumentos,ya sufavortienequeesunaformasencillayrápidademodificarloscontenidosdeuna página,aunquetieneelinconvenientedetenerquehaceruncontrolmásexhaustivo delcontenidoparaevitarmodificacionesnodeseadasporpartedeotrosusuarios.  Conclusiones Despuésdeverlasdiferentesalternativasquehaydisponiblessehadecididorealizar unaaplicaciónespecíficadebidoaquelaformadetrabajardeestasaplicacionesnose ajustaalametodologíadetrabajodeseadayaqueestánenfocadasaunusomás colaborativoentrelosdiferentesusuarios,enelcasodelaswikisydeMoodle,oestán enfocadosalintercambiodearchivosconlosdiferentescontenidos,enelcasodel CampusVirtual.  2.7.2Análisisdetecnologías: Microsoft.NET Microsoft.NETesunaplataformadedesarrolloyejecucióndeaplicaciones,quefacilita elprocesodeconstruccióndeaplicacionesmultipropósito,tantoenentornoscliente comoenentornosweb.Laplataforma.NETincorporaunaseriedeservicios Webparalagestiónelectrónicadeunacarpetadeestudiante ESTUDIODEVIABILIDAD  17   universalescomosonlagestióndememoriayrecoleccióndebasura,seguridad, controldecódigo,etc.…Porotroladoestála.NETframeworkqueesunabibliotecade clasesindependientedellenguaje,quefacilitaaldesarrolladortodosloselementos necesariosparaincorporarinterfacesdeusuarionativasyweb,accesoabasesde datos,comunicaciónatravésdered,etc. .NETsebasaenestándaresyaestablecidoscomoXML,SOAP,WSDLyengeneralbusca lacreacióndeaplicacionesfácilesdeintegrar,demodificaryagilizarla implementacióndecualquiertipodesoluciones,paracualquierdispositivosin importarsuhardware,sistemaoperativoolenguajeconelqueesténhechaslas aplicacionesqueejecuta,intentandoaprovecharparaellolainfraestructurade internet,redesyprotocolos. UnadelaspartesmásimportantesdeestatecnologíaeselCLR(CommonLanguage Runtime),queesunaaplicaciónsimilaraunamáquinavirtualqueseencargade gestionarlaejecucióndelasaplicaciones.ElCLRofrecealasaplicacionesnumerosos serviciosquefacilitansudesarrolloymantenimientoyfavorecensufiabilidady seguridad. Losobjetivosde.NETson: • Reducirlacomplejidadeneldesarrollodeaplicaciones. • Proporcionarunentornodeejecuciónrobustoyseguro. • Soportedemúltipleslenguajedeprogramación. • Intercambiodedatosentredistintasaplicaciones. • Crearunalibreríadeclasescomúnparatodosloslenguajes.  JAVA(J2EE) Esunaplataformaquehabilitasolucionesparadesarrollo,usoefectivoymanejode multicapasenaplicacionescentralizadasenelservidor.J2EEutilizalaplataformaJava 2SEparatenderunacompleta,estable,segurayrápidaplataformaJavaenelámbito empresarial.Permiteahorraralacompañíaporquehabilitaunaplataformaquereduce demanerasignificativaloscostosylacomplejidaddedesarrollodesoluciones multicapa,resultandoenserviciosquepuedenserdesarrolladosrápidamentey ampliadosfácilmente. Javaesunlenguajededesarrollodepropósitogeneralorientadoaobjetosyestá basadoenlaarquitecturadelladodelservidor.Usaunamáquinavirtualparala ejecucióndelosprogramas,loquepermitequelasaplicacionesescritasenJavase puedanejecutarencualquiermáquina,independientementedelsistemaoperativoyla configuracióndehardware.Javatambiénincluyeungranconjuntodecomponentes reutilizablesparaayudaralprogramador(Struts2,Tapestry,Spring,Hibernate,..,).Esta Webparalagestiónelectrónicadeunacarpetadeestudiante ESTUDIODEVIABILIDAD  18   arquitecturaconcentralamayoríadelosprocesosdelaaplicaciónenelservidoroen unaseccióndeeste.Estetipodearquitecturatienealgunasventajascomo: Múltiplesclientes:Unaarquitecturabasadaenelservidorrequiereunaclara separaciónentrelacapadelcliente(interfaz)ylacapadelservidor,enlacualse realizanlosprocesosdelaaplicación.Conestoseconsiguequeunamismaaplicación soportemúltiplesclientessimultáneamente,todoselloscondistintasinterfaces. Operacionesrobustas:Unaarquitecturabasadaenelservidorsoporta escalabilidad,confiabilidad,disponibilidadyrecuperabilidad. LosobjetivosdeJavason: • Sencillez. • Lenguajeorientadoaobjetos. • Robustoporquesimplificalagestióndememoriayeliminalascomplejidades delagestióndepunteros.  • Seguro. • Independientedelaarquitectura,pudiendoserusadoconhardwareysistemas operativosdiversos. • Multihilo.  PHP PHPesunlenguajedeprogramaciónusadogeneralmenteparalacreaciónde contenidoparasitiosweb.Setratadeunlenguajeinterpretadousadoparalacreación deaplicacionesparaservidores,ocreacióndecontenidodinámicoparasitiosweb. Elfácilusoylasimilitudconloslenguajesdeprogramaciónmáscomunespermiten quesuaprendizajeyusoenaplicacionescomplejassearápida. PHPseinterpretayejecutaenelservidoryelclientesolorecibeelresultadodela ejecución.Tambiénpermitelaconexiónamúltiplesservidoresdebasededatostales comoMySQL,Postgres,Oracle,…conloqueseconsigueaplicacioneswebmuy robustas. LosobjetivosdePHPson: • Lenguajemultiplataforma • Capacidaddeconexiónconlamayoríadecontroladoresdebasededatos • Ampliadocumentación. • Eslibre,porlotantodefácilacceso. • Programaciónwebdinámica. Webparalagestiónelectrónicadeunacarpetadeestudiante ESTUDIODEVIABILIDAD  19   2.7.3Tablacomparativadetecnologíasweb  Características.NETJava(J2EE)PHP Código  compilado(Pre compiladoes másrápido) Si,tantopre‐ compiladocomo compilado dinámicamente cuandosehaceuna petición. Si,tantopre‐ compiladocomo compilado dinámicamente cuandosehaceuna petición. No,unprograma externopuede mejorarel funcionamiento,pero novieneinstaladoen lamayoríade servidores. Lenguajede  scripts NoNoSi Orientadoa  objetos SiSiNo Lenguajesde  desarrollo soportados C++,C#,VisualBasic .NET,JScript.NET, Python,Perl,J#,etc… JavaPHP Navegadorpara  interpretar HTMLespecífico Si(InternetExplorer)NoNo Códigoabierto  NoSiSi Multiplataforma  NoSiSi Coste  ElevadoNuloNulo   2.7.4Tecnologíautilizadaparaelproyecto AunquePHPpodríaserunaopciónperfectamenteválidaparadesarrollarelproyecto debidoaqueesunlenguajefácildeaprenderydelqueseposeenalgunos conocimientosprevios,ademásdeserdecódigoabiertoymuyutilizadopara aplicacionesweb,sehadescartadoporquepresentaalgunaslimitacionescomosonel rendimiento,debidoaqueesunlenguajescript,yproblemasalahoradegestionar distintosusuarioscondiferentesinterfaces PorlotanosincontarconPHP,estánlasopcionesdeJavay.NETyaunqueconambas tecnologíassepuedeconseguirlosmismosresultados,sehatomadoladecisiónde utilizarJavajuntoaalgunodesusframeworksdedicadosaldesarrollowebdebidoa queesunatecnologíalibreyquepermiteprogramarlaaplicaciónconindependencia delaplataformaenqueseráutilizadaposteriormenteademásdeserunadelas tecnologíasmásutilizadasactualmenteparaestetipodeaplicaciones.  Webparalagestiónelectrónicadeunacarpetadeestudiante ESTUDIODEVIABILIDAD  20   2.8Conclusiones Conestaaplicaciónsepretendecubrirciertasnecesidadesexistentesenlaasignatura deRobóticayAutomatizaciónIndustrialtransportandolametodologíadetrabajo actualaunentornovirtualconloqueseconseguiráunamayoreficienciaeneltrabajo diariodelaasignatura,máscontroldeltrabajorealizadoporlosalumnosyaumentarla comunicaciónprofesor‐alumno. Porlotantounavezcomprobadoslosinconvenientesylasventajasquepodría ocasionareldesarrollodeestaaplicación,sepuedeafirmarqueesunproyecto completamenteviable. Webparalagestiónelectrónicadeunacarpetadeestudiante ANÁLISIS  21   3.ANÁLISIS Enestecapítulosepodráverelcomportamientodelaaplicaciónasícomolos requisitosfuncionales,quesonlosprocesosquesepuedenrealizar,comocrearun nuevousuarioomodificarunejercicio,ylosrequisitosnofuncionales,quesonlas condicionesquedebecumplirelproyecto,comoquesecumplanlosestándares,quela aplicaciónseasegurayquenocontengaerrores.  3.1Requisitosfuncionales Losrequisitosfuncionalesquedebecumplirelproyectosonlossiguientes: • Eficienciayfacilidaddeuso:Laaplicacióndebeserintuitivayquela navegaciónseaclarahaciendoqueelusuariosesientacómodoaltrabajarcon ella. • Controldeacceso:Esmuyimportantemantenerunbuenniveldeseguridad pararestringirelaccesoacuentasajenas,porlotantoesnecesarioun protocolodeseguridadbasadaenusuarioycontraseña. • Gestióndecontenidos:Modificacióneintroduccióndenuevomaterialpara losalumnos,asícomocorreccionesdelosejerciciosrealizados. • Gestióndeusuarios:Elalumnopodráañadirlarespuestaatodaslas actividadespropuestasparalaasignatura.  3.2Requisitosnofuncionales Losrequisitosnofuncionalesquedebecumplirelproyectosonlossiguientes: • Seguridad:Elproyectotienequegarantizarciertaprivacidadparalosdatos deidentificacióndelosusuarios,porlotantolabasededatosestaráprotegida porcontraseñaytodoslospasswordsintroducidosporlosalumnossecifrarán utilizandoelalgoritmoSHA‐1. • Controldeerrores:todoslosposibleserroresquecomentanlosusuarios estaráncontempladosycontrolados. • Cumplimientodeestándares:Elproyectodeberáajustarsealmáximoalos estándaresparaevitarmalasvisualizacionesenlosdiferentesnavegadoresen quepuedaserusado.  Webparalagestiónelectrónicadeunacarpetadeestudiante ANÁLISIS  22   3.3Diagramasdecasosdeuso Losdiagramasdecasodeusomuestranlasdiferentesaccionesquepuederealizar cadausuarioseaprofesoroalumno. 3.3.1Alumno   Figura3:Diagramadecasosdeusodelalumno  Webparalagestiónelectrónicadeunacarpetadeestudiante ANÁLISIS  23   3.3.2Profesor     Figura4:Diagramadecasosdeusodelprofesor  Webparalagestiónelectrónicadeunacarpetadeestudiante ANÁLISIS  24   3.4Descripcióndeloscasosdeuso Enestepuntoseverándeformamásdetalladacadaunodeloscasosdeusoquese muestranenelpuntoanterior.  3.4.1Alumno  CASODEUSORegistrar DescripciónTodoslosalumnosmatriculadosalaasignaturadeberánregistrarsepara poderrealizartodaslasactividadesrelacionadasconlaasignatura.Para ellodeberánaccederalapáginaderegistrohaciendoclicenelbotón RegistrardelapáginadeLogin. ActoresAlumno FlujoPrincipalElnavegadormostraráunpequeñoformulariodondeelusuariodeberá introducirsuNIU,unacontraseñaysuconfirmación.Alpulsarelbotón Registrarseguardaránlosdatosconlosqueelnuevousuariopodrá accederalasactividadesdelaasignatura. Flujos Alternativos Datosincorrectos: Sihayalgúndatomalintroducidosemuestraunmensajede errorindicandoelcampoincorrectamenterellenado.  Usuarioyaexiste: SielusuariointroduceelNIUdeotroalumnoqueyaexisteenla basededatossemuestraelmensajedeerrorynosecompleta elregistro.  CASODEUSOLogin DescripciónLosusuariosqueyasehayanregistradopuedenloguearseparaasí accederalasdiferentesactividadesdelaasignatura.Paraellohande introducirsuNIUycontraseñaenelmenúqueapareceenlapáginade LoginypulsarelbotónEnviar. ActoresAlumno FlujoPrincipalDespuésdeintroducirlosdatosenelformularioypulsarelbotónEnviar enelnavegadorsemostrarálapáginaprincipaldelalumnodesdelacual sepodráaccederatodoslosapartadosdisponibles. Flujos Alternativos Datosincorrectos: Sialgunodelosdatosnocoincideconlosdelabasededatos,el navegadormostraráunmensajedeerrorindicandoalusuario quesehaequivocadointroduciendopartedelainformación.   Webparalagestiónelectrónicadeunacarpetadeestudiante ANÁLISIS  25   CASODEUSODiario DescripciónLosusuariospodránverloscomentariosquehanidointroduciendoen díasanteriores,ademásdepoderinsertarunnuevocomentarioconla fechaactual. ActoresAlumno PrecondiciónIdentificarse FlujoPrincipalElusuariopulsasobreelbotónDiarioenelmenúdeactividades.Aparece enelcuadroprincipaldelapáginaelcontenidodelapestañaVisualizar. Sub f lujosPestañavisualizar Semostraráuncalendariodondeelusuariopodráverlas diferentesanotacionesquehaidoañadiendoalolargodelcurso, paraellotendráquepulsarsobreeldíaquedeseaveryque tendrádiferentecolordependiendodesicontieneuncomentario ono.  PestañanuevaEntrada Enelnavegadorsemostraráuneditordetextoconelqueel usuariopodráintroducirunnuevocomentarioquetraspulsarel botónGuardarseañadiráalabasededatosconlafechaactual delservidor.  CASODEUSOTeoría DescripciónLosusuariospodránseleccionarentrelostemasdisponibleselejercicio quedeseasolucionardelospropuestosenelapartadodeteoría. ActoresAlumno PrecondiciónIdentificarse FlujoPrincipalElusuariopulsarásobreelbotónPreparacióndeTeoríaenelmenúde actividades.Apareceráenelcuadroprincipaldelapáginaelcontenidode lapestañaVisualizar.Semostraráenelcuadrodeactividadesdos selectoresparaelegireltemayelejercicioavisualizar. Sub f lujosPestañavisualizar: Elnavegadormostraráelenunciadodelejercicioseleccionadoy larespuestaqueelusuariohaañadido.  Pestañaeditar: Elnavegadormostraráuneditordetextoconelqueelusuario podráescribirlarespuestaalejercicioseleccionado.Paraguardar loscambiosenlabasededatossedeberápulsarelbotón Guardar.    Webparalagestiónelectrónicadeunacarpetadeestudiante ANÁLISIS  32   CASODEUSOModificarPrácticas DescripciónElprofesorpodráañadir,modificaroeliminarejerciciosrelacionados conelapartadodeprácticasdelaasignatura. ActoresProfesor PrecondiciónIdentificarse FlujoPrincipalElprofesorpulsarásobreelbotónModificarContenidoparaqueseabra elsubmenúdondeseencuentraelbotónPrácticas,alpulsaresebotón seabriráenelcuadrodeactividadesdosselectoresparapoderescoger eltemayelejercicioavisualizardelosquesehayanintroducido anteriormente. Sub f lujosPestañavisualizar: Elnavegadormostraráelenunciadodelejercicioseleccionado enlosselectoresdelcuadrodeactividades.  Pestañaeditar: Elnavegadormostraráuneditordetextoconelquesepodrá escribirelenunciadodelejercicioomodificarelya seleccionado.Tambiénhabrádospequeñasáreasdetexto dondesepondráelnúmerodetemayejercicio,ademásdeun botónqueharáqueelejercicioseavisibleonoparalos alumnos.  PestañaEliminar: Elnavegadormostraráunatablacontodoslosejercicios introducidosseparadosportema,pudiendoseleccionarcada unodeellosparasereliminadodelabasededatostraspulsar elbotónEliminar. Flujos Alternativos Númerodeejercicioyaexiste: Siseintroduceunnúmerodeejercicioqueyaexisteparaese tema,semostraráporpantallaunerrorindicandoqueel númerodeejercicioestáequivocado.  Noseponenúmerodeejercicio/tema: Sinosemodificaelnúmerodeejerciciooelnúmerodetema, semostraráporpantallaunerrorindicandoelproblema.   Webparalagestiónelectrónicadeunacarpetadeestudiante ANÁLISIS  33   CASODEUSOModificarTrabajo DescripciónElprofesorpodráañadirlainformaciónnecesariaparaqueelalumno realiceeltrabajosobrelaasignatura. ActoresProfesor PrecondiciónIdentificarse FlujoPrincipalElprofesorpulsarásobreelbotónModificarContenidoparaqueseabra unsubmenúdondeseencuentraelbotónTrabajo.Enelcuadro principaldelapáginaaparecerálapestañaVisualizar. Sub f lujosPestañavisualizar: Elnavegadormostrarálainformaciónyaintroducida anteriormenteenesteapartado.  Pestañaeditarinformación: Elnavegadormostraráuneditordetextoconelqueelprofesor podráescribirlainformaciónamostrar.Paraguardarlos cambiosenlabasededatossedeberápulsarelbotónGuardar.  CASODEUSOPonerNotas DescripciónElprofesorpodráponerunanotaencadaunodelosapartadosdela asignaturaacadaunodelosalumnos.Tambiénpodráañadir informaciónacercadelaformadeevaluacióndelaasignatura. ActoresProfesor PrecondiciónIdentificarse Flujo Principal ElprofesorpulsarásobreelbotónNotasenelmenúdeactividadesyel navegadormostraráunalistacontodoslosalumnosregistradosenla aplicación,aloscualesespodrápuntuarsegúnsutrabajorealizadoen laasignatura. SubflujosPestañavisualizar: Semostraráunalistacontodoslosalumnosregistradosylos diferentesapartadosenquesedividelaasignaturaparaque seanpuntuados.Loscambiosseguardaránenlabasededatos despuésdepulsarelbotónGuardar.  PestañaInformación: Semostraráenelnavegadorlainformaciónreferentealcriterio deevaluaciónseguidoenlaasignatura.  PestañaEditarInformación: Semostraráuneditordetextosconelquesepodráinsertaro modificarlainformaciónquehacereferenciaalaevaluación. Loscambiosseguardaránenlabasededatoscuandosepulse elbotónGuardarInformación.   Webparalagestiónelectrónicadeunacarpetadeestudiante ANÁLISIS  34   CASODEUSOSubirarchivo DescripciónElprofesorpodrásubirunafotografíaasucuentadeusuariopara posteriormentepoderlaañadirenalgunodelosenunciadosqueinserte. ActoresProfesor PrecondiciónIdentificarse FlujoPrincipalTraspulsareliconoSubirarchivoelprofesoraccederáaunapágina dondepodrábuscarlafotografíaquedeseasubiralservidor,paraque seañadaasucuentadebepulsarelbotónSubirArchivoy posteriormenteseveráelarchivosubidoenlatablainferior. Sub f lujosEliminararchivo: Elprofesorpodráeliminarunarchivoseleccionándoloenla tablaypulsandoelbotónEliminarArchivo.  Renombrar: Elprofesorpodrárenombrarunarchivo,paraellotendráque seleccionarloenlatablayescribirencuadrodetextoinferiorel nombrenuevodelarchivoysuextensión,acontinuación deberápulsarelbotónRenombrarparaqueelarchivocambie denombre.  Webparalagestiónelectrónicadeunacarpetadeestudiante HERRAMIENTASUTILIZADAS  35   4.HERRAMIENTASUTILIZADAS Enesteapartadosecomentaránlasdiferentesherramientasutilizadasparael desarrollodelproyecto,ademásdeloslenguajesdeprogramaciónusadosparasu realización. 4.1Struts2 ParaeldesarrolloprincipaldelproyectosehaoptadoporStruts2(Struts2inaction) queesunframeworkdeJavadedicadoaldesarrolloweb.Struts2estábasadoenel patrónMVC(Modelo‐Vista‐Controlador)quedividelaaplicaciónentrescapas claramentediferenciadas: • Elmodelo:Eselencargadodeprocesarlasaccionessolicitadasporel controlador.Esdecir,dentrodelmodeloseencuentranlasclasesencargadas derealizarlasoperacionesnecesarias. • Lavista:Eslaparteencargadadegenerarlainterfazconlaquelaaplicación interaccionaconelusuario,esdecir,sonelconjuntodepáginasJSPquepuede verelusuariodesdesunavegador. • ElControlador:Eselencargadodecomunicarlavistayelmodelo respondiendoaloseventosgeneradosporelusuarioenlavista,haciendoque seproduzcanloscambiosenelmodeloydevolviendolosresultadosdenuevoa lavista.  4.2JavaScript PeseaqueelproyectogiraalrededordeStruts2nohayqueolvidarquesepueden utilizarotrastecnologíasqueenriquezcanelcontenidowebymejorenlaexperiencia delusuario.ConestaideaseutilizaráJavaScript(LabibliadeJavaScript),queesun lenguajeinterpretado,quenonecesitacompilación,yqueesampliamenteutilizadoen aplicacionesweb. Dentrodelproyectosehautilizadoparaintegrareleditordetextosasícomopara mejorarlapresentacióndandodiferentesefectosenlosmenús.  Webparalagestiónelectrónicadeunacarpetadeestudiante HERRAMIENTASUTILIZADAS  36   4.2.1JSMath Parapoderintroducirlasfórmulasmatemáticasnecesariasparalaasignatura,seha decididoutilizarJSMathqueesunaimplementacióndeTexenJavaScript.JSMathtiene laparticularidaddequeescapazdegenerarlasfórmulasusandodirectamente tipografíaTexoconsuspropiasfuentesnativas,envezdeusarimágenescomoes típicoenHTML.LasiguienteimagenmuestraunejemploconJSMath:   Figura5:EjemplodeJSMath   4.2.2Prototype PrototypeesunframeworkescritoenJavaScriptyqueseutilizaparaimplementar aplicacionesAJAX. Enelproyectoúnicamentesehautilizadolafunción$F()paratraspasarlainformación entreeleditordetextosylaspestañasdevisualización.  4.2.3Tiny_MCE Parahacermáscómodalaentradadeinformaciónenlaaplicaciónsehaoptadopor utilizaruneditordetextosWYSIWYG.Tiny_MCE,queestáescritoenJavaScript, cumpleeserequisitoyaqueconviertelostextareasdelaaplicaciónenesetipode editor.ElaspectoquepresentaessimilaralabarradeherramientasdeMicrosoft Wordypermitedarformatoaltextoviendodirectamenteelresultadofinal.  4.3CSS EllenguajeutilizadoparadefinirlapresentacióndelaaplicacióneselCSS(Manual avanzadodeCSS).Apartirdeunúnicoarchivopermitedefinirlaformaylaposición queocuparácadaunodeloselementosmostradosenlapáginafacilitando modificacionesenelapartadovisualdelaaplicacióndeformarápidaysencilla.  Webparalagestiónelectrónicadeunacarpetadeestudiante HERRAMIENTASUTILIZADAS  37   4.4Jasypt Comosehacomentadoencapítulosanteriores,laseguridadesuntemaimportanteen estetipodeaplicaciones,poresemotivosehadecididocifrarlascontraseñas introducidasporlosalumnosenlabasededatos.Jasypt (http://www.jasypt.org/getting‐started‐easy.html)esunalibreríajavaquesirvepara esepropósito. EnelproyectosehadecididoutilizarparaelcifradoelalgoritmoSHA‐1queofreceun buenniveldeseguridad.  4.5MySQL MySQL(http://www.mysql.com/)esungestordebasededatosrelacionalquecomoel restodeopcionesparaesteproyectoesdecódigoabierto.Sehaescogidoestegestor porqueesademásrápido,fiableyrobustoademásdequetrabajabientantocon grandescomoconpequeñosvolúmenesdedatos.MySQLesunaopciónampliamente usadaenaplicacioneswebypuedeserusadoendiferentesplataformas.  4.5.1MySQLAdministrator Esunsoftwaremultiplataformaylibrequepermiteadministrarunabasededatos MySQLdeformavisual.  4.6Hibernate Esunmotordepersistenciadecódigoabiertoquefacilitaelmapeodeatributosde unabasededatosrelacionalylosobjetosdeunaaplicaciónutilizandoarchivosXML paraestablecerlasrelaciones,enotraspalabras,seutilizaparahacerpersistentelos objetosdeunprogramaenunabasededatosrelacional. SehaoptadoporestaopciónparaevitarelusodeJDBCyaqueesmáscomplejoy dependientedelaestructuradelosdatos,demaneraqueutilizandoHibernate (http://www.hibernate.org)seutilizaunaformadetrabajarmásnaturalysencilla utilizandodirectamenteobjetos.   Webparalagestiónelectrónicadeunacarpetadeestudiante HERRAMIENTASUTILIZADAS  38   4.7Tomcat Tomcat(http://tomcat.apache.org/)esunservidorwebconsoporteparaJSPy Servlets.Esteservidoreslibre,gratuitoymultiplataformayseráelencargadode interpretarelcódigodelaaplicaciónparaserentregadoalnavegadordelusuario. EnelproyectotendrálafuncióndecontenedordepáginasJSPconsusrespectivosCSS, tambiénseencargarádesostenerelsistemaStruts2,gestionarlaseguridadmediante elprotocoloSSLeinteractuarconlabasededatos.  4.8Eclipse Eselentornodedesarrolloelegidoparaimplementarelproyecto,aligualqueelresto deherramientasutilizadasesdecódigoabiertoymultiplataforma.DesdeEclipsese puedeprogramarenmúltipleslenguajesentrelosqueseencuentranJSP,JavaScript, JavayXML.  4.9OpenSSL Esunaherramientaquesirveparacrearcertificadosparausarlosconaplicaciones web.Esoscertificadosaseguranquelascredencialesdelaaplicaciónnoson fraudulentas. Webparalagestiónelectrónicadeunacarpetadeestudiante DISEÑODELAAPLICACIÓN  39   5.DISEÑODELAAPLICACIÓN Enestecapítuloseverádetalladamentetantolabasededatosusadaparaelproyecto,así comolainterfazgraficaquepresentalaaplicacióntantoenelapartadodeadministradorcomo eneldeusuario. 5.1Basededatos Labasededatosesunadelaspartesmásimportantesdelproyectoporquesobreella semantienetodoelpesodelaaplicación,yaquetantoprofesorescomoalumnos tendránqueaccederpararecuperaroinsertarinformación,yunfallopodría desestabilizartodalaaplicación. 5.1.1Diagrama  Figura6:Diagramadelabasededatos Webparalagestiónelectrónicadeunacarpetadeestudiante DISEÑODELAAPLICACIÓN  40   5.1.2Estructura Enesteapartadosemostraránconmásdetallelasdiferentestablasqueformanparte delabasededatos.  Tablaidentificación:Estatablacontienetodalainformaciónnecesariapara identificarsecomoprofesorocomoalumno. CampoTipoDescripción UserVarcharClaveprimaria.Eselcampoquecontieneelnombrede usuariodelacuentatantodeprofesorcomodealumnos. ParalosalumnosseusaráelNIU PassVarcharContraseñadelascuentasdeprofesoryalumnos TipoBooleanoIndicaeltipodeusuariodelacuenta,1siesprofesory0sies alumno.  Tabladiario:Contienelasentradasquehanintroducidolosalumnoseneldiario. CampoTipoDescripción IdInt Claveprimaria.Campoqueidentificacadaunadelas entradas. AlumnoVarcharGuardaelusuarioalquepertenecelaentrada ContenidoLongtextContieneelcomentariointroducidoporelalumno. FechaVarcharEstecampocontienelafechaenqueseañadióel comentario.  Tablarespuesta_teoria:Estatablacontienelarespuestadecadaalumnoalos ejerciciospropuestosenelapartadodeteoría. CampoTipoDescripción IdIntClaveprimaria.Campoqueidentificacadaunadelas entradasdelatabla. Ref_PreguntaIntEstecampoindicaelidentificadorquetienelapreguntaala quepertenecelarespuesta. AlumnoVarcharGuardaelusuarioalquepertenecelaentrada. RespuestaLongtextEstecampocontienelarespuestaquehapropuestoel alumnoparaelejercicio. ModificaciónVarcharEstecampocontienelafechadelaúltimamodificacióndel alumnoaesteejercicio.  Webparalagestiónelectrónicadeunacarpetadeestudiante DISEÑODELAAPLICACIÓN  41   Tablarespuesta_practicas:Estatablacontienelarespuestadecadaalumnoalas tareaspropuestasenelapartadodeprácticas. CampoTipoDescripción IdIntClaveprimaria.Campoqueidentificacadaunadelas entradasdelatabla. Ref_PreguntaIntEstecampoindicaelidentificadorquetienelapreguntaala quepertenecelarespuesta. AlumnoVarcharGuardaelusuarioalquepertenecelaentrada. RespuestaLongtextEstecampocontienelarespuestaquehapropuestoel alumnoparaelejercicio. ModificaciónVarcharEstecampocontienelafechadelaúltimamodificacióndel alumnoaesteejercicio.  Tablarespuesta_problemas:Estatablacontienelarespuestaalosejercicios propuestosenelapartadodeproblemasdelaasignatura. CampoTipoDescripción IdIntClaveprimaria.Campoqueidentificacadaunadelas entradasdelatabla. Ref_PreguntaIntEstecampoindicaelidentificadorquetienelapreguntaala quepertenecelarespuesta. AlumnoVarcharGuardaelusuarioalquepertenecelaentrada. RespuestaLongtextEstecampocontienelarespuestaquehapropuestoel alumnoparaelejercicio. ModificaciónVarcharEstecampocontienelafechadelaúltimamodificacióndel alumnoaesteejercicio.  Tablarespuesta_trabajo:Contieneeltrabajosobrelaasignaturaquehahecho cadaalumnoademásdelavaloracióndesuscompañeros. CampoTipoDescripción IdIntClaveprimaria.Campoqueidentificacadaunadelas entradasdelatabla. AlumnoVarcharGuardaelusuarioqueharealizadolaentrada. ValoraciónLongtextContienelavaloraciónquehahechoelalumnodesus compañerosdetrabajo. RespuestaLongtextEstecampocontieneeltrabajorealizadoporelalumno. ModificaciónVarcharEstecampocontienelafechadelaúltimamodificaciónde estaentrada.  Webparalagestiónelectrónicadeunacarpetadeestudiante DISEÑODELAAPLICACIÓN  48    Figura14:PestañasdelapartadodeTeoría   Figura15:PestañasdelapartadodeTrabajo  5.2.2.1Diario CuandoelalumnoseleccionaenelmenúdeactividadeslaopciónDiario,semuestra enelpanelcentralunatablaconlosdíasdelmesseleccionadoenelselectorsuperiory elañoindicadoenlazonainferior.  Figura16:Apartadodeldiario Webparalagestiónelectrónicadeunacarpetadeestudiante DISEÑODELAAPLICACIÓN  49   Losdíasdeldiariopresentarándiferentecolordefondoenfuncióndesisehaañadido uncomentarioonoenesedía.     Figura17:Detalledelosdíaseneldiario  Sisepulsasobreunodelosdías,sedesplegaráunapantalladondesepodráverel comentariointroducido. Finalmente,paraañadiromodificaruncomentarioconlafechaactual,desdela pestañaNuevaEntradaseaccederáaleditordetextodesdeelquesepodráintroducir lainformación.  Figura18:Comentarioenundíadeldiario DíasincomentarioDíaconcomentario Webparalagestiónelectrónicadeunacarpetadeestudiante DISEÑODELAAPLICACIÓN  50   5.2.2.2Notas Estesub‐apartadomostraráunatablaconlasnotasdelalumnoencadaunadelas actividadesdelcurso.   Figura19:Puntuacióndelalumno   5.2.3Profesor Lapáginadelprofesorcuentaconelmismoapartadovisualquelaseccióndelalumno. Enestecasoelmenúprincipalcontieneotrasopciones,comosepuedeverenla siguienteimagen:   Figura20:Menúdeactividades  Webparalagestiónelectrónicadeunacarpetadeestudiante DISEÑODELAAPLICACIÓN  51   Estemenúcontienediferentesnivelesqueseabrendependiendodelaopción escogida.AlpulsarsobreelbotónModificarContenidosedespliegaunsubmenúcon losdiferentesapartadosqueelprofesorpuedemodificar.  Figura21:Menúdeactividadesdesplegado. Igualqueenlaseccióndelalumno,losbotonesdeTeoría,ProblemasyPrácticas desplegaránunosselectoresquepermitiránescogeruntemayunejerciciodelosque yasehayanguardadoanteriormenteenlabasededatosconelfindemodificarlos.  Figura22:Menúprofesorconsecciónabierta Webparalagestiónelectrónicadeunacarpetadeestudiante DISEÑODELAAPLICACIÓN  52   5.2.3.1Listadealumnos Desdeesteapartadoelprofesorpodráseleccionarlacuentadelalumnoquequiere ver.   Figura23:Listadealumnosregistrados   5.2.3.2Notas Desdeesteapartadoelprofesorpodráintroducirlasnotasdelosalumnosregistrados enlaaplicación.Tambiéndesdeestasección,enlapestañaEditarInformación,podrá añadirlainformaciónreferentealmétododeevaluaciónseguido.   Figura24:Apartadodeintroduccióndenotas  Webparalagestiónelectrónicadeunacarpetadeestudiante DISEÑODELAAPLICACIÓN  53   5.2.3.3Introduccióndeejercicios TantoenlaseccióndeTeoría,comoenladeProblemasyPrácticasdelapáginadel profesorsepodráverlapestañaVisualizar,quemostraráelejercicioseleccionado,la pestañaEditar,dondeademásdeleditordetextosseencontrarándosáreasdetexto parainsertarelnúmerodetemaydeejercicioademásdepoderseleccionarsiel ejercicioesvisibleparaelalumno.   Figura25:Insertarnúmerodetemayejercicio  Latercerapestañaquemostraránestosapartadosesladeeliminar,dondeseverán unalistaconlosejerciciosintroducidosenlabasededatosparaelapartado seleccionado,yquepodránsereliminadosdesdeahí.   Figura26:Pestañadeeliminar  Webparalagestiónelectrónicadeunacarpetadeestudiante DISEÑODELAAPLICACIÓN  54   5.2.4Subirarchivos Aesteapartadosepodráaccederdesdeeliconosuperiordelapáginaymostraráuna listaconlosarchivossubidosporelusuarioasícomolaopcióndeeliminaro renombrarcadaunodeesosarchivos.   Figura27:Páginadesubirarchivos  5.2.5Editordetextos Comosehacomentadoenpuntosanteriores,endiferentesapartadossepodrá introducirtexto,yparafacilitarlatareapodráencontrarseenlasdiferentespestañas deEditaruneditordetextocomoeldelasiguientefigura:  Figura28:Editordetextos Webparalagestiónelectrónicadeunacarpetadeestudiante DISEÑODELAAPLICACIÓN  55   5.2.6Botonera Enlazonasuperiordelapáginasepodráencontrarunconjuntodeiconosmediante loscualeselusuariopodrásalirdelaaplicación(icono1),volveralapáginainicialde sucuenta(icono2),obtenerayudasobreelapartadoenelqueseencuentra(icono3), accederalapáginadesubirarchivos(icono4),yporúltimo,enestazona,estáelicono paravolveralapáginadelprofesor(icono5),quesoloserávisiblecuandoelprofesor accedaalacuentadeunalumnodesdelaseccióndedicadaaellodelacuentade administrador.     Figura29:Botonerasuperior Icono1Icono2Icono3Icono4Icono5 Webparalagestiónelectrónicadeunacarpetadeestudiante IMPLEMENTACIÓN  56   6.IMPLEMENTACIÓN Comosehacomentadoencapítulosanterioreselproyectoserealizaráutilizandoel FrameworkStruts2queutilizaelpatrónMVC.Porlotantoenesteapartadose mostrarácadaunadelaspartesqueformanestepatrónasícomoeltemadela persistenciaconHibernate.  6.1Capadelmodelo Estacapaeslapartedondeseprocesanlasaccionesysedevuelvenlosresultados. Tambiéneslaparteencargadadeaccederalabasededatos.Todoestoesta implementadoenclasesdeJava. Acontinuaciónsemostraráunadelasclasesutilizadasenelproyectodondese mostrarácómosehaceunalecturadelabasededatosutilizandoHibernateyse traspasaesainformaciónalacapadelavista. Sepuedeverenlalíneanúmerosietecomoseguardatodalainformaciónque contienelatabladelabasededatosrelacionadaconlaclaseModTrabajoenlalista modifTrabajo.Acontinuaciónenlaslíneasdiezyoncesepasalainformacióndela clasejavaalapáginajspdondeContenidoeselnombrequetieneeltextareadela capadelavista.  Figura30:Lecturadelabasededatos Webparalagestiónelectrónicadeunacarpetadeestudiante IMPLEMENTACIÓN  57   Paraguardarinformaciónenlabasededatostambiénserealizarádesdelaclasede Java,yaligualquelalectura,seutilizaráHibernateparapasarlainformaciónhastala basededatos. Enlalíneanúmerosieteyochosepuedevercomoserecogelainformación procedentedelacapadelavistayseguardaenunavariabledeltipodelaclase,en estecasoModTrabajo,acontinuacióndependiendodesiseinsertaporprimeravezla informaciónodesisehaceunaactualización,Hibernaterealizaunsaveenlalínea númerodiecisieteohaceunupdateenlalíneaoncerespectivamentedondeseguarda lainformaciónrecuperadadelapáginajspenlabasededatos.   Figura31:Escrituraenlabasededatos   Webparalagestiónelectrónicadeunacarpetadeestudiante PRUEBAS  64   Unavezcomprobadoquetodalapartedelprofesorfuncionacorrectamente,pasamos autilizarlaaplicacióncomoalumno,enprimerlugar,antesdepoderaccederala cuenta,deberemosregistrarnosyacontinuación,trasidentificarnos,seaccederáala páginaprincipaldondeyasepodrávertodalainformacióndelaasignatura introducidapreviamenteconlacuentadelprofesor.   Figura41:Páginadeinicioenlacuentadelalumno  Webparalagestiónelectrónicadeunacarpetadeestudiante PRUEBAS  65   Ahoraeselmomentoderesolveralgunodelosejerciciospropuestosporelprofesor, paraellosehaseleccionadoelapartadodeProblemas.Enlasiguientefigurasepuede verunapartedelejercicioresuelto.  Figura42:Resolucióndeunproblema Parafinalizar,dandounsaltoalfinaldelcurso,nuevamentedesdelacuentadel profesorintroducimoslapuntuacióndelalumnoparacorroborarquerealizabienesta últimaoperación.  Figura43:Páginadeinsertarnotas Webparalagestiónelectrónicadeunacarpetadeestudiante PRUEBAS  66   Desdelacuentadelalumnoaccedemosalapartadodenotasparacomprobarla puntuaciónfinaldelastareasrealizadas.  Figura44:Apartadodenotasdelalumno  Unavezfinalizadoestepaquetedepruebas,sepuedeconcluirconqueel funcionamientodelaaplicaciónescorrectoparacadaunadesussecciones. Webparalagestiónelectrónicadeunacarpetadeestudiante CONCLUSIONES  67   8.CONCLUSIONES Llegadoaestepuntodelamemoria,eselmomentodevalorarsiconlanueva aplicaciónquesehaimplementadosehaconseguidocubrirtodoslosobjetivosquese habíanplanteadoantesdecomenzarsuconstrucción. Conesteproyectosehaqueridodiseñarunasolucióntecnologíaparasatisfacerlas necesidadesdeunaasignaturaconcreta,perosiempreconlamentepuestaenla posibilidaddeexportarlaaplicaciónaotrasasignaturasconunametodologíade trabajosimilar.Losobjetivoseranconseguirunaaplicaciónfácildeusareintuitivapara favorecerlarápidaadaptacióndelosfuturosusuarios.Otrodelosgrandesobjetivos quesehabíanplanteadodesdeelprincipioerafavorecersuusoenmúltiples plataformasparaevitarlimitacionesenelusodeservidores,ademásdepermitirsu utilizaciónenlamayorcantidaddenavegadoresyresolucionesdepantallaposible paraquelosusuariospudieranseguirutilizandosusconfiguracionespreferidas. Teniendoencuentalosobjetivosperseguidosyelresultadoobtenidosepuede concluirconquesehanlogradoalcanzartodaslasmetaspropuestasaliniciareste proyecto. Desdeelpuntodevistapersonal,elproyectomehaaportadosobretododoscosas,la primeraesqueheaprendidoautilizartecnologíasquedesconocíatotalmentecomo Struts2,HibernateoJSPymehadadolaoportunidaddeprofundizarmásenlos conocimientospreviosqueteniasobreJavaScriptyCSS.Lasegundacosaquemeha aportadoesteproyectohasidolaexperienciadecrearunsitiowebcompletodesde cero,conlaposibilidaddecomprobarlasconsecuenciasdetomarunadecisiónuotra encadamomentodeldesarrollo. Webparalagestiónelectrónicadeunacarpetadeestudiante BIBLIOGRAFÍA  68   9.BIBLIOGRAFÍA  9.1Fuentesbibliográficas • DonaldBrown,ChadMichaelDavis,ScottStanlick.Struts2inaction,2008 Ed.Manning.  • FranciscoCharteOjeda.LabibliadeHTML,2005Ed.AnayaMultimedia.   • AndyBudd,CameronMoll,SimonCollison.ManualavanzadodeCSS,2007 Ed.AnayaMultimedia.  • LázaroIssiCamy.LabibliadeJavaScript,2002Ed.AnayaMultimedia.  9.2Fuenteselectrónicas • Struts2:http://struts.apache.org/2.0.14/  • Tiny_MCE:http://tinymce.moxiecode.com/  • Hibernate:http://www.hibernate.org  • jsMath:http://www.math.union.edu/~dpvc/jsMath/authors/2.x/basics.html  • Jasypt:http://www.jasypt.org/getting‐started‐easy.html  • Tomcat:http://tomcat.apache.org/  • Mysql:http://www.mysql.com/   Webparalagestiónelectrónicadeunacarpetadeestudiante BIBLIOGRAFÍA  69   9.3Bibliografíatecnológica  • FranciscoCharteOjeda,JorgeSerranoPérez.ProgramaciónconMicrosoft VisualStudio.NET,2002ed.AnayaMultimedia  • NicholasC.Zakas,JeremyMcPeak,JoeFawcett.ProfessionalAJAX2nd Edition,2007ed.WileyPublishing  • Comparativadetecnologías: http://www.promoteware.com/Module/Article/ArticleView.aspx?id=10 • http://es.wikipedia.org/wiki/.NET  • http://es.wikipedia.org/wiki/PHP  • http://es.wikipedia.org/wiki/J2EE  Webparalagestiónelectrónicadeunacarpetadeestudiante ANEXO  70   ANEXO Generarunacontraseñadeadministrador Esteanexopretendeserunaayudaparalacreacióndeunacuentadeadministrador, yaquelaúnicaformadepodercrearestetipodeusuarioesgenerandolaencriptación delpassworddeformaexternaalaaplicaciónyañadiéndolaposteriormentealabase dedatos. Elprocesoserealizarádesdeunalíneadecomandos.Despuésdeaccederaldirectorio dondesehadescomprimidoelarchivoadjunto(Jasypt)sedeberáiraldirectoriobiny seinsertarálasiguientelínea:   Acontinuaciónsemuestraunejemploparalacontraseña“123456”.  Figura45:Cifradodeunacontraseña  Unavezobtenidoelcifradodelacontraseñasedebeañadirunanuevaentradaala basededatosenlatablaidentificación,dondeenelcampoUserseañadiráelnúmero delusuario,enelcampoPassseañadiráestacontraseñayenelcampoTipose introduciráun1paraindicarqueesunprofesor. digest.batinput=”contraseña”saltSizeBytes=0iterations=1algorithm=SHA1       Elabajofirmante,DavidForteRomera,alumnodelaEscuelaUniversitaria deInformáticadelaUAB,  CERTIFICA: Queharealizadolapresentememoriayelproyecto“Webparalagestión electrónicadeunaCarpetadeAprendizaje”.  Yparaqueconstefirmalapresente. Sabadell,Septiembredel2009     ‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐‐ Firmado:DavidForteRomera    