Herramienta web para la gestión de informes automáticos

UNIVERSIDADE DE SANTIAGO DE
COMPOSTELA
ESCOLA T´
ECNICA SUPERIOR DE ENXE ˜
NAR´
IA
He amien a web pa a la ges i´on de
in o mes au om´a icos
Au o :
Daniel Mon e o Cas elao
Di ec o es:
Manuel Lama Pen´ın
Juan Ca los Vidal Aguia
Vic o Jos´e Gallego Fon enla
G ado en Ingenie ´ıa In o m´a ica
Feb e o 2019
T abajo de Fin de G ao p esen ado en la Escola T´ecnica Supe io de Enxe˜na ´ıa
de la Uni e sidade de San iago de Compos ela pa a la ob enci´on del G ado en
Ingenie ´ıa In o m´a ica.
D. Manuel Lama Pen´ın, P o eso del Depa amen o de Elec ´onica y Compu-
aci´on de la Uni e sidade de San iago de Compos ela, y D. Juan Ca los Vidal
Aguia , P o eso del Depa amen o de Elec ´onica y Compu aci´on de la Uni-
e sidade de San iago de Compos ela, y D. Vic o Jos´e Gallego Fon enla,
In es igado P edoc o al FPU del Minis e io de Ciencia, Inno aci´on y Uni e si-
dades.
INFORMAN:
Que la p esen e memo ia, i ulada He amien a web pa a la ges i´on de in o -
mes au om´a icos, p esen ada po D. Daniel Mon e o Cas elao pa a supe a
los c ´edi os co espondien es al T abajo de Fin de G ao de la i ulaci´on de G ao
en Enxe˜na ´ıa In o m´a ica, se ealiz´o bajo nues a di ecci´on en el Depa amen o
de Elec ´onica y Compu aci´on de la Uni e sidade de San iago de Compos ela.
Y pa a que as´ı cons e a los e ec os opo unos, expiden el p esen e in o me en
San iago de Compos ela, a 30 de ene o de 2019:
El di ec o , El codi ec o ,
Manuel Lama Pen´ın Juan Ca los Vidal Aguia
El codi ec o , El alumno,
Vic o Jos´e Gallego Fon enla Daniel Mon e o Cas elao
i
ii
´
Indice gene al
1. In oducci´on 1
1.1. Obje i os ............................... 2
1.2. Es uc u a del documen o . . . . . . . . . . . . . . . . . . . . . . 3
2. Ges i´on del p oyec o 5
2.1. Ges i´on del alcance . . . . . . . . . . . . . . . . . . . . . . . . . . 5
2.1.1. Desc ipci´on del alcance del p oduc o . . . . . . . . . . . . 5
2.1.2. C i e ios de acep aci´on del p oduc o . . . . . . . . . . . . 6
2.1.3. En egables del p oduc o . . . . . . . . . . . . . . . . . . . 7
2.1.4. Res icciones del p oyec o . . . . . . . . . . . . . . . . . . 7
2.2. Ges i´onde iesgos........................... 8
2.2.1. Ac i os ............................ 8
2.2.2. Amenazas........................... 9
2.2.3. Especi icaci´on de iesgos . . . . . . . . . . . . . . . . . . . 11
2.2.4. Iden i icaci´on de iesgos . . . . . . . . . . . . . . . . . . . 13
2.2.5. T a amien o de iesgos . . . . . . . . . . . . . . . . . . . . 15
2.3. Me odolog´ıa de desa ollo . . . . . . . . . . . . . . . . . . . . . . 18
2.4. Plani icaci´on.............................. 21
2.4.1. Es uc u a de descomposici´on del abajo (EDT) . . . . . 21
2.4.2. C onog ama (Plani icaci´on inicial) . . . . . . . . . . . . . . 24
2.4.3. C onog ama (Plani icaci´on eal) . . . . . . . . . . . . . . . 25
2.5. Ges i´on de la con igu aci´on . . . . . . . . . . . . . . . . . . . . . . 26
2.5.1. Elemen os de con igu aci´on . . . . . . . . . . . . . . . . . 27
2.5.2. Sis ema de ges i´on de la con igu aci´on . . . . . . . . . . . 27
2.5.3. Es uc u a del eposi o io . . . . . . . . . . . . . . . . . . 28
2.5.4. Ges i´on de cambios . . . . . . . . . . . . . . . . . . . . . . 28
2.6. Ges i´ondecos es ........................... 29
2.6.1. Cos es di ec os . . . . . . . . . . . . . . . . . . . . . . . . 29
2.6.2. Cos es indi ec os . . . . . . . . . . . . . . . . . . . . . . . 30
2.6.3. Cos es o ales . . . . . . . . . . . . . . . . . . . . . . . . . 31
2.7. Ges i´on de las comunicaciones . . . . . . . . . . . . . . . . . . . . 31
2.7.1. Plani icaci´on de las comunicaciones . . . . . . . . . . . . . 34
iii

3. An´alisis de equisi os 35
3.1. Ac o es del sis ema . . . . . . . . . . . . . . . . . . . . . . . . . . 35
3.1.1. In e eses del usua io . . . . . . . . . . . . . . . . . . . . . 36
3.1.2. Pe il de conocimien o del usua io . . . . . . . . . . . . . . 36
3.1.3. Fac o es de echazo del usua io . . . . . . . . . . . . . . . 37
3.2. Especi icaci´on de equisi os . . . . . . . . . . . . . . . . . . . . . . 37
3.2.1. Requisi os uncionales . . . . . . . . . . . . . . . . . . . . 38
3.2.2. Requisi os no uncionales . . . . . . . . . . . . . . . . . . . 44
3.2.3. Requisi os de in o maci´on . . . . . . . . . . . . . . . . . . 45
3.2.4. Casosdeuso ......................... 47
3.2.5. Ma ices de azabilidad . . . . . . . . . . . . . . . . . . . 53
4. An´alisis de ecnolog´ıas y he amien as 55
4.1. Se iciosweb ............................. 55
4.1.1. Je seyyJa a ......................... 56
4.1.2. Exp ess.js y Ja aSc ip . . . . . . . . . . . . . . . . . . . . 57
4.1.3. Rocke yRus ......................... 57
4.1.4. Conclusi´on........................... 57
4.2. Tecnolog´ıas web es ´anda . . . . . . . . . . . . . . . . . . . . . . . 58
4.2.1. HTML5 ............................ 58
4.2.2. CSS3.............................. 59
4.2.3. Ja aSc ip ........................... 59
4.2.4. JSON ............................. 60
4.3. F amewo ks y lib e ´ıas . . . . . . . . . . . . . . . . . . . . . . . . 60
4.3.1. TypeSc ip .......................... 60
4.3.2. Reac ............................. 61
4.3.3. An -Design .......................... 62
4.3.4. Recha s.js........................... 62
4.3.5. Ma e ial icons . . . . . . . . . . . . . . . . . . . . . . . . . 63
4.4. Base de da os documen al . . . . . . . . . . . . . . . . . . . . . . 63
4.4.1. MongoDB y Mongoose . . . . . . . . . . . . . . . . . . . . 64
4.5. He amien as ............................. 64
4.5.1. NPM.............................. 64
4.5.2. Docke ............................. 65
4.5.3. Phan omJS .......................... 65
4.5.4. Gi ............................... 66
4.5.5. WebS o m........................... 66
4.5.6. TeXS udio........................... 66
5. Dise˜no e implemen aci´on del sis ema 67
5.1. Dise˜no de la a qui ec u a del sis ema . . . . . . . . . . . . . . . . 67
5.1.1. Esquema de la a qui ec u a del sis ema . . . . . . . . . . . 67
5.1.2. A qui ec u a global . . . . . . . . . . . . . . . . . . . . . . 68
i
5.1.3. A qui ec u a del clien e web . . . . . . . . . . . . . . . . . 70
5.1.4. A qui ec u a del se ido . . . . . . . . . . . . . . . . . . . 72
5.2. Pa ones a qui ec ´onicos . . . . . . . . . . . . . . . . . . . . . . . 74
5.2.1. A qui ec u a o ien ada a se icios . . . . . . . . . . . . . . 74
5.2.2. Flux .............................. 74
5.3. Modelodeda os............................ 75
5.4. Dise˜nodeclases............................ 77
5.4.1. Diag amas de paque es . . . . . . . . . . . . . . . . . . . . 77
5.4.2. Dise˜no de clases del clien e web . . . . . . . . . . . . . . . 80
5.4.3. Dise˜no de clases del se ido . . . . . . . . . . . . . . . . . 93
5.5. Diag amas de in e acci´on . . . . . . . . . . . . . . . . . . . . . . . 95
5.5.1. Secuencia de llamadas pa a gua da una plan illa . . . . . 95
5.5.2. Secuencia de llamadas pa a ca ga una plan illa . . . . . . 96
5.5.3. Secuencia de llamadas pa a imp imi una plan illa a PDF . 98
5.6. Dise˜no de in e az de usua io . . . . . . . . . . . . . . . . . . . . . 100
6. Validaci´on y p uebas 103
6.1. P uebas uni a ias . . . . . . . . . . . . . . . . . . . . . . . . . . . 103
6.2. P uebas de in eg aci´on . . . . . . . . . . . . . . . . . . . . . . . . 108
6.3. Validaci´on de in e az de usua io . . . . . . . . . . . . . . . . . . 111
6.3.1. Heu ´ıs icos de Nielsen . . . . . . . . . . . . . . . . . . . . 112
6.3.2. Cues iona io SUS . . . . . . . . . . . . . . . . . . . . . . . 114
6.4. Ma iz de azabilidad . . . . . . . . . . . . . . . . . . . . . . . . 116
7. Conclusiones y ampliaciones 117
7.1. Conclusiones.............................. 117
7.2. Ampliaciones ............................. 119
A. Manuales ´ecnicos 121
A.1. Manual de despliegue . . . . . . . . . . . . . . . . . . . . . . . . . 121
A.2. Manual de con igu aci´on . . . . . . . . . . . . . . . . . . . . . . . 122
A.2.1. Cambia la URI de la capa de se icios . . . . . . . . . . . 122
A.2.2. Cambia la URI de la base de da os . . . . . . . . . . . . . 123
A.2.3. Ve siones u ilizadas en el desa ollo . . . . . . . . . . . . . 123
B. Manual de usua io 125
B.1. Vis a no mal de la aplicaci´on . . . . . . . . . . . . . . . . . . . . 125
B.2. C ea nue os componen es . . . . . . . . . . . . . . . . . . . . . . 126
B.3. Cambia las p opiedades de la plan illa . . . . . . . . . . . . . . . 127
B.4. P opiedades, ama˜no y posici´on de un componen e . . . . . . . . 128
B.4.1. P opiedades de componen es de ex o . . . . . . . . . . . . 129
B.4.2. P opiedades del componen e imagen . . . . . . . . . . . . 130
B.4.3. P opiedades del componen e lis a . . . . . . . . . . . . . . 131
B.4.4. P opiedades del componen e malla . . . . . . . . . . . . . 132
B.4.5. P opiedades del componen e abla . . . . . . . . . . . . . . 133
B.4.6. P opiedades del componen e g ´a ica ca esiana . . . . . . . 134
B.4.7. P opiedades del componen e g ´a ica pola . . . . . . . . . 135
B.4.8. P opiedades del compone e g ´a ica de dispe si´on . . . . . . 137
B.5. De inici´on de a iables . . . . . . . . . . . . . . . . . . . . . . . . 139
B.5.1. Secci´on de c eaci´on de a iables . . . . . . . . . . . . . . . 139
B.5.2. Tipos de a iables . . . . . . . . . . . . . . . . . . . . . . . 139
B.5.3. Mapeado de a iables . . . . . . . . . . . . . . . . . . . . 141
B.5.4. Ca gado de JSON . . . . . . . . . . . . . . . . . . . . . . 143
B.6. Uso de a iables y uen es de da os . . . . . . . . . . . . . . . . . 144
B.7. C eaci´on, gua dado y bo ado de plan illas . . . . . . . . . . . . . 145
B.8. Imp esi´on de plan illa . . . . . . . . . . . . . . . . . . . . . . . . . 145
C. Licencia 147
Bibliog a ´ıa 149
i
´
Indice de igu as
2.1. P ime ni el de la es uc u a de descomposici´on de abajo . . . . 21
2.2. Descomposici´on del paque e de abajo De inici´on del p oyec o . . 22
2.3. Descomposici´on del paque e de abajo Aplicaci´on web ...... 22
2.4. Descomposici´on del paque e de abajo Capa de se icios ..... 23
2.5. Descomposici´on del paque e de abajo En o no y base de da os . 23
2.6. C onog ama gene al del p oyec o . . . . . . . . . . . . . . . . . . 24
2.7. C onog ama del paque e de abajo De inici´on del p oyec o . . . . 25
2.8. C onog ama del paque e de abajo Aplicaci´on web ........ 25
2.9. C onog ama del paque e de abajo Capa de se icios ....... 25
2.10. C onog ama del paque e de abajo En o no y base de da os . . . 25
2.11. Plani icaci´on eal del p oyec o . . . . . . . . . . . . . . . . . . . . 26
2.12. Es uc u a del eposi o io . . . . . . . . . . . . . . . . . . . . . . 28
5.1. Esquema de la a qui ec u a del sis ema . . . . . . . . . . . . . . . 68
5.2. A qui ec u a de al o ni el del sis ema . . . . . . . . . . . . . . . . 69
5.3. A qui ec u a de la aplicaci´on web . . . . . . . . . . . . . . . . . . 70
5.4. A qui ec u a del se ido . . . . . . . . . . . . . . . . . . . . . . . 72
5.5. Diag ama de paque es del clien e web . . . . . . . . . . . . . . . . 78
5.6. Diag ama de paque es del se ido . . . . . . . . . . . . . . . . . 79
5.7. Diag ama de clases del n´ucleo de la aplicaci´on . . . . . . . . . . . 81
5.8. Diag ama de clases del paque e Componen sPanel ......... 83
5.9. Diag ama de clases del paque e CRUDPanel ............ 84
5.10. Diag ama de clases del paque e Layou Componen s (1) . . . . . . 85
5.11. Diag ama de clases del paque e Layou Componen s (2) . . . . . . 86
5.12. Diag ama de clases del paque e P opsPanels (1).......... 88
5.13. Diag ama de clases del paque e P opsPanels (2).......... 89
5.14. Diag ama de clases del paque e Va sSec ion ............ 91
5.15. Diag ama de clases del paque e Repo Layou ........... 93
5.16. Diag ama de clases del se ido . . . . . . . . . . . . . . . . . . . 94
5.17. Diag ama de in e acci´on pa a Gua da una plan illa ...... 96
5.18. Diag ama de in e acci´on pa a Ca ga una plan illa ....... 98
5.19. Diag ama de in e acci´on pa a Imp imi a PDF ......... 99
5.20. Ve si´on minimalis a de la in e az de la aplicaci´on . . . . . . . . . 100
5.21. Boce o de la disposici´on de los elemen os en la in e az comple a . 101
ii
4CAP´
ITULO 1. INTRODUCCI ´
ON
Cap´ı ulo 6:Validaci´on y p uebas, incluye las p uebas uni a ias, p uebas
de in eg aci´on, y alidaci´on de in e az de usua io.
Cap´ı ulo 7:Conclusiones, incluye las conclusiones ob enidas as la ea-
lizaci´on del abajo ealizado y las posibles ampliaciones del mismo.
Ap´endice A:Manual de despliegue, incluye el manual de despliegue de
la aplicaci´on jun o las opciones de con igu aci´on disponibles.
Ap´endice B:Manual de usua io, incluye el manual de usua io pa a la
u ilizaci´on de la aplicaci´on.
Ap´endice C:Licencia de uso, incluye la licencia de uso del so wa e y
de es e abajo.

Cap´ı ulo 2
Ges i´on del p oyec o
La pa e de ges i´on del p oyec o es una ase g adual que se ealiza du an e
odo el anscu so de un p oyec o cualquie a. En es a ase se de ine el c onog ama
de las ac i idades, la ges i´on de los iesgos, los cos es y las comunicaciones con
los di e en es in e esados en el p oyec o.
Pues o que es e TFG es un p oyec o in o m´a ico, ambi´en se ´a necesa io especi i-
ca la ges i´on de los dis in os elemen os del so wa e que se desa ollen du an e el
anscu so del p oyec o, es o incluye, el modo de gua da la di e en es e siones
que se gene an as´ı como el modo de documen a los cambios que se ealizan en
el c´odigo desa ollado.
2.1. Ges i´on del alcance
En es a secci´on se desc ibe el alcance del p oduc o, los c i e ios de acep aci´on
del p oduc o po pa e del clien e, los en egables del p oduc o jun o con sus
es icciones.
2.1.1. Desc ipci´on del alcance del p oduc o
El p oduc o en su conjun o cons a de es pa es:
Aplicaci´on web (Clien e)
Capa de se icios y base de da os (Se ido )
Documen aci´on de la aplicaci´on
La aplicaci´on web es una in e az de usua io ejecu ada sob e un na egado web
mode no cualquie a. Es a in e az pe mi e la c eaci´on de plan illas de in o mes,
el usua io pod ´a selecciona un ango de componen es pa a o ma la plan illa,
dichos componen es an desde p´a a os y ´ı ulos, has a im´agenes, lis as, ablas y
5
6CAP´
ITULO 2. GESTI ´
ON DEL PROYECTO
g ´a icas.
Adicionalmen e el usua io pod ´a modi ica las p opiedades de cada componen-
e de la plan illa, incluyendo (pe o no limi ´andose) el ama˜no del componen e,
uen e, desplazamien o, deco aci´on, e c.
La aplicaci´on web pe mi e ambi´en la de inici´on de a iables po pa e del usua-
io, una a iable puede se una cadena de ex o, ua echa o una uen e de da os
de un componen e (como una abla o una g ´a ica), el usua io de ini ´a la a iable
y asocia ´a la a iable a uno o m´as componen es de la plan illa que es ´e edi an-
do. El usua io pod ´a despu´es op a po ca ga una a chi o en o ma o JSON
pa a da le alo a las a iables y eemplaza las de o ma au om´a ica en la apli-
caci´on, gene ando de es e modo un in o me comple o en base a la plan illa que
ha especi icado, ob eniendo un PDF con las a iables eemplazadas en la plan illa.
La aplicaci´on pe mi i ´a ambi´en gene a m´ul iples in o mes dada la ca ga de
m´ul iples a chi os JSON pa a una misma plan illa, adicionalmen e pe mi i ´a
c ea , gua da , modi ica y bo a plan illas de in o mes, dicha uncionalidad
co esponde ´a al se ido que u iliza ´a una base de da os NoSQL pa a almacena
es os da os.
El p oduc o con end ´a documen aci´on, incluyendo es a los manuales de desplie-
gue y uso del so wa e.
2.1.2. C i e ios de acep aci´on del p oduc o
El p oduc o en egado al clien e se conside a ´a adecuado y acep ado cuando
cumpla las siguien es condiciones:
Pe mi e la c eaci´on de componen es de ex o (inclusi´on de p´a a os y ´ı ulos)
en las plan illas.
Pe mi e la inclusi´on de lis as y ablas en las plan illas.
Pe mi e la inclusi´on de im´agenes en las plan illas.
Pe mi e de ini el ama˜no y la disposici´on de cada elemen o que o me la
plan illa.
Pe mi e la inclusi´on de g ´a icas (ba as, ´a ea, l´ıneas, sec o es, ada y dis-
pe si´on en dos a iables) en la plan illa.
Pe mi e la inclusi´on de a iables en la plan illa.
Pe mi e la ca ga de uen es de da os en las g ´a icas, ablas y lis as de una
plan illa.
2.1. GESTI ´
ON DEL ALCANCE 7
Pe mi e modi ica cualquie componen e que o me pa e de una plan illa.
Pe mi e c ea , gua da , modi ica y bo a plan illas.
Pe mi e gene a in o mes en base a plan illas eemplazando las a iables
que es ´en si uadas en la plan illa dado un a chi o en o ma o JSON.
Pe mi e gene a m´ul iples in o mes en base a una plan illa dados m´ul iples
a chi os en o ma o JSON.
Los in o mes gene ados po la aplicaci´on se desca gan en o ma o PDF.
2.1.3. En egables del p oduc o
El p oduc o se compond ´a de un ´unico en egable inal con odas las uncio-
nalidades que el clien e haya especi icado pa a pasa sus c i e ios de acep aci´on,
es e en egable inclui ´a:
Aplicaci´on web (Clien e)
Capa de se icios y base de da os (Se ido )
Documen aci´on de la aplicaci´on
Sin emba go se libe a ´a e siones pa ciales du an e el anscu so del p oyec o que
se u iliza ´an pa a mos a al clien e el es ado de desa ollo de la aplicaci´on, es as
e siones pa ciales es ´an suje as a cambios an o po pa e del clien e como po
pa e del desa ollado seg´un se es ime con enien e pa a pasa los c i e ios de
acep aci´on del p oduc o. Se de ine un n´ume o m´ınimo de 3 e siones pa ciales al
clien e pa a in o ma le del es ado de desa ollo del p oduc o.
2.1.4. Res icciones del p oyec o
Las es icciones del p oyec o son las siguien es:
El p oyec o debe de ealiza se en un iempo ap oximado de 421 ho as.
La aplicaci´on debe de es a desa ollada con ecnolog´ıas web es ´anda (HTML5,
CSS y Ja aSc ip ) o cualquie amewo k o lib e ´ıa que se de i e de es as
ecnolog´ıas.
La base de da os u ilizada debe de se NoSQL
Debe de u iliza se una a qui ec u a o ien ada a se icios REST pa a im-
plemen a las uncionalidades del se ido .
La aplicaci´on debe de pode a a los a chi os de o ma o JSON.
8CAP´
ITULO 2. GESTI ´
ON DEL PROYECTO
2.2. Ges i´on de iesgos
En odo p oyec o de cie a conside aci´on es necesa io ealiza una ges i´on de
los dis in os iesgos que puedan apa ece y que po ello pueden a ec a de alguna
mane a al anscu so del p oyec o.
Los iesgos que a ec an a un p oyec o pueden a ia desde:
Riesgos espec´ı icos del p oyec o (Cambio de ecnolog´ıas, equisi os no
co ec amen e especi icados, dise˜nos inco ec os...)
Riesgos gen´e icos (Cambios de legislaci´on, desas es na u ales, bajas del
pe sonal, cancelaci´on del p oyec o...)
Cualquie iesgo que pueda a ec a al p oyec o debe de se iden i icado y en caso
de se iable su a amien o, ene alg´un plan pa a con ola el iesgo en caso de
que se p oduzca.
A con inuaci´on se de allan los iesgos m´as impo an es que pueden a ec a a
es e p oyec o.
2.2.1. Ac i os
An es de empeza a iden i ica iesgos inculados al p oyec o es necesa io
iden i ica aquellos ac i os que son impo an es pa a la ealizaci´on del p oyec o.
La abla que ep esen a un ac i o es ´a compues a po los siguien es campos:
ID: C´odigo iden i icado ´unico del ac i o
Nomb e: Nomb e del ac i o
Desc ipci´on: Desc ipci´on del ac i o
Los ac i os iden i icados son los siguien es:
ID AC-001
Nomb e Es aci´on de abajo
Desc ipci´on La es aci´on de abajo es c ucial pa a el desa ollo del
p oyec o an o pa a gene a la documen aci´on del p o-
yec o como pa a ealiza la implemen aci´on de la apli-
caci´on que se a a desa olla du an e el anscu so del
mismo, solo se cuen a con una ac ualmen e.
2.2. GESTI ´
ON DE RIESGOS 9
ID AC-002
Nomb e C´odigo de la aplicaci´on
Desc ipci´on El c´odigo de la aplicaci´on con end ´a absolu amen e oda
la implemen aci´on que se ha dise˜nado en es e p oyec o,
es o implica el c´odigo ejecu able que an o el clien e co-
mo el se ido ejecu a ´an en sus espec i as on e as de
desa ollo pa a lle a a cabo sus uncionalidades.
ID AC-003
Nomb e Base de da os
Desc ipci´on La base de da os con end ´a oda la in o maci´on de ope-
aciones de manipulaci´on de da os que la aplicaci´on
clien e solici e al se ido .
ID AC-004
Nomb e Reposi o io del p oyec o
Desc ipci´on El eposi o io con end ´a las sucesi as e siones del c´odi-
go y de la documen aci´on que se ayan gene ando du-
an e el anscu so del p oyec o.
2.2.2. Amenazas
Ya iden i icados los ac i os se p ocede a iden i ica las di e en es amenazas
que pueden p oduci se en el con ex o del p oyec o ac ual.
La abla que ep esen a una amenaza es ´a compues a po los siguien es cam-
pos:
ID: C´odigo iden i icado ´unico de la amenaza
Nomb e: Nomb e de la amenaza
Desc ipci´on: Desc ipci´on de la amenaza
Las amenazas iden i icadas son las siguien es:
ID AM-001
Nomb e Cambio de ecnolog´ıas de desa ollo
Desc ipci´on Las ecnolog´ıas que se u ilizan pa a desa olla la apli-
caci´on es ´an en cons an e e oluci´on, puede da se el caso
de que salgan nue as e siones de es as ecnolog´ıas y que
es ´as sean incompa ibles con las e siones an e io es

10 CAP´
ITULO 2. GESTI ´
ON DEL PROYECTO
ID AM-002
Nomb e Ac ualizaciones del sis ema ope a i o
Desc ipci´on Si se p oduce una ac ualizaci´on del sis ema ope a i o
puede da se el caso de que cie as ecnolog´ıas o p og a-
mas que se u ilizan pa a desa olla el p oyec o dejen de
unciona o uncionen pa cialmen e.
ID AM-003
Nomb e Fallo de ha dwa e
Desc ipci´on La documen aci´on o c´odigo gene ado pueden pe de se
comple amen e o pa cialmen e po un allo de ha dwa e
de la es aci´on de abajo, imposibili ando la opci´on de
ecupe aci´on.
ID AM-004
Nomb e Cambios de equisi os
Desc ipci´on Se pueden p oduci cambios de equisi os a lo la go del
anscu so del p oyec o.
ID AM-005
Nomb e Plani icaci´on op imis a
Desc ipci´on Cuando se plani ica el p oyec o se ealizan es imaciones
demasiado op imis as de modo que se iene la idea de
que las a eas se acaba ´an an es de lo p e is o cuando
en ealidad no a a se as´ı.
ID AM-006
Nomb e Plani icaci´on pesimis a
Desc ipci´on Cuando se plani ica el p oyec o se ealizan es imaciones
demasiado pesimis as, de modo que se iene la idea de
que las a eas acaba ´an mucho despu´es de lo p e is o
cuando en ealidad no a a se as´ı.
ID AM-007
Nomb e Fal a de implicaci´on po pa e de los in e esados del p o-
yec o
Desc ipci´on Los p incipales in e esados del p oyec o no se in oluc an
lo su icien e en su desa ollo, al ando eedback sob e el
es ado ac ual del mismo.
2.2. GESTI ´
ON DE RIESGOS 11
ID AM-008
Nomb e Uso de nue as ecnolog´ıas
Desc ipci´on El uso de nue as ecnolog´ıas puede p oduci e asos en
la plani icaci´on si no se cuen a con su icien e o maci´on
pa a u iliza las a la elocidad no mal.
ID AM-009
Nomb e Alcance del p oyec o sob edimensionado
Desc ipci´on El alcance del p oyec o es demasiado excesi o pa a el
iempo y p esupues os aco dados, po lo que no se puede
ealiza de o ma comple a
ID AM-010
Nomb e Dise˜no poco escalable
Desc ipci´on Un dise˜no poco escalable di icul a la posibilidad de am-
plia la aplicaci´on du an e el desa ollo de la misma,
p oduciendo e asos en la plani icaci´on
ID AM-011
Nomb e Mala usabilidad de la in e az
Desc ipci´on Desa olla una in e az con mala usabilidad puede p o-
oca el echazo absolu o de la aplicaci´on po pa e del
clien e o del usua io inal.
2.2.3. Especi icaci´on de iesgos
Una ez iden i icados los ac i os y las amenazas se p ocede a iden i ica los
iesgos del p oyec o, po lo an o se elacionan las amenazas con los ac i os y se le
da a cada elaci´on de es e ipo una escala de p obabilidad e impac o ex ayendo
de es e modo un iesgo pa a el p oyec o.
La abla que de ine un iesgo es ´a compues a po los siguien es campos:
ID: C´odigo iden i icado ´unico del iesgo
Amenazas in oluc adas: Lis a de amenazas in oluc adas en el iesgo (ID
de las amenazas)
Ac i os in oluc ados: Lis a de ac i os in oluc ados en el iesgo (ID de
los ac i os)
12 CAP´
ITULO 2. GESTI ´
ON DEL PROYECTO
P obabilidad: P obabilidad del iesgo (Cuan p obable es que suceda)
Impac o: Impac o del iesgo (Si se p oduce cuando da˜no puede llega a
ealiza )
Exposici´on: Fac o calculado en e la p obabilidad y el iesgo
A con inuaci´on se indican las dis in as escalas y opciones de a amien o de ies-
gos con empladas y u ilizadas en es e p oyec o.
Las escalas de p obabilidad que se han u ilizado pa a medi los iesgos son las
siguien es:
Al a: El iesgo iene una p obabilidad muy al a de que pueda llega a
mani es a se, la posibilidad de apa ici´on oscila en e el 81 % y el 100 %,
ambos inclusi e.
Media: El iesgo iene una p obabilidad media de que pueda llega a ma-
ni es a se, la posibilidad de apa ici´on oscila en e el 36 % y el 80 %, ambos
inclusi e.
Baja: El iesgo iene una p obabilidad baja de que pueda llega a mani-
es a se, la posibilidad de apa ici´on oscila en e el 0 % y el 35 %, ambos
inclusi e.
Las escalas de impac o u ilizadas pa a medi los iesgos son las siguien es:
Ca as ´o ico: El iesgo p oduce un g an impac o en el p oyec o, pudiendo
p oduci la cancelaci´on del mismo si llegase a p oduci se.
Al o: El iesgo p oduce un g an impac o en el p oyec o, pudiendo al e a
eno memen e su cu so o su plani icaci´on si llegase a p oduci se.
Medio: El iesgo p oduce un impac o medio en el p oyec o, pudiendo al e-
a pun ualmen e cie as acciones de anscu so del mismo.
Bajo: El iesgo p oduce un impac o bajo en el p oyec o, pudiendo al e a
le emen e algunas opciones del mismo.
Insigni ican e: El iesgo apenas p oduce impac o alguno en el p oyec o,
sus consecuencias pueden se igno adas.
Las posibles acciones que se pueden ealiza pa a a a un iesgo en es e p oyec o
son las siguien es:
Asumi : No se oma ninguna acci´on con espec o al iesgo, simplemen e
se asume que a a sucede y que end ´a consecuencias en el p oyec o.
2.2. GESTI ´
ON DE RIESGOS 13
P e enci´on: Se c ea un plan pa a educi la p obabilidad de que el iesgo
ocu a du an e el anscu so del p oyec o.
Minimizaci´on: Se c ea un plan pa a educi el impac o que el iesgo p o-
duce en caso de mani es a se.
Con ingencia: Se c ea un plan que se ejecu a una ez el iesgo se ha
mani es ado en el p oyec o, con el obje i o de educi los e ec os del iesgo
una ez se ha p oducido.
Pa a p io iza los iesgos seg´un la exposici´on que p oducen, se u iliza la siguien e
ma iz en la que se ep esen an las dis in as escalas de impac o en las ilas y las
escalas de p obabilidad en las columnas de la ma iz.
El alo de la exposici´on se calcula como el p oduc o del alo cuan i a i o asig-
nado a cada escala, indicado en e pa ´en esis en la ma iz.
Al a (1) Media (0.65) Baja (0.15)
Ca as ´o ico (1) 1 0.65 0.15
Al o (0.8) 0.8 0.52 0.12
Medio (0.5) 0.5 0.325 0.075
Bajo (0.3) 0.3 0.195 0.045
Insigni ican e (0.1) 0.1 0.065 0.015
Los iesgos que p esen en un alo de exposici´on m´as al o se ´an los que engan
la p io idad m´as al a pa a aplica les medidas de a amien o.
Se conside a on las siguien es escalas de exposici´on:
Al a: Valo mayo o igual que 0.65.
Media: Valo meno que 0.65 y mayo o igual que 0.15.
Baja: Valo meno que 0.15.
2.2.4. Iden i icaci´on de iesgos
A lo la go del p oyec o se han iden i icado los siguien es iesgos:
ID RIE-001
Amenazas in oluc adas AM-001
Ac i os in oluc ados AC-002, AC-003, AC-004
P obabilidad Al a
Impac o Al o
Exposici´on Al a
20 CAP´
ITULO 2. GESTI ´
ON DEL PROYECTO
decan a emos po p og amaci´on ex ema, el mo i o de es a elecci´on es que
sc um delimi a mucho el ma gen de maniob a en las i e aciones con los sp in s,
en cambio p og amaci´on ex ema pe mi e m´as lexibilidad al u iliza i e acio-
nes co as o ien adas a p o o ipos.
Adicionalmen e, sc um equie e un g an n´ume o de euniones con los clien es, y
aunque es posible euni se con ellos no con iene sa u a su agenda con euniones
cons an es ya que ienen o os comp omisos que a ende .
Po ello se selecciona como me odolog´ıa de desa ollo p og amaci´on ex ema,
es a me odolog´ıa se o ien a a desa olla desde un en oque inc emen al u ilizan-
do i e aciones co as pa a libe a uncionalidades de o ma con inua al clien e o
usua io. Es o ´ul imo coincide con la necesidad de: 1) ense˜na al clien e la e olu-
ci´on del p oyec o, 2) los equisi os no es ´an bien especi icados en las ases iniciales
y 3) la plani icaci´on iende a cambia seg´un los equisi os cambian.
Adem´as, p og amaci´on ex ema es una me odolog´ıa o ien ada a p uebas y
cen ada en la e ac o izaci´on del c´odigo que se desa olle du an e el anscu so
del p oyec o, de modo que p ime o se p og aman las p uebas que deben de pa-
sa las uncionalidades y luego se p og ama el c´odigo pa a que pase las p uebas
p og amadas sin impo a cuan as eces se enga que eesc ibi , mejo a o e olu-
ciona dicho c´odigo. De modo que se sa is acen las necesidades de: 1) se u ilizan
ecnolog´ıas nue as y no se cuen a con expe iencia en su uso y 2) solo se cuen a
con un ecu so pa a desa olla odo el p oyec o.
Los inc emen os que se con emplan en es e p oyec o son los siguien es:
Inc emen o 1 (Aplicaci´on web): Cons i uye la ealizaci´on de la apli-
caci´on web de edici´on y c eaci´on de in o mes y plan illas de in o mes con
odas sus uncionalidades.
Inc emen o 2 (Capa de se icios): Cons a de la implemen aci´on de la
capa de se icios web que u iliza ´a el clien e pa a en ia y ecibi da os al
se ido , en conc e o almacenamien o y ob enci´on de plan illas e in o mes
c eados en la aplicaci´on web.
Inc emen o 3 (En o no y base de da os): C eaci´on de la base de
da os pa a almacena los da os ecibidos en la capa de se icios jun o con
la pues a en ma cha del en o no comple o con la aplicaci´on web y la capa
de se icios.

2.4. PLANIFICACI ´
ON 21
2.4. Plani icaci´on
En es a secci´on se especi ica la plani icaci´on de la du aci´on o al del p oyec o,
es a iene especi icada po la dis ibuci´on de las a eas que componen el desa ollo
comple o del p oyec o jun o con el n´ume o de ho as es imadas pa a su ealizaci´on.
La especi icaci´on de las a eas, o paque es de abajo, se de alla en la Es uc-
u a de descomposici´on de abajo mien as que la du aci´on de cada una de ellas
y su dis ibuci´on en el iempo se especi ica en el C onog ama.
2.4.1. Es uc u a de descomposici´on del abajo (EDT)
Pues o que el p oyec o incluye un amplio ango de a eas a ealiza es p eciso
descompone es as en paque es de abajo manejables y m´as peque˜nos que pe -
mi an es ima de o ma e ec i a su du aci´on y abajo eque ido pa a ealiza los,
adem´as es a descomposici´on de a eas se i ´a ambi´en pa a de ini de o ma es-
quem´a ica el abajo que se ealiza ´a du an e el anscu so del p oyec o.
En la igu a 2.1 se mues a el ni el m´as al o de la descomposici´on del aba-
jo a ealiza , el p oyec o en su conjun o es ´a o mado po 4 g andes paque es
de abajo: la de inici´on del p oyec o, la aplicaci´on web, la capa de se icios y el
en o no y la base de da os.
He amien a web pa a la ges i´on de in o mes au om´a icos
De inici´on del p oyec o Aplicaci´on web Capa de se icios Base de da os
Figu a 2.1: P ime ni el de la es uc u a de descomposici´on de abajo
El paque e de abajo de inici´on del p oyec o de inido en la igu a 2.2 se com-
pone de las a eas ela i as a la ges i´on del p oyec o, an´alisis de ecnolog´ıas y
an´alisis de equisi os, es o incluye la ges i´on de iesgos del p oyec o, la de inici´on
del alcance del p oyec o, el an´alisis de equisi os de la aplicaci´on y el an´alisis de
ecnolog´ıas que se u iliza ´an du an e la ase de desa ollo del p oyec o.
22 CAP´
ITULO 2. GESTI ´
ON DEL PROYECTO
De inici´on del p oyec o
Ges i´on de iesgos A. de equisi os De inici´on del alcance A. de ecnolog´ıas
Fo maci´on
Figu a 2.2: Descomposici´on del paque e de abajo De inici´on del p oyec o
El p ime inc emen o co esponde a la Aplicaci´on web y es ´a de inido en la
igu a 2.3.
Es e inc emen o es ´a compues o de las a eas ela i as a la ealizaci´on de la
in e az web que da ´a sopo e a la c eaci´on y ges i´on de in o mes au om´a icos,
se p e ´e que es ´e sea el paque e de abajo m´as complejo y po ello el que m´as
iempo necesi e pa a se comple ado.
Inc emen o 1: Aplicaci´on web
Dise˜no de a qui ec u a Dise˜no de in e az P uebas
P. uni a ias P. de in eg aci´on
Implemen aci´on
Figu a 2.3: Descomposici´on del paque e de abajo Aplicaci´on web
En es e inc emen o se engloban las a eas ela i as a la elabo aci´on del dise˜no
de la aplicaci´on, di idido en dos a eas, el dise˜no de la a qui ec u a del sis ema
que engloba el dise˜no in e no y m´as uncional de la aplicaci´on y el dise˜no de la
in e az que engloba el dise˜no isual que el usua io obse a pa a u iliza la apli-
caci´on.
Adem´as, se incluye en es e paque e la a ea de implemen aci´on del sis ema que
se ealiza ´a una ez se hayan comple ado los paque es de dise˜no, es e paque e
se co esponde con la implemen aci´on uncional de los equisi os y el enlace de
dichas uncionalidades con la in e az de usua io.
Finalmen e es ´a el paque e co espondien e a la ase de p uebas, di idida en
dos a eas, las p uebas uni a ias, que comp ueban las uncionalidades de o ma
aislada y las p uebas de in eg aci´on que comp ueban que la aplicaci´on de o ma
au ´onoma unciona co ec amen e.
2.4. PLANIFICACI ´
ON 23
El segundo inc emen o co esponde a la Capa de se icios, ep esen ado en la
igu a 2.4.
Es e inc emen o comp ende el desa ollo de las uncionalidades de almacenamien-
o e imp esi´on de in o mes si uadas en el se ido , es a a ea es ´a subdi idida en
los paque es de dise˜no de la capa de se icios en la que se dise˜na ´a de o ma
abs ac a los se icios que con end ´a el se ido y el modo de u iliza los.
A con inuaci´on se ealiza ´a la implemen aci´on de la capa de se icios en la que se
inclui ´an de o ma uncional los dise˜nos an e io es, inalizando en las p uebas pa-
a comp oba que la capa de se icios unciona de o ma co ec a, componi´endose
es a ´ul ima ase a las p uebas uni a ias y de in eg aci´on.
Inc emen o 2: Capa de se icios
Dise˜no de la capa de se icios Implemen aci´on P uebas
P. uni a ias P. de in eg aci´on
Figu a 2.4: Descomposici´on del paque e de abajo Capa de se icios
El e ce inc emen o es el En o no y base de da os ep esen ado en al igu a
2.5.
Es e inc emen o engloba las a eas ela i as a mon a el en o no de despliegue
de la aplicaci´on jun o con la base de da os u ilizada po la capa de se icios,
es a a ea se di ide en los paque es de abajo: Implemen aci´on del en o no y
Implemen aci´on de la base de da os.
Inc emen o 3: En o no y base de da os
Implemen aci´on del en o no Implemen aci´on de la base de da os
Figu a 2.5: Descomposici´on del paque e de abajo En o no y base de da os
El p ime paque e engloba las a eas ela i as a ins ala , con igu a e inicia el
en o no de despliegue de las aplicaciones mien as que el segundo es ´a des inado
a las acciones ela i as a la selecci´on e implemen aci´on de una base de da os
NoSQL en el en o no p e iamen e ins alado.
24 CAP´
ITULO 2. GESTI ´
ON DEL PROYECTO
2.4.2. C onog ama (Plani icaci´on inicial)
La plani icaci´on que se mues a a con inuaci´on es la plani icaci´on inicial del
p oyec o, sin que se p odujese ning´un iesgo du an e el desa ollo y a endiendo
´unicamen e a las es imaciones iniciales.
Iden i icados y analizados los dis in os paque es de abajo que componen el
p oyec o en su o alidad se p ocede a ealiza la plani icaci´on o dis ibuci´on em-
po al del p oyec o, pa a ello se gene a on los siguien es c onog amas indicando
la du aci´on es imada en ho as de cada uno de los paque es de abajo y de las
a eas que componen dichos paque es de abajo.
En la igu a 2.6 se mues a el c onog ama gene al del p oyec o, la es imaci´on
incluye una du aci´on o al ap oximada de 426 ho as, el p oyec o es ´a compues-
o de los paque es de abajo an e io men e iden i icados m´as la elabo aci´on de
la documen aci´on del p oyec o, es a ´ul ima a ea se ealiza en pa alelo con los
paque es de abajo du an e odo el anscu so del p oyec o.
Figu a 2.6: C onog ama gene al del p oyec o
La p ime a ase del p oyec o es la de inici´on del p oyec o (Figu a 2.7), es a
a ea iene una du aci´on ap oximada de 32 ho as, una ez inalizada es a a ea
se p ocede a empeza con el paque e de abajo m´as labo ioso y complejo de
odo el p oyec o, la aplicaci´on web (Figu a 2.8), es e paque e de abajo iene
una du aci´on ap oximada de 338 ho as y compond ´a el n´ucleo del p oyec o, su
du aci´on se ´a m´as ele ada que la de los dem´as paque es debido a que implica
mayo es ue zo de desa ollo y dise˜no pa a pode comple a se.
Una ez inalizada la implemen aci´on de la ase an e io se p ocede a ealiza
el paque e de abajo capa de se icios (Figu a 2.9), es e paque e de abajo
iene una du aci´on ap oximada de 36 ho as debido a que las uncionalidades con-
2.4. PLANIFICACI ´
ON 25
empladas son pocas y ´aciles de p og ama , adicionalmen e se cuen a expe iencia
po pa e del desa ollado en es a pa e.
Finalmen e, se p ocede a ealiza el ´ul imo paque e de abajo, en o no y ba-
se de da os (Figu a 2.10), es e paque e iene una du aci´on es imada de 20 ho as
y consis e en implemen a la base de da os y el en o no de despliegue ue a del
en o no de desa ollo no mal de la aplicaci´on, al acaba es e paque e de abajo
y la documen aci´on asociada al p oyec o se alcanza ´ıa el hi o de Fin del p oyec o
y es e queda ´ıa inalizado.
Figu a 2.7: C onog ama del paque e de abajo De inici´on del p oyec o
Figu a 2.8: C onog ama del paque e de abajo Aplicaci´on web
Figu a 2.9: C onog ama del paque e de abajo Capa de se icios
Figu a 2.10: C onog ama del paque e de abajo En o no y base de da os
2.4.3. C onog ama (Plani icaci´on eal)
Du an e la ejecuci´on del p oyec o se p oduje on dos a iaciones signi ica i as
en el c onog ama de la plani icaci´on inicial, p o ocando un desajus e en la plani-
icaci´on.
Los iesgos que se p oduje on ue on dos:

26 CAP´
ITULO 2. GESTI ´
ON DEL PROYECTO
Du aci´on es imada pa a una a ea demasiado op imis a.
Acumulaci´on de a eas pa a el ´unico ecu so disponible.
El p ime iesgo p odujo un desajus e de 15h en la implemen aci´on de la aplica-
ci´on web, debido al a amien o de minimizaci´on aplicado an e es as si uaciones
de plani icaciones op imis as el desajus e no ue demasiado impo an e y apenas
impac ´o la plani icaci´on.
El segundo iesgo p odujo un e aso de 1 mes en la plani icaci´on (el mes de
Mayo), debido a una acumulaci´on de a eas no ela i as al p oyec o po pa e del
desa ollado .
En es e mes no se pudo a anza en el desa ollo del p oyec o, lo que p odujo que
no se con inua a con el has a p incipios de junio. Es e iesgo no es aba a ado
debido a que no exis en medidas posibles pa a sol en a lo de o ma sa is ac o ia,
po lo que se decidi´o asumi sus consecuencias.
La plani icaci´on eal se mues a en la igu a 2.11
Figu a 2.11: Plani icaci´on eal del p oyec o
2.5. Ges i´on de la con igu aci´on
Los di e en es elemen os que cons i uyen el so wa e que se a a cons ui en
es e p oyec o deben de es a some idos a una ges i´on de la con igu aci´on, es o in-
cluye con ola las di e en es e siones del c´odigo o de los elemen os del so wa e
que se gene en du an e el anscu so del p oyec o, ambi´en se debe de asegu a
la in eg idad de las e siones en caso de que sea necesa io ol e a alguna e si´on
an e io del c´odigo gene ado.
Adem´as, es necesa io ges iona los cambios que se ealizan du an e la cons ucci´on
2.5. GESTI ´
ON DE LA CONFIGURACI ´
ON 27
del c´odigo del so wa e, el modo de aplica es os cambios debe de es a ges ionado
po un p oceso de ges i´on de cambios en el que se indica el modo de ealiza los
cambios.
En es a secci´on se indican las dis in as he amien as o p ocesos que se u ilizan
pa a ealiza la co ec a ges i´on de la con igu aci´on de los elemen os del so wa e
de es e p oyec o.
2.5.1. Elemen os de con igu aci´on
An es de p ocede a de ini el sis ema de ges i´on de la con igu aci´on y el p o-
ceso de ges i´on de cambios es necesa io iden i ica que elemen os de con igu aci´on
se ´an los ges ionados po nues o p oceso de ges i´on de la con igu aci´on.
Los elemen os de con igu aci´on que se han iden i icado en es e p oyec o son los
siguien es:
C´odigo de la aplicaci´on clien e
C´odigo del se ido
Memo ia del p oyec o
Es os es elemen os son los que an a se ges ionados po el p oceso de ges i´on
de la con igu aci´on pues o que son p opensos a su i cambios y an a gene a se
dis in as e siones de cada uno de ellos a lo la go del anscu so del p oyec o,
adicionalmen e es c ucial man ene su in eg idad en caso de que sea necesa io
ol e a una e si´on an e io de uno de ellos.
2.5.2. Sis ema de ges i´on de la con igu aci´on
Pa a ges iona la in eg idad de las e siones jun o con las dis in as e siones
del c´odigo gene ado se u iliza el so wa e de con ol de e siones Gi .
El eposi o io de los a chi os es a ´a si uado en la pla a o ma Bi bucke de
A lassian 1, que pe mi e de o ma g a ui a la c eaci´on de eposi o ios p i ados o
p´ublicos seg´un las necesidades del usua io.
En el eposi o io se almacena ´a an o el c´odigo del clien e y del se ido como la
memo ia del p oyec o.
1h ps://bi bucke .o g/
28 CAP´
ITULO 2. GESTI ´
ON DEL PROYECTO
2.5.3. Es uc u a del eposi o io
La es uc u a del eposi o io que con end ´a los elemen os de la con igu aci´on
es la siguien e:
Reposi o io
Clien e Se ido Memo ia
Figu a 2.12: Es uc u a del eposi o io
En la ca pe a Clien e se incluye el c´odigo de la aplicaci´on ela i o a la in-
e az web (F on end), jun o con sus p uebas y a chi os auxilia es (im´agenes,
iconos, lib e ´ıas, e c.).
En la ca pe a Se ido se incluye el c´odigo de la capa de se icios REST (Back
end), adicionalmen e se incluyen las lib e ´ıas o a chi os auxilia es que se necesi-
en pa a que el c´odigo sea unciona.
Finalmen e en la ca pe a Memo ia se a˜naden los a chi os ela i os a la p esen e
memo ia, es o incluye el documen o ac ual jun o con las igu as y los diag amas
que se incluyen en el.
Pa a el clien e y el se ido se u iliz´o adicionalmen e NPM (Node Package Ma-
nage ), de modo que exis e una ca pe a llamada node modules que con iene los
paque es ins alados po es a he amien a jun o con el ´a bol de dependencias en
un a chi o llamado package.json, es o es u ilizado po NPM pa a ins ala y con-
ola las dependencias de la aplicaci´on, de modo que solo es necesa io subi al
eposi o io el c´odigo uen e base de la aplicaci´on jun o con el a chi o que indica
sus dependencias.
2.5.4. Ges i´on de cambios
En es e p oyec o solo exis e un colabo ado , po lo que no se puede da la
posibilidad de incompa ibilidades en e cambios a di e en es e siones del c´odigo,
po ello no se ´a necesa io aplica un p oceso de ges i´on de cambios complejo al
p oyec o ni se ´a necesa io la c eaci´on de un sis ema de ges i´on de cambios com-
ple o.
En su luga los cambios en el c´odigo se limi an a simples ano aciones esc i as
po el p opio colabo ado pa a indica los cambios, es as e ique as se ´a egis a-
das po el so wa e de con ol de e siones, de modo que es posible segui su
2.6. GESTI ´
ON DE COSTES 29
eliminaci´on y a˜nadido de o ma sencilla.
Las ano aciones con empladas son las siguien es:
TODO: Indica que la uncionalidad o cambio aun no se ha ealizado y es ´a
pendien e de ealiza se.
FIXME: Indicia que hay un allo en una uncionalidad o secci´on del c´odigo
que no es ´a co egida.
TESTME: Indica que al a comp oba el uncionamien o de la uncionali-
dad an e casos de p ueba.
2.6. Ges i´on de cos es
En es e apa ado se p ocede ´a a ealiza el an´alisis de los cos es del p oyec o,
cabe menciona que aunque es e p oyec o es de ´ambi o acad´emico y solo se ´a
desa ollado po una pe sona es impo an e ealiza es e ipo de ges iones pues
seg´un The S andish G oup [1], un 31 % de los p oyec os de so wa e acasan y no
se llegan a comple a , mien as que un 52.7 % e minan con un 189 % de exceso
de cos es, quedando solo un 16 % de p oyec os que e minan sin exceso de cos es
y en el iempo asignado.
El an´alisis que se ealiza ´a en es a secci´on end ´a como obje i o con abiliza
los cos es del p oyec o si es e se desa ollase en un ´ambi o no acad´emico.
Los ipos de cos es con emplados pa a es e p oyec o son los siguien es:
Cos es di ec os: Aquellos ´acilmen e de i ables de la ealizaci´on del p o-
yec o, son ´aciles de calcula y de es ima pues o que es ´an elacionados con
el p opio p oyec o, como el sala io de los ecu sos humanos.
Cos es indi ec os: Son di ´ıciles de calcula pues o que no es ´an di ec a-
men e elacionados con el p oyec o y suelen se angenciales al mismo, como
el consumo el´ec ico o de agua.
2.6.1. Cos es di ec os
Los cos es di ec os a ibuibles a es e p oyec o son los co espondien es al sa-
la io del desa ollado del mismo, los u o es del p oyec o desempe˜nan el ol de
clien es pa a es e p oyec o de modo que no se ienen en cuen a como posibles
ecu sos humanos a la ho a de calcula los cos es del pe sonal.
Bas´andonos en el es udio ealizado po Vi ae Consul o es [2], omando como
36 CAP´
ITULO 3. AN ´
ALISIS DE REQUISITOS
le conceda a la aplicaci´on, ambi´en condiciona las comunicaciones con ellos en
caso de que es os ac o es sean los clien es que enca gan el p oyec o.
En ocando el an´alisis con una base sob e los usua ios que an a u iliza nues-
a aplicaci´on inc emen a las p obabilidades de ´exi o del p oyec o adem´as de
disminui los cambios posibles en los equisi os de la aplicaci´on.
En caso de exis i m´ul iples ac o es con dis in os in e eses, es de suma impo -
ancia in en a iden i ica con lic os de in e eses en e los ac o es del sis ema (en
caso de que exis an) que pod ´ıan p o oca , o bien que los equisi os de la apli-
caci´on su iesen cambios, o bien que apa eciesen nue os equisi os en momen os
inespe ados del p oyec o.
En nues a aplicaci´on solo exis e un ac o , el cual llama emos Usua io, po
lo an o no es necesa io ealiza un an´alisis de con lic os de in e eses y adem´as
se pod ´a cen a el an´alisis del ´unico ac o de una o ma m´as exhaus i a, los
siguien es apa ados se cen a ´an exclusi amen e en analiza es e ac o .
3.1.1. In e eses del usua io
Los in e eses p incipales del usua io gene al de la aplicaci´on son los siguien es:
C ea y edi a plan illas de in o mes los m´as ´apido y c´omodamen e posible.
Reu iliza las plan illas de in o mes m´ul iples eces.
C ea plan illas cuyo modelo de da os ep esen ado es ´acilmen e al e able
y edi able.
In oduci a iables y uen es de da os de un modelo de da os en el con enido
de la plan illa.
Gene a un in o me comple o en base a una plan illa de o ma c´omoda y
simple.
Con es os in e eses iden i icados se pueden iden i ica equisi os no unciona-
les m´as ´acilmen e, adem´as de ex ae algunos equisi os uncionales no pedidos
expl´ıci amen e po el clien e.
3.1.2. Pe il de conocimien o del usua io
De media gene al, el usua io al que es ´a des inada la aplicaci´on, posee ´a co-
nocimien os al os en el sec o de las TIC, adem´as su ni el ´ecnico es de ni el
expe o en cuan o a ma e ias elacionadas con la gene aci´on y manipulaci´on de
in o mes de odo ipo.

3.2. ESPECIFICACI ´
ON DE REQUISITOS 37
Pues o que el usua io iene un pe il al o de conocimien os en las TIC no a
a se necesa io aplica un ni el ex emadamen e al o de usabilidad.
Adicionalmen e, es posible inclui oda clase de ecnicismos elacionados con la
ma e ia en la aplicaci´on sin iesgo a que el usua io no los comp enda.
3.1.3. Fac o es de echazo del usua io
Los ac o es que pueden p o oca que el usua io echace la aplicaci´on de o ma
absolu a son los siguien es:
Gene a un in o me du a mucho iempo o di ec amen e no gene a lo.
Edi a el modelo de da os que ep esen a la plan illa es ex emadamen e
complejo.
Fal a de componen es que ep esen en in o maci´on es uc u ada como a-
blas o g ´a icas.
Usa la aplicaci´on es di ´ıcil o edioso.
No pode inyec a a iables o uen es de da os en la plan illa.
Con es os ac o es iden i icados, se pueden ex ae una mayo can idad de equi-
si os an o uncionales como no uncionales y e i a posibles e o es de dise˜no e
implemen aci´on en el u u o.
3.2. Especi icaci´on de equisi os
Con los usua ios analizados se puede p ocede a ealiza un an´alisis de los
posibles equisi os que debe de cumpli la aplicaci´on, an o desde un pun o de
is a uncional como de endimien o, no uncional o de in o maci´on.
Los equisi os que se iden i iquen end ´an una p io idad, la p io idad depende ´a
del alo que el usua io o clien e conceda al equisi o que se haya ex a´ıdo.
En es a secci´on se ha u ilizado la siguien e escala:
C ´ı ica: El equisi o es indispensable, la aplicaci´on no si e si no se cumple.
Al a: El equisi o iene un alo conside able pa a el clien e o usua io, su
ausencia puede p o oca el echazo o incon o midad de uso.
38 CAP´
ITULO 3. AN ´
ALISIS DE REQUISITOS
Media: El equisi o iene un alo medio pa a el clien e o usua io, su au-
sencia puede no a se aunque no implica ´ıa a g andes asgos una ca encia
g a e.
Baja: El equisi o iene una p io idad baja pa a el clien e, su ausencia no
p o oca e ec os nega i os pa a el clien e o usua io.
3.2.1. Requisi os uncionales
ID RF-01
Nomb e C eaci´on de plan illas nue as
Desc ipci´on La aplicaci´on debe de pe mi i la c eaci´on de plan illas nue as cuyo
con enido po de ec o se ´a un olio de ama˜no A4 en blanco.
P io idad C ´ı ica
ID RF-02
Nomb e Gua dado de plan illas
Desc ipci´on La aplicaci´on debe de pe mi i el gua dado de las plan illas que se
hayan gene ado en la base de da os.
P io idad C ´ı ica
ID RF-03
Nomb e Ca ga de plan illas desde la base de da os
Desc ipci´on La aplicaci´on debe de pe mi i al usua io la ca ga de plan illas
p e iamen e c eadas.
P io idad C ´ı ica
ID RF-04
Nomb e Bo ado de plan illas
Desc ipci´on La aplicaci´on debe de pe mi i al usua io bo a aquellas plan illas
que ya no conside e necesa ias.
P io idad C ´ı ica
ID RF-05
Nomb e Inse ci´on de componen es de ex o en las plan illas
Desc ipci´on La aplicaci´on pe mi i ´a al usua io la inse ci´on o a˜nadido de un
n´ume o inde e minado de elemen os de ex o ( ´ı ulos, p´a a os y
lis as) a la plan illa que es ´e edi ando.
P io idad C ´ı ica
3.2. ESPECIFICACI ´
ON DE REQUISITOS 39
ID RF-06
Nomb e Inse ci´on de im´agenes en las plan illas
Desc ipci´on La aplicaci´on pe mi i ´a al usua io la inse ci´on o a˜nadido de un
n´ume o inde e minado de im´agenes ca gadas desde el almacena-
mien o local del usua io en la plan illa que es ´e edi ando.
P io idad Al a
ID RF-07
Nomb e Inse ci´on de ablas en las plan illas
Desc ipci´on La aplicaci´on pe mi i ´a al usua io la inse ci´on o a˜nadido de un
n´ume o inde e minado de ablas en la plan illa que es ´e edi ando.
P io idad C ´ı ica
ID RF-08
Nomb e Inse ci´on de g ´a icas de da os en las plan illas
Desc ipci´on La aplicaci´on pe mi i ´a al usua io la inse ci´on o a˜nadido de un
n´ume o inde e minado de g ´a icas de da os (ba as, ´a ea, dispe -
si´on, sec o es, l´ıneas y ada ) en la plan illa que es ´e edi ando.
P io idad C ´ı ica
ID RF-09
Nomb e Inse ci´on de mallas de celdas en las plan illas
Desc ipci´on La aplicaci´on pe mi i ´a al usua io la inse ci´on o a˜nadido de un
n´ume o inde e minado de mallas de celdas en la plan illa que es ´e
edi ando.
P io idad Al a
ID RF-10
Nomb e De inici´on de a iables de con enido din´amico
Desc ipci´on La aplicaci´on pe mi i ´a al usua io la de inici´on de un n´ume o inde-
e minado de a iables a ni el de plan illa.
P io idad C ´ı ica
ID RF-11
Nomb e Mapeo de a iables a u as de JSON
Desc ipci´on La aplicaci´on pe mi i ´a al usua io ealiza un mapeo de u as del
a chi o en o ma o JSON que haya ca gado en la aplicaci´on en las
a iables que haya decla ado.
P io idad C ´ı ica
40 CAP´
ITULO 3. AN ´
ALISIS DE REQUISITOS
ID RF-12
Nomb e Ca ga de a chi os JSON a ni el de aplicaci´on
Desc ipci´on La aplicaci´on pe mi i ´a al usua io la ca ga de a chi os en o ma o
JSON pa a su pos e io mapeo de u as en la secci´on de a iables.
P io idad C ´ı ica
ID RF-13
Nomb e Inyecci´on de a iables en componen es de ex o
Desc ipci´on La aplicaci´on pe mi i ´a al usua io la inyecci´on de a iables en com-
ponen es de ex o median e la sin axis {{nomb e de la a iable}}.
P io idad C ´ı ica
ID RF-14
Nomb e Ca ga de uen e de da os en ablas
Desc ipci´on La aplicaci´on pe mi i ´a al usua io la ca ga de da os din´amicos desde
una a iable decla ada, la uen e de da os se ´a seleccionada como
una p opiedad de la abla.
P io idad C ´ı ica
ID RF-15
Nomb e Ca ga de uen e de da os en g ´a icas
Desc ipci´on La aplicaci´on pe mi i ´a al usua io la ca ga de da os din´amicos desde
una a iable decla ada, la uen e de da os se ´a seleccionada como
una p opiedad de la g ´a ica.
P io idad C ´ı ica
ID RF-16
Nomb e Reemplazo y ca ga de a iables
Desc ipci´on La aplicaci´on pe mi i ´a a olun ad del usua io eemplaza las a-
iables que ha inyec ado en los componen es de ex o y ca ga las
uen es de da os de las ablas, lis as y g ´a icas que haya decla ado
en la plan illa.
P io idad C ´ı ica
3.2. ESPECIFICACI ´
ON DE REQUISITOS 41
ID RF-17
Nomb e Imp esi´on a PDF de la plan illa con a iables eemplazadas
Desc ipci´on La aplicaci´on pe mi i ´a al usua io la opci´on de gene a un a chi o en
o ma o PDF a pa i de la plan illa que ha gene ado subs i uyendo
odas la a iables y ca gando odas las uen es de da os decla adas
po el usua io, el PDF gene ado end ´a un ama˜no po p´agina de
un olio DIN A4 y pod ´a se desca gado po el usua io una ez
gene ado.
P io idad C ´ı ica
ID RF-18
Nomb e Edici´on del ama˜no y desplazamien o de un componen e
Desc ipci´on La aplicaci´on pe mi i ´a al usua io edi a el ancho y el desplaza-
mien o hacia la de echa que ocupan los componen es que haya en
la plan illa.
P io idad Al a
ID RF-19
Nomb e Bo ado de componen es y ilas de componen es
Desc ipci´on La aplicaci´on pe mi i ´a al usua io bo a cualquie componen e (o
una ila en e a de ellos) que haya a˜nadido a la plan illa que es ´e
edi ando.
P io idad C ´ı ica
ID RF-20
Nomb e Opciones de deco aci´on, alineaci´on y enume aci´on a los componen-
es de ex o
Desc ipci´on La aplicaci´on pe mi i ´a al usua io de ini la alineaci´on del con enido
de los componen es de ex o (cen ado, izquie da, de echa, jus i ica-
do) jun o con las opciones de deco aci´on b´asicas (neg i a, cu si a y
sub ayado), en caso de se una lis a se pod ´a de ini si es o denada
o no o denada.
P io idad Al a

42 CAP´
ITULO 3. AN ´
ALISIS DE REQUISITOS
ID RF-21
Nomb e Edici´on de componen es
Desc ipci´on La aplicaci´on pe mi i ´a al usua io la edici´on del con enido de cual-
quie componen e p esen e en la plan illa (Cambia el con enido,
opciones de deco aci´on, a˜nadi /qui a ilas de da os a las ablas o
se ies de da os a las g ´a icas).
P io idad C ´ı ica
ID RF-22
Nomb e A˜nadido de celdas en las mallas
Desc ipci´on La aplicaci´on pe mi i ´a al usua io el a˜nadido de un n´ume o inde-
e minado de celdas en un componen e de ipo malla.
P io idad C ´ı ica
ID RF-23
Nomb e Edici´on de p opiedades de las celdas de una malla
Desc ipci´on La aplicaci´on pe mi i ´a al usua io de ini la al u a que ocupa una
celda, as´ı como su ancho, su posici´on den o de la malla, as´ı como
su con enido ex ual, aplic´andose las mismas p opiedades que un
componen e de ipo ex o, el usua io pod ´a decidi en cualquie
momen o si bo a dicha celda de la malla.
P io idad C ´ı ica
ID RF-24
Nomb e Inse ci´on de componen es nue os median e D ag and D op
Desc ipci´on La aplicaci´on pe mi i ´a al usua io la c eaci´on de nue os componen-
es u ilizando la ´ecnica de D ag and D op pa a a as a los desde
el men´u de componen es a la posici´on deseada en la plan illa.
P io idad C ´ı ica
ID RF-25
Nomb e Al e aci´on de la posici´on de componen es exis en es median e D ag
and D op
Desc ipci´on La aplicaci´on pe mi i ´a al usua io al e a la posici´on de componen-
es exis en es en la plan illa a as ´andolos y sol ´andolos en cual-
quie posici´on disponible en la plan illa.
P io idad C ´ı ica
3.2. ESPECIFICACI ´
ON DE REQUISITOS 43
ID RF-26
Nomb e C eaci´on de e siones de una plan illa
Desc ipci´on La aplicaci´on pe mi i ´a al usua io de ini e siones pa a una plan-
illa de e minada, de modo que es as se gua da an con el mismo
nomb e de plan illa en la base de da os, aunque su con enido se ´a
di e en e.
P io idad Media
ID RF-27
Nomb e Edici´on de e siones de una plan illa
Desc ipci´on La aplicaci´on pe mi i ´a al usua io ca ga una e si´on que el selec-
cione de una plan illa de e minada.
P io idad Media
ID RF-28
Nomb e Bo ado de una e si´on
Desc ipci´on La aplicaci´on pe mi i ´a al usua io bo a una e si´on de e minada
de una plan illa que el seleccione.
P io idad Media
ID RF-29
Nomb e Ca ga de uen es de da os en lis as
Desc ipci´on La aplicaci´on pe mi i ´a al usua io la ca ga de da os din´amicos desde
una a iable decla ada, la uen e de da os se ´a seleccionada como
una p opiedad de la lis a.
P io idad Media
ID RF-30
Nomb e Ca ga de m´ul iples a chi os JSON en la aplicaci´on
Desc ipci´on La aplicaci´on pe mi i ´a al usua io la ca ga de m´ul iples a chi os en
o ma o JSON, de modo que el usua io pod ´a al e na en e uno o
o o pa a su uso en la decla aci´on de a iables.
P io idad C ´ı ica
44 CAP´
ITULO 3. AN ´
ALISIS DE REQUISITOS
ID RF-31
Nomb e Imp esi´on de m´ul iples in o mes
Desc ipci´on La aplicaci´on pe mi i ´a al usua io la imp esi´on de m´ul iples in o -
mes de o ma simul ´anea an e una plan illa de e minada, de modo
que la aplicaci´on gene a ´a un in o me po cada JSON ca gado en
la aplicaci´on, eemplazando las a iables po los alo es de cada
JSON.
P io idad Al a
3.2.2. Requisi os no uncionales
ID RNF-01
Nomb e La aplicaci´on debe de se en Web
Desc ipci´on La aplicaci´on debe de se web pa a asegu a mayo compa ibilidad
y po abilidad.
P io idad C ´ı ico
ID RNF-02
Nomb e La plan illa gene ada debe de gua da se en o ma o JSON
Desc ipci´on La plan illa que gene e el usua io se gua da ´a como un obje o en
o ma o JSON que ep esen e la es uc u a y con enido de la plan-
illa.
P io idad C ´ı ico
ID RNF-03
Nomb e U ilizaci´on de se icios Web
Desc ipci´on Pa a implemen a el lado se ido que se enca ga ´a de p opo ciona
las uncionalidades de gua dado, ca ga y bo ado de plan illas es
necesa io implemen a las como se icios REST ul pa a ga an iza
compa ibilidad con la aplicaci´on web.
P io idad C ´ı ico
ID RNF-04
Nomb e Uso de ecnolog´ıas web
Desc ipci´on Pues o que la aplicaci´on se ´a en web, se debe ´an de u iliza las
ecnolog´ıas de desa ollo web como HTML5, CSS3 y Ja aSc ip .
P io idad C ´ı ico
3.2. ESPECIFICACI ´
ON DE REQUISITOS 45
ID RNF-05
Nomb e Base de da os NoSQL Documen al
Desc ipci´on Pa a almacena las plan illas en o ma o JSON se u iliza ´a una base
de da os documen al.
P io idad C ´ı ica
ID RNF-06
Nomb e Uso de Node.js
Desc ipci´on Pa a imp imi el PDF del in o me es necesa io u iliza Phan omJS,
el cual equie e de la u ilizaci´on de Node.js pa a ejecu a lo.
P io idad C ´ı ica
ID RNF-07
Nomb e El in o me en iado al se icio de PDF debe es a en HTML
Desc ipci´on El se icio de gene aci´on de PDF debe ´unicamen e ecibi un HTML
a pa i del cual gene a ´a el PDF.
P io idad C ´ı ica
ID RNF-08
Nomb e Uso de JSON a ni el in e no
Desc ipci´on La aplicaci´on debe de a a odos sus da os a ni el in e no en
JSON, po lo an o en caso de ecibi da os desde bases de da os
elacionales o CSV es os debe ´an de se aducidos a JSON.
P io idad C ´ı ica
3.2.3. Requisi os de in o maci´on
ID RI-01
Nomb e Va iable de ex o
Desc ipci´on El sis ema debe de almacena las a iables de ex o que
decla e el usua io jun o con la con igu aci´on que el es-
ablezca.
Requisi os asociados RF-10, RF-11
Da os espec´ı icos - Nomb e de la a iable
- Con igu aci´on de la a iable
- Ru a del JSON
P io idad C ´ı ica
52 CAP´
ITULO 3. AN ´
ALISIS DE REQUISITOS
ID CU-10
Nomb e Ca ga y eemplazo de a iables
Requisi os asociados RF-16
Desc ipci´on El sis ema debe ´a de pe mi i al usua io eemplaza las a iables
inyec adas po su alo .
P econdiciones Exis e una plan illa con un componen e, es e componen e debe de
ene inyec ada una a iable (como ex o o como uen e de da os),
la a iable debe de es a de inida y hay un a chi o JSON ca gado
con da os.
Pos condiciones Se eemplazan las a iables de la plan illa po su alo .
Pasos 1 - El usua io selecciona la opci´on de Reemplaza a iables.
2 - La aplicaci´on busca las a iables en los componen es y las e-
emplaza po su alo .
3 - La plan illa ac ualiza su es ado pa a mos a el con enido de
odas las a iables.
P io idad C ´ı ica
C i e io de alidaci´on El usua io puede eemplaza las a iables de inidas en la plan illa.
ID CU-11
Nomb e Ca ga de a chi os JSON a ni el de aplicaci´on
Requisi os asociados RF-12, RF-30
Desc ipci´on El sis ema debe ´a de pe mi i al usua io ca ga m´ul iples a chi os
JSON en la aplicaci´on pa a da alo a las a iables que el de ina
en la plan illa.
P econdiciones Exis e una plan illa c eada
Pos condiciones Se ca ga el a chi o (o los a chi os) JSON en la aplicaci´on
Pasos 1 -El usua io selecciona la secci´on de Va iables en el men´u de na-
egaci´on.
2 - La aplicaci´on cambia a la is a de a iables.
3 - El usua io selecciona la opci´on de Ca ga a chi o JSON.
4 - El usua io selecciona los a chi os JSON de su almacenamien o
local que desea ca ga en la aplicaci´on.
5 - La aplicaci´on ca ga los a chi os JSON seleccionados.
6 - El usua io selecciona uno de los a chi os ca gados como a chi o
ac ual pa a da alo a las a iables.
P io idad C ´ı ica
C i e io de alidaci´on El usua io pueda ca ga un n´ume o inde e minado de a chi os
JSON en la aplicaci´on.

3.2. ESPECIFICACI ´
ON DE REQUISITOS 53
ID CU-12
Nomb e Imp esi´on a PDF de in o mes
Requisi os asociados RF-17, RF-31
Desc ipci´on El sis ema debe ´a de pe mi i al usua io la gene aci´on de un in o me
po cada a chi o JSON ca gado en la aplicaci´on, subs i uyendo las
a iables de inidas po los alo es especi icados en cada JSON.
P econdiciones Exis e una plan illa con componen es con a iables inyec adas
adem´as exis e un a chi o JSON ca gado en la aplicaci´on.
Pos condiciones Se c ea un in o me con las a iables eemplazadas en PDF po cada
a chi o JSON ca gado en la aplicaci´on
Pasos 1 - El usua io selecciona la opci´on de Imp imi odos en la ba a
de acciones.
2 -La aplicaci´on subs i uye las a iables en la plan illa y pasa el
in o me a o ma o PDF (Es e paso se epi e po cada a chi o JSON
p esen e en la aplicaci´on).
P io idad C ´ı ica
C i e io de alidaci´on El usua io pueda ob ene un in o me en o ma o PDF con las a ia-
bles eemplazadas po cada a chi o JSON ca gado en la aplicaci´on.
3.2.5. Ma ices de azabilidad
OBJ-001 OBJ-002 OBJ-003
CU-01 X
CU-02 X
CU-03 X
CU-04 X X X
CU-05 X X X
CU-06 X X
CU-07 X X
CU-08 X X
CU-09 X X
CU-10 X X
CU-11 X X
CU-12 X X X
Cuad o 3.1: Ma iz de azabilidad Caso de uso - Obje i os
54 CAP´
ITULO 3. AN ´
ALISIS DE REQUISITOS
En egable 1 En egable 2 En egable 3 En egable Final
CU-01 X X X X
CU-02 X X X X
CU-03 X X X X
CU-04 X X
CU-05 X X
CU-06 X X
CU-07 X X
CU-08 X X X
CU-09 X X X
CU-10 X X X
CU-11 X X X
CU-12 X
Cuad o 3.2: Ma iz de azabilidad Caso de uso-En egables
Cap´ı ulo 4
An´alisis de ecnolog´ıas y
he amien as
A la ho a de ealiza la implemen aci´on o dise˜no de un sis ema siemp e exis en
dis in as al e na i as ecnol´ogicas pa a hace lo.
Es impo an e analiza es e ipo de ecnolog´ıas o he amien as an es de deci-
di cual u iliza pa a desa olla el sis ema, pues eligiendo una o o a p oduce
al e aciones subs anciales en las ases de dise˜no e implemen aci´on y p uebas, lo
que p o oca que es as engan que se adap adas a las decisiones ecnol´ogicas que
se ealicen en es a ase.
Adicionalmen e, des aca que la elecci´on de una ecnolog´ıa debe ene como c i-
e io p incipal de selecci´on pe mi i que el sis ema a desa olla cumpla con los
equisi os con emplados en el p oyec o, adem´as de acili a abajo al desa olla-
do .
4.1. Se icios web
A la ho a de ansmi i in o maci´on en e dis in as aplicaciones dis ibuidas
nos encon amos con dis in os pa adigmas (paso de mensajes, llamada de p oce-
dimien o emo o, socke s, e c.), la decisi´on de cual aplica depende del con ex o
de la aplicaci´on y del p oyec o a desa olla .
Uno de los pa adigmas m´as u ilizados en desa ollo de aplicaciones web ac ual-
men e son los se icios web, que consis e en accede a m´e odos emo os a a ´es
de la web [3], gene almen e u ilizando HTTP y ansmi iendo un mensaje de ex-
o que debe de se in e p e ado po el se ido pa a la ealizaci´on de la ope aci´on
que el clien e ha solici ado, adicionalmen e los mensajes de ex o pueden se do-
cumen os en o ma o XML o JSON, as´ı como ex o plano o amas de da os, el
55
56 CAP´
ITULO 4. AN ´
ALISIS DE TECNOLOG´
IAS Y HERRAMIENTAS
o ma o que se u ilice depende del se icio y del p o eedo del mismo.
G acias a es o se ga an iza in e ope a i idad en e dis in os lenguajes de p o-
g amaci´on o implemen aciones de ecnolog´ıas, ya que odos ellos adop a ´an un
es ´anda pa a ansmi i la in o maci´on y en ende se.
Pa a es e p oyec o, el equisi o no uncional RNF-03 impone la es icci´on de
que el pa adigma a u iliza sean se icios web pa a cumpli las uncionalidades
de almacenamien o y manipulaci´on de plan illas gene adas con la aplicaci´on, po
lo an o el uso de es e pa adigma de compu aci´on dis ibuida es obliga o io, y
aunque no lo uese es ecomendable al a a se de una aplicaci´on web.
Adicionalmen e se es ablece en ese mismo equisi o que los se icios web deben
de es a implemen ados como se icios REST ul, po lo an o o as al e na i as
como SOAP quedan desca adas pa a implemen a los se icios web.
Pa a implemen a una API que con enga los se icios web exis en m´ul iples po-
sibilidades o al e na i as, debido a que exis e desacoplamien o en e el clien e y
el se ido se puede u iliza cualquie lenguaje de p og amaci´on pa a hace los
y ac ualmen e exis en m´ul iples amewo ks o lib e ´ıas pa a cada lenguaje que
p opo cionan acilidades pa a implemen a se icios REST.
A con inuaci´on se mues an las dis in as al e na i as que se analiza on y cual
se op ´o po u iliza en es e p oyec o.
4.1.1. Je sey y Ja a
Je sey [4] es un amewo k que pe mi e el desa ollo de se icios web REST-
ul en Ja a. Pe mi e p og ama los se icios como unciones Ja a es ´anda , las
ope aciones de Je sey es ´an implemen adas siguiendo las especi icaci´on de la API
JAX-RS [5], po ello Je sey u iliza oda clase de ano aciones pa a desc ibi como
se icios web las unciones Ja a p og amadas.
Median e el uso de la ano aci´on @Pa h se de inen las URIs de los se icios, adi-
cionalmen e las las ano aciones @POST,@GET,@PUT y@DELETE se de ine
que ipo de ope aci´on HTTP u ilizan los se icios pa a in oca se.
Se puede de ini adicionalmen e si el se icio p oduce o consume in o maci´on
median e las ano aciones @Consumes y@P oduces.
Ac ualmen e, es a bajo licencia de uso doble CDDL e si´on 1.1 y GPL e -
si´on 2.
4.1. SERVICIOS WEB 57
4.1.2. Exp ess.js y Ja aSc ip
Exp ess.js [6] es un amewo k de desa ollo web pa a Node.js, pe mi e de
o ma muy sencilla implemen a se icios REST median e el uso de unciones
Ja aSc ip espec´ı icas del amewo k.
Las unciones: exp ess().pos (), exp ess().ge (), exp ess.pu () y exp ess().dele e()
pe mi en c ea se icios con cada una de la ope aciones HTTP pe mi idas pa a
los se icios REST.
Adicionalmen e, se in eg a pe ec amen e con o as uncionalidades de Node.js
y exis en mul i ud de paque es y lib e ´ıas pa a expandi su abanico de unciona-
lidades, en conc e o, con iene paque es pa a abaja di ec amen e con bases de
da os documen ales como MongoDB de o ma sencilla.
Su licencia de uso es MIT.
4.1.3. Rocke y Rus
Rocke [7] es un amewo k pa a el ecien e lenguaje Rus [8] que es ´a siendo
desa ollado po Mozilla, el cual es un lenguaje dise˜nado pa a se segu o, concu-
en e y e icien e.
Su uncionamien o es a basado en los p incipios de Je sey, median e el uso de
ano aciones de la o ma #[] se pueden de ini las unciones p og amadas en Rus
como se icios web.
En conc e o se pueden u iliza las ano aciones: #[ge ()],#[pos ()],#[pu ()] y
#[dele e()] pa a de ini el ipo de ope aciones HTTP que se an a u iliza en la
unci´on p og amada en Rus .
Es a bajo licencia MIT y Apache 2.0.
4.1.4. Conclusi´on
Analizando las es posibilidades an e io es se ha de e minado que el ame-
wo k y el lenguaje que se a a u iliza pa a implemen a los se icios REST es
Exp ess.js y Ja aSc ip .
Los mo i os de es a decisi´on son los siguien es:
Maneja de o ma na i a el o ma o JSON u ilizado po los se icios REST.
Es ex emadamen e sencillo implemen a se icios REST en el.

58 CAP´
ITULO 4. AN ´
ALISIS DE TECNOLOG´
IAS Y HERRAMIENTAS
Sopo ado en la mayo ´ıa de las pla a o mas pues o que co e en Node.js.
Tiene oda clase de paque es pa a abaja con bases de da os NoSQL
documen ales con suma acilidad (RNF-05).
Hay que usa Node.js pa a imp imi el PDF median e el uso de Phan omJS
(RNF-06).
4.2. Tecnolog´ıas web es ´anda
Los equisi os RNF-01 yRNF-04 es ablecen que la aplicaci´on de in e acci´on
di ec a con el usua io (F on end) debe de es a implemen ada usando ecnolog´ıas
web.
Las ecnolog´ıas web es ´anda ac uales son : HTML5,CSS3 yJa aSc ip .
A lo la go de es e apa ado se de inen las es adem´as de su u ilidad y un-
cionalidad en es e p oyec o.
4.2.1. HTML5
HTML es el lenguaje b´asico pa a ep esen a los elemen os de una aplica-
ci´on web. Se a a de un lenguaje desa ollado y es anda izado po W3C 1y
WHATWG 2.
HTML de ine una p´agina web como un conjun o de e ique as o ma cas, su anida-
mien o y o den en el documen o de ini ´a el con enido de la p´agina web.
Ac ualmen e HTML se encuen a en su quin a en ega, m´as conocida como
HTML5, es a e si´on incluye nue as e ique as sem´an icas que acili an el desa-
ollo de aplicaciones web, como po ejemplo: main pa a el con enido p incipal,
oo e pa a el pie de p´agina, heade pa a el encabezado de la p´agina o na pa a
la na egaci´on de la p´agina.
Adicionalmen e HTML dispone de nue as APIs como can as pa a el pin ado de
con enido en una p´agina web o D ag and D op pa a a as a y sol a elemen os
HTML p esen es en el documen o de la p´agina web.
1h ps://www.w3.o g/
2h ps://wha wg.o g/
4.2. TECNOLOG´
IAS WEB EST ´
ANDAR 59
4.2.2. CSS3
La de inici´on de la apa iencia de un elemen o de inido en el lenguaje HTML
se ealiza median e el uso de hojas de es ilo en cascada, o m´as bien conocidas
como Cascading S yle Shee s (CSS).
CSS pe mi e median e la de inici´on de eglas aplica es ilo a los elemen os HTML
incluidos en una p´agina web, dichas p opiedades aba can desde el colo de los ele-
men os, ama˜no de uen e, bo des de los elemen os y m´a genes a posici´on de los
elemen os, modo de isualizaci´on y ama˜no de los mismos en e o as p opieda-
des. Median e el uso de CSS se p og ama la isualizaci´on de una p´agina web de
o ma comple a po pa e del usua io inal de la aplicaci´on.
Ac ualmen e la e si´on de CSS en la que se es ´a abajando es CSS3 3, aunque
su implemen aci´on no es absolu a en odos los na egado es si se ha alcanzado un
g an p og eso en las uncionalidades que con empla.
4.2.3. Ja aSc ip
Ja aSc ip es el lenguaje de p og amaci´on de al o ni el u ilizado a ni el web
pa a do a a las p´aginas web de con enido din´amico. Se a a de un lenguaje
de ipado d´ebil y din´amico basado en p o o ipos, adem´as es mul ipa adigma ya
que inco po a pa adigmas de p og amaci´on impe a i a, uncional y o ien ada a
obje os. Fue desa ollado po Ne scape Communica ions Co po a ion yMozilla
Founda ion 4y es anda izado po ECMA 5.
Ja aSc ip en conjun o con la API DOM pe mi e accede a los elemen os HTML
y CSS de la p´agina web y modi ica los, a˜nadiendo m´as elemen os o elimin´andolos
si es necesa io. De es e modo se puede modi ica el con enido de la p´agina web
de o ma din´amica seg´un el usua io a p oduciendo e en os de in e acci´on, como
pulsa un bo ´on o ellena un o mula io.
Ac ualmen e Ja aSc ip es ´a en la e si´on ES8, o conocido ambi´en como EC-
MASc ip 2017 [9], es a e si´on inco po a uncionalidades de p og amaci´on adi-
cionales como unciones as´ınc onas, ellenado de cadenas de ex o o ob enci´on
de p opiedades de obje os, es a e si´on es ´a implemen ada ac ualmen e en casi
odos los na egado es mode nos.
Adicionalmen e, ES8 incluye ES6, una de las ac ualizaciones m´as impo an es
de Ja aSc ip , en la que se incluyen lambdas y se e ue za el pa adigma de p o-
3h ps://de elope .mozilla.o g/en-US/docs/Web/CSS/CSS3
4h ps://www.mozilla.o g/en-US/ ounda ion/
5h ps://www.ecma-in e na ional.o g/
60 CAP´
ITULO 4. AN ´
ALISIS DE TECNOLOG´
IAS Y HERRAMIENTAS
g amaci´on uncional del lenguaje.
Debido a su ex enso uso exis en mul i ud de lib e ´ıas y amewo ks que pe mi en
agiliza el desa ollo en Ja aSc ip de p´aginas web.
4.2.4. JSON
JSON [10] o Ja aSc ip Objec No a ion es el o ma o de ep esen aci´on e
in e cambio de da os u ilizado po excelencia en Ja aSc ip .
La ep esen aci´on de un obje o en o ma o JSON se basa en la u ilizaci´on de
pa es {cla e: alo }, de modo que es posible ep esen a obje os complejos me-
dian e el uso de un o ma o sencillo, siendo es e o ma o ´acil de comp ende po
un humano y ´acil de aduci pa a una m´aquina.
El o ma o JSON es u ilizado en Ja aSc ip pa a ep esen a los obje os que
manipula y c ea, sin emba go el uso de JSON se ha p opagado a algunas de las
bases de da os documen ales NoSQL, de modo que almacenan los documen os
como un obje o en o ma o JSON, o en odo caso como un BSON (JSON en
bina io), y u ilizan un sis ema de consul as basadas en JSON.
4.3. F amewo ks y lib e ´ıas
Pa a agiliza el abajo a ealiza o pode ealiza cie as uncionalidades en
un p oyec o de so wa e se pueden u iliza lib e ´ıas o amewo ks.
Pues o que es a aplicaci´on se si ´ua en el con ex o web, exis en mul i ud de a-
mewo ks y lib e ´ıas de uso lib e que se pueden u iliza pa a ealiza es e p oyec o.
Debido a su eno me can idad y a su di e sidad no es posible de ini odas las
al e na i as posibles en es a secci´on, po ello solo se an a menciona aquellas
que se selecciona on jun o a las azones que de e mina on la decisi´on.
4.3.1. TypeSc ip
TypeSc ip [11] es un lenguaje de supe conjun o de Ja aSc ip desa ollado y
man enido po Mic oso y bajo licencia Apache 2.0.
El p op´osi o de TypeSc ip es in oduci ipado es ´a ico a Ja aSc ip , de mo-
do que el c´odigo p og amado se uel e decla a i o al in oduci ipos de o ma
es ´a ica en el c´odigo Ja aSc ip e i ando e o es comunes de p og amaci´on en
Ja aSc ip .
4.3. FRAMEWORKS Y LIBRER´
IAS 61
Pues o que es un lenguaje de supe conjun o, la esc i u a de c´odigo TypeSc ip
incluye an o lenguaje Ja aSc ip como c´odigo no-Ja aSc ip , po ello TypeSc ip
u iliza un compilado p opio que aduce es as di ec i as no-Ja aSc ip a c´odigo
equi alen e Ja aSc ip que puede se in e p e ado po cualquie na egado .
Adicionalmen e, TypeSc ip cuen a con un conjun o de uncionalidades adicio-
nales como enums, in e aces, in e secci´on de ipos, ipos gen´e icos, namespaces,
s´ımbolos, mapas, p opiedades, e c. Adem´as, se puede in eg a con los p incipales
amewo ks de desa ollo web, como Angula JS, Reac , Exp ess.js o Vue.js de
o ma sencilla.
Es e lenguaje se ha seleccionado como ecnolog´ıa de desa ollo debido a su com-
pa ibilidad con Ja aSc ip no mal, ´acil in eg aci´on con amewo ks de desa ollo
web y a las uncionalidades de p og amaci´on o ien ada a obje os adicionales que
p opo ciona.
Tambi´en menciona que la p incipal causa de es a elecci´on es el ipado es ´a i-
co que in oduce, de modo que se puede desa olla c´odigo decla a i o lib e de
e o es en iempo de compilaci´on.
4.3.2. Reac
Reac [12] es una lib e ´ıa de Ja aSc ip decla a i a y basada en componen es
desa ollada po Facebook bajo licencia MIT, que pe mi e desa olla in e aces
de usua io de o ma ´apida, sencilla y escalable a cos a de una cu a conside able
de ap endizaje pa a un desa ollado inexpe o.
Reac engloba la isi´on de una p´agina web como un conjun o de componen-
es peque˜nos que in e ac ´uan en e s´ı, cada uno de ellos iene su p opio es ado, el
cual se al e a seg´un el usua io a in e ac uando con la p´agina web. En base a es o
esal a la p incipal ca ac e ´ıs ica de Reac que es la e iciencia de ac ualizaci´on de
los componen es median e su mo o de seguimien o, el cual man iene un segui-
mien o de los dis in os componen es que exis an en la p´agina web y solo ac ualiza
aquellos cuyo es ado in e no cambia, sin necesidad de e esca la p´agina en e a.
Al se basado en componen es, Reac aplica el pa ´on de dise˜no Composi e Pa -
e n [13], en el cual los componen es se an englobando unos den o de o os
o mando al inal un ´unico componen e global, pe o abs ayendo al p og amado
de ene que ealiza la composici´on global. Como consecuencia de lo an e io ,
es ´acil escala la aplicaci´on y eu iliza componen es en dis in as pa es de la
aplicaci´on sin necesidad de ol e a p og ama los.
68 CAP´
ITULO 5. DISE ˜
NO E IMPLEMENTACI ´
ON DEL SISTEMA
esquema de la a qui ec u a comple a del sis ema se puede obse a en la imagen
5.1
Figu a 5.1: Esquema de la a qui ec u a del sis ema
El sis ema en su conjun o es una aplicaci´on independien e de la pla a o ma
ejecu ada sob e un na egado web cualquie a (Google Ch ome, Fi e ox, Sa a i...),
el clien e web con end ´a la in e az web con que el usua io in e ac ´ua pa a la c ea-
ci´on de plan illas e in o mes. Median e es a opci´on se pe mi e la conexi´on de un
n´ume o inde e minado de clien es al se ido .
Cie as acciones del clien e eque i ´an apoyo del se ido , es as acciones se in o-
can u ilizando el p o ocolo de comunicaci´on HTTP pa a in oca las acciones de
una API REST que el se ido expone.
El se ido es a ´a ejecu ´andose en una m´aquina independien e del clien e y es a ´a
p og amado en NodeJS, como se ha dicho an es el se ido expond ´a una API
REST con los se icios web de manipulaci´on de plan illas o imp esi´on de in o mes.
Finalmen e el se ido se comunica ´a con un con enedo de Docke de una base
de da os MongoDB pa a almacena , ex ae o manipula cualquie da o que los
clien es necesi en.
5.1.2. A qui ec u a global
En el ni el m´as al o de abs acci´on enemos la a qui ec u a comple a del sis e-
ma, es e dise˜no pe mi e ob ene una isi´on ´apida de los componen es p incipales

5.1. DISE ˜
NO DE LA ARQUITECTURA DEL SISTEMA 69
que o man el sis ema sin necesidad de en a en de alle de como es ´a cons uido
cada uno de ellos a ni el de implemen aci´on.
Figu a 5.2: A qui ec u a de al o ni el del sis ema
En la igu a 5.2 se mues a un diag ama de a qui ec u a de al o ni el, en el
que se mues an los componen es de mayo al o ni el que o man la aplicaci´on.
El equisi o RNF-01 es ablece que la aplicaci´on debe de se Web, po lo an o
uno de los componen es p imigenios que o ma ´an la aplicaci´on se ´a la in e az
de usua io, que es a ´a p og amada como una aplicaci´on web.
Adicionalmen e el equisi o RNF-03 es ablece que es necesa io la u ilizaci´on
de se icios web pa a implemen a el lado se ido , po lo an o se puede ex ae
que o o componen e p imigenio que o ma ´a la aplicaci´on se ´a el Back end (Ca-
pa de se icios) que es a ´a p og amado como una API en Node.js.
La API del se ido expond ´a se icios web que consumi ´a la aplicaci´on web
pa a cumpli con las uncionalidades de manipulaci´on de plan illas que han sido
con empladas en la ase de equisi os, como gua dado, ca ga o bo ado, adicional-
men e p opo ciona ´a sopo e pa a ealiza la imp esi´on de in o mes en o ma o
PDF, al como es ablece el equisi o RNF-06 que indica que el PDF se debe
gene a median e el uso de Phan omJS.
En base a lo an e io y al equisi o RNF-05, que indica que es necesa io el
uso de una base de da os NoSQL documen al, se ex ae el ´ul imo componen e
p imigenio de la aplicaci´on, la base de da os MongoDB, es a base de da os se ´a
la u ilizada po el se ido pa a gua da y ex ae da os que la aplicaci´on web
demande con llamadas a se icios web.
Adicionalmen e se indica que el en o no en el que se ejecu an an o el se i-
do , como la aplicaci´on web es Node.js, mien as que la base de da os MongoDB
70 CAP´
ITULO 5. DISE ˜
NO E IMPLEMENTACI ´
ON DEL SISTEMA
es a ´a con enida en un con enedo de Docke pa a acili a la mo ilidad de la
base de da os.
Vis o los componen es p imigenios, o de m´as al o ni el, se p ocede a analiza
cada uno de ellos bajando el ni el de abs acci´on, de allando su composici´on in-
e na en mayo de alle y las dependencias ex e nas o in e nas que p esen en en
su composici´on.
5.1.3. A qui ec u a del clien e web
Como se puede obse a en la igu a 5.3 que iene a con inuaci´on, la a qui-
ec u a del clien e web se compone de un paque e p incipal, Layou P incipal, en
es e paque e se in eg an paque es m´as peque˜nos y espec´ı icos que componen en
su conjun o la aplicaci´on.
Figu a 5.3: A qui ec u a de la aplicaci´on web
5.1. DISE ˜
NO DE LA ARQUITECTURA DEL SISTEMA 71
Los paque es que in eg an el Layou P incipal son:
Panel de componen es: Con iene el panel de los componen es que se
pueden a˜nadi a la plan illa.
Componen es: Con iene aquellos componen es uncionales que se a˜naden
y modi ican en la plan illa.
Va iables: Con iene odo lo ela i o a la secci´on de a iables y uen es de
da os que se ca gan en el in o me.
Ba a de ope aciones CRUD: Con iene odo lo ela i o a las acciones
de c eaci´on, gua dado, ca ga y bo ado de plan illas.
Paneles de edici´on: Con iene paneles de edici´on asociados a cada ipo de
componen e que se a˜nada a la plan illa.
Ba a de na egaci´on: Con iene las dis in as secciones de la p´agina.
Edi o : Con iene el layou donde es ´a si uada la plan illa que se es ´a edi an-
do, con end ´a odas las ope aciones l´ogicas pa a o ganiza los componen es
que se si ´uen.
Todos es os componen es de meno ama˜no se in eg an median e composici´on en
el componen e p incipal App, de modo que al inal queda ´a un ´unico componen e
que in eg e odos los dem´as.
Adicionalmen e, el paque e Layou P incipal depende de lib e ´ıas o componen es
adicionales pa a ealiza sus uncionalidades, dichas lib e ´ıas o componen es es ´an
indicados en el diag ama median e el colo ama illo, los componen es ex e nos
son los siguien es:
Reac : Lib e ´ıa de Reac , la aplicaci´on basa su uncionamien o en es a
lib e ´ıa.
Momen : Lib e ´ıa u ilizada pa a o ma ea echas como cadenas de ex o.
Reac DnD: Lib e ´ıa pa a implemen a D ag and D op en Reac .
JSONPa h: Lib e ´ıa pa a hace consul as de u as a obje os en o ma o
JSON.
An Desing F amewo k: F amewo k de CSS pa a Reac , la aplicaci´on
u iliza sus componen es pa a da uncionalidad a la in e az.
Reacha s.js: Lib e ´ıa pa a ep esen aci´on de g ´a icas.
72 CAP´
ITULO 5. DISE ˜
NO E IMPLEMENTACI ´
ON DEL SISTEMA
DownloadJS: Lib e ´ıa pa a ejecu a desca gas de a chi os en el lado clien-
e.
TypeSc ip : Compilado de TypeSc ip , aduce el c´odigo esc i o en Ty-
peSc ip a c´odigo Ja aSc ip ejecu able po el na egado .
Los componen es an e io es en conjun o con el paque e Layou P incipal pe -
mi en el uncionamien o in eg al de la aplicaci´on, siendo de es e modo necesa ios
pa a que es a pueda unciona de o ma co ec a.
5.1.4. A qui ec u a del se ido
En la igu a 5.4 si uada a con inuaci´on se mues a la a qui ec u a del se ido ,
en su conjun o el se ido es ´a o mado po un ´unico m´odulo, el M´odulo de
se icios web, que incluye odos los se icios web que la aplicaci´on puede in oca
pa a ealiza sus uncionalidades.
Figu a 5.4: A qui ec u a del se ido
5.1. DISE ˜
NO DE LA ARQUITECTURA DEL SISTEMA 73
El M´odulo de se icios web a su ez es ´a di idido en dos m´odulos, el M´odulo
de se icios de imp esi´on y el M´odulo de se icios de plan illas.
El M´odulo de imp esi´on con iene odos los se icios ela i os a la imp esi´on de
a chi os en o ma o PDF, de modo que se ´a el enca gado de ealiza las llamadas
a Phan omJS.
El M´odulo de se icios de plan illas incluye los se icios pa a c ea , ob ene ,
modi ica y bo a plan illas, el clien e ha ´a uso de es e m´odulo pa a gua da las
plan illas, modi ica las o bo a las, de modo que es e m´odulo se ´a el que in e -
ac ´ue con las base de da os MongoDB median e el uso de la API de Mongoose.
Ambos m´odulos se ´an in eg ados median e composici´on en el componen e p in-
cipal App, que b´asicamen e se ´a un en u ado de se icios, pues en el se colga ´an
dis in os endpoin s de se icios, de modo que se ´a ´acil a˜nadi m´as se icios al
lado se ido en caso de se necesa io.
Las dependencias del M´odulo de se icios web son las siguien es:
Exp ess.js: Lib e ´ıa de Exp ess.js, la API basa su uncionamien o en es e
amewo k, p opo ciona oda clase de uncionalidades y obje os pa a c ea
se icios.
Co s: Lib e ´ıa que pe mi e el uso de CORS (C oss O igin Resou ce
Sha ing), de modo que el se ido puede ealiza llamadas a o os o ´ıgenes
dis in os pa a ob ene ecu sos.
Mongoose: Lib e ´ıa que p opo ciona ope aciones pa a abaja con la base
de da os MongoDB desde Ja aSc ip .
Phan om: Lib e ´ıa que expone una API de uso sencillo pa a abaja con
Phan omJS desde Ja aSc ip .
Phan omJS: Na egado sin in e az g ´a ica que puede se ejecu ado po
el se ido pa a a eas de man enimien o, imp esi´on o na egaci´on ´apida.
BodyPa se : Usado po Exp ess.js pa a aduci el cue po de pe iciones
HTTP.
CookiePa se : Usado po Exp ess.js pa a aduci cookies de pe iciones
HTTP.
Las lib e ´ıas an e io es en conjun o con los dos m´odulos de se icios o man
el se ido al que el clien e ha ´a pe iciones median e el uso de se icios web pa a
in oca ope aciones de manipulaci´on de plan illas o imp esi´on de in o mes.

74 CAP´
ITULO 5. DISE ˜
NO E IMPLEMENTACI ´
ON DEL SISTEMA
5.2. Pa ones a qui ec ´onicos
En es a secci´on se indican los pa ones a qui ec ´onicos u ilizados a la ho a de
desa olla el sis ema.
5.2.1. A qui ec u a o ien ada a se icios
El sis ema es a ´a basada en una a qui ec u a o ien ada a se icios, es o im-
plica que se di idi ´a la pa e clien e ( on end) de la pa e se ido (back end),
el se ido expo a ´a un conjun o de uncionalidades como se icios web que el
clien e u iliza ´a como apoyo pa a p opo ciona una mejo expe iencia al usua io.
Es a a qui ec u a pe mi e desacopla el clien e del se ido , de modo que se
aumen a la escalabilidad y man enimien o del mismo, adem´as pe mi e u iliza
lenguajes de p og amaci´on dis in os an o en el clien e como en el se ido al
u iliza el p o ocolo HTTP pa a ealiza la comunicaci´on en e ambas pa es.
5.2.2. Flux
Flux es una al e na i a al modelo MVC 1 adicional u ilizado en desa ollo
web, es e pa ´on a qui ec ´onico es u ilizado po Reac pa a es uc u a los com-
ponen es de la aplicaci´on y el modo en el que ellos in e ac ´uan.
Flux se basa en una es icci´on, y es que el e lujo de da os de la aplicaci´on
solo puede ci cula en una di ecci´on, es o se log a median e la de inici´on de es
componen es p incipales: s o e, iew componen ydispa che .
Cada s o e con iene de e minados da os que ep esen an la l´ogica de negocio
de la aplicaci´on, es os da os son ep esen ados po uno o a ios iew componen ,
adicionalmen e un iew componen puede ex ae da os de a ios s o es, si un
iew componen u iliza un s o e cualquie a se susc ibe a el.
Cuando se ejecu a una acci´on en un iew componen que implica la modi ica-
ci´on de los da os almacenados en uno o a ios s o es, es e ealiza una llamada al
dispa che , (solo exis e un dispa che en la aplicaci´on) el dispa che iden i ica la
acci´on y modi ica el o los s o es a ec ados po el cambio.
Al cambia un s o e, los iew componen que es aban susc i os a dichos s o es
sea ac ualizan pa a e leja dichos cambios.
1Modelo Vis a Con olado : Pa ´on a qui ec ´onico que di ide la aplicaci´on en Modelos
de da os que con ienen la l´ogica de negocio, is as que ep esen an dichos da os y con olado es
que de inen que is a se ep esen a.
5.3. MODELO DE DATOS 75
Es o pe mi e que no exis an complicaciones a la ho a de escala la aplicaci´on
ya que hace muy p edecible el lujo de da os de la misma.
5.3. Modelo de da os
En es a secci´on se especi ica la in o maci´on que se almacena en la base de
da os que u iliza el sis ema, pues o que es a base de da os es NoSQL, el modelo
de da os no es a ´a cons i uido de ablas y de elaciones en e dichas ablas, si no
de documen os, pues o que la base de da os elegida es MongoDB.
La in o maci´on que se almacena en cada documen o es un obje o Plan illa, dicho
obje o es ´a compues o po los siguien es campos:
Nomb e: El nomb e que el usua io ha dado a la plan illa (Tipo s ing).
Ve si´on: La e si´on que el usua io ha seleccionado pa a la plan illa (Tipo
s ing).
Va iables: Conjun o de a iables que o man pa e de la plan illa (Tipo
A ay<objec >)
Componen es: Conjun o de componen es que o man la plan illa (Tipo
A ay<objec >)
Las a iables de una plan illa son un conjun o de obje os o denados en un a ay,
cada obje o del a ay ep esen a una a iable y sus campos a ´ıan dependiendo
de si la a iable es de ipo ex o o si es una uen e de da os, los campos posibles
que iene una a iable son los siguien es:
Nomb e: Nomb e que el usua io ha dado a la a iable (Tipo s ing)
Tipo: Tipo de a iable (Tipo s ing con olado po enume ado)
Ru a JSON: Ru a de mapeo de JSON (Tipo s ing ounde ined)
P opiedad de e ique as (Columnas): Ru a del JSON pa a ob ene las
e ique as de las columnas (Tipo s ing ounde ined) [Solo en a iable TA-
BLE DATA SOURCE]
Unidad del eje X: De ine la unidad del eje X (Tipo s ing ounde ined)
[Solo en a iable SCATTER DATA SOURCE]
Unidad del eje Y: De ine la unidad del eje Y (Tipo s ing ounde ined)
[Solo en a iable SCATTER DATA SOURCE]
Nomb e del eje X: De ine el nomb e del eje X (Tipo s ing ounde ined)
[Solo en a iable SCATTER DATA SOURCE]
76 CAP´
ITULO 5. DISE ˜
NO E IMPLEMENTACI ´
ON DEL SISTEMA
Nomb e del eje Y: De ine el nomb e del eje Y (Tipo s ing ounde ined)
[Solo en a iable SCATTER DATA SOURCE]
Opacidad de se ies: De ine la opacidad de cada se ie (Tipo A ay<numbe >
ounde ined) [Solo en a iables POLAR DATA SOURCE]
Colo de la se ies: De ine el colo de cada se ie (TIpo A ay<s ing>oun-
de ined) [Solo en a iables CARTESIAN DATA SOURCE, POLAR DATA SOURCE
y SCATTER DATA SOURCE]
Los dis in os ipos de a iables es ´an con oladas po el siguien e enume ado:
STRING: La a iable es una cadena de ex o
NUMBER: La a iable es un alo num´e ico
DATE: La a iable es una echa en o ma o HH:MM (Ho a y minu o)
DATE DD MM Y: La a iable es una echa en o ma o DD/MM/AAAA
(D´ıa, mes, a˜no)
DATE MM DD Y: La a iable es una echa en o ma o MM/DD/AAAA
(Mes, d´ıa, a˜no)
LIST DATA SOURCE: La a iable es una uen e de da os de una lis a
TABLE DATA SOURCE: La a iable es una uen e de da os de una
abla
CARTESIAN DATA SOURCE: La a iable es una uen e de da os de
una g ´a ica ca esiana
POLAR DATA SOURCE: La a iable es una uen e de da os de una
g ´a ica pola
SCATTER DATA SOURCE: La a iable es una uen e de da os de una
g ´a ica de dispe si´on
Los componen es de una plan illa es ´an o denados en un a ay de obje os, el
o den en el que es ´en si uados los componen es dic amina su o den de apa ici´on
en la plan illa, adicionalmen e cada componen e puede ene den o o os com-
ponen es, es o se puede aplica de o ma ecu si a.
Los campos de un componen e de la plan illa son los siguien es:
Tipo: Tipo de componen e (Tipo s ing con olado po enume ado)
Pad e: Componen e pad e (Tipo objec ounde ined)
5.4. DISE ˜
NO DE CLASES 77
Hijos: Componen es hijos (Tipo A ay<objec >ounde ined)
Es ado: Es ado del componen e (Tipo objec )
Los dis in os ipos de componen es es ´an con olados po el siguien e enume ado:
ROW: Componen e ila
COL: Componen e columna
TITLE: Componen e ´ı ulo
PARAGRAPH: Componen e pa ´ag a o
TABLE: Componen e abla
IMAGE: Componen e image
GRID: Componen e malla
LIST: Componen e lis a
CARTESIAN CHART: Componen e g ´a ica ca esiana
POLAR CHART: Componen e g ´a ica pola
SCATTER CHART: Componen e g ´a ica de dispe si´on
5.4. Dise˜no de clases
Los diag amas de clases o ecen un ni el de abs acci´on meno que los dia-
g amas de a qui ec u a al ep esen a la es uc u aci´on y comunicaci´on de los
elemen os de la aplicaci´on que se encuen en desc i os en el diag ama.
Es po ello que se suelen o ien a m´as a los desa ollado es de la aplicaci´on o
a pe sonas con mayo ni el ´ecnico, ambi´en ienden a modi ica se nume osas
eces seg´un la ase de desa ollo p og esa, pues los de alles de implemen aci´on
suelen a ia el dise˜no de clases inicial.
Los diag amas de clases que se ep esen an a con inuaci´on se asocian con los
m´odulos con emplados en los diag amas de a qui ec u a an e io es.
5.4.1. Diag amas de paque es
A con inuaci´on se de alla la es uc u aci´on de las clases a ni el de paque e
an o pa a el lado se ido como pa a el lado clien e.
84 CAP´
ITULO 5. DISE ˜
NO E IMPLEMENTACI ´
ON DEL SISTEMA
plan illas, adem´as de las imp esi´on de in o mes.
En la igu a 5.9 se ap ecia la p esencia de la clase CRUDComponen , es e com-
ponen e es el que ep esen a ´a la ba a de ope aciones CRUD e imp esi´on de
plan illas, po ese mo i o en su in e az se incluyen unciones pa a con oca es as
ope aciones desde el componen e App.
Figu a 5.9: Diag ama de clases del paque e CRUDPanel
A su ez, la clase CRUDComponen es ´a compues a de o as dos clases, Tem-
pla eModal yNewTempla eModal, es as clases ep esen an Modals que se mues-
an en la pan alla cuando el usua io ejecu a acciones en la ba a de ope aciones

5.4. DISE ˜
NO DE CLASES 85
CRUD.
La clase NewTempal eModal se co esponde con el Modal que se mues a cuando
el usua io ejecu a la acci´on de c ea una plan illa nue a.
La clase Templa eModal se co esponde con la lis a de pan illas gua dadas en
la base de da os que el usua io puede ca ga o bo a cuando ejecu a la acci´on
de ca ga plan illa exis en e.
Paque e Layou Componen s
El paque e Layou Componen s con iene los clases de los componen es que se
compond ´an un in o me, es e paque e es el m´as complejo y m´as g ande de oda
la aplicaci´on pues o que incluye oda clase de casu´ıs icas espec´ı icas pa a cada
componen e imposibili ando de modo ex ae je a qu´ıas es ables de clases.
En la igu a 5.10 y 5.11 se mues a la je a qu´ıa m´as elemen al que se pue-
de ex ae de odos los componen es, la clase Abs ac Componen he eda de
Reac .Componen y p opo ciona un m´e odo abs ac o llamado se Edi PanelCon-
en , el cual se ´a u ilizado po cada componen e pa a c ea su panel de edici´on
en el men´u de echo de la aplicaci´on.
Figu a 5.10: Diag ama de clases del paque e Layou Componen s (1)
86 CAP´
ITULO 5. DISE ˜
NO E IMPLEMENTACI ´
ON DEL SISTEMA
Figu a 5.11: Diag ama de clases del paque e Layou Componen s (2)
Pos e io men e cada componen e implemen a dos in e aces, una pa a el es-
ado y o as pa a sus p opiedades, pa e de los a ibu os de las p opiedades de
un componen e son comunes a los a ibu os de su es ado, es o es debido a que
las p opiedades no se pueden mu a y el es ado si, po lo an o pa a c ea un
componen e exis en e es necesa io pasa odas las p opiedades que pe mi an e-
cons ui su es ado o iginal.
Los componen es p incipales que in eg an es e paque e son los siguien es:
Ti leComponen : Componen e que ep esen a un ´ı ulo o encabezado de
documen o, incluye opciones pa a edi a su con enido, posici´on del ex o,
ipo de encabezado seg´un las e ique as de HTML H1 a H6, y opciones de
uen e como neg i a, sub ayado y cu si a.
Pa ag aphComponen : Componen e que ep esen a un p´a a o, incluye
opciones pa a edi a su con enido, posici´on de ex o y opciones de uen e
como neg i a, sub ayado o cu si a.
ImageComponen : Componen e que ep esen a una imagen en el docu-
men o, incluye opciones pa a subi una imagen desde almacenamien o local
5.4. DISE ˜
NO DE CLASES 87
a la aplicaci´on, modi ica la al u a y modi ica el ancho de la imagen.
G idComponen : Componen e que ep esen a una malla de celdas no
o denadas, solo incluye opciones pa a a˜nadi celdas (G idCell).
G idCell: Componen e que ep esen a una celda de una malla de celdas no
o denadas, incluye opciones pa a edi a el con enido de la celda, de ini la
posici´on del ex o de la celda o opciones de uen e como neg i a, sub ayado
y cu si a. Adicionalmen e cuen a con opciones pa a modi ica el ama˜no,
an o al o como ancho de la celda adem´as de cambia el o den en el que se
encuen a dicha celda.
Lis Componen : Componen e que ep esen a una lis a de elemen os, in-
cluye opciones pa a a˜nadi , qui a y modi ica elemen os de la lis a a o-
lun ad, adem´as pe mi e edi a la posici´on del ex o y cuen a con opciones
de uen e como neg i a, sub ayado y cu si a. Tambi´en cuen a con la opci´on
de de ini si la lis a es o denada o no o denada, habili ando dis in os ipos
de encabezados pa a cada elemen o de la lis a. Finalmen e cuen a con la
opci´on de de ini la lis a como din´amica pa a gene a su con enido desde
una uen e de da os ca gada desde JSON.
TableComponen : Componen e que ep esen a una abla de da os, in-
cluye opciones pa a a˜nadi , modi ica y bo a columnas o ilas, pe mi e
cambia el o den de las ilas y columnas a olun ad. Es e componen e in-
cluye la opci´on de de ini se como din´amico, de modo que su con enido se
ca ga desde una uen e de da os.
Ca esianCha : Componen e que ep esen a una g ´a ica ca esiana mix-
a, de modo que pe mi e la ep esen aci´on combinada de se ies como ba as,
´a eas y lineas. Es e componen e pe mi e a˜nadi , modi ica y bo a se ies
de da os, adicionalmen e cuen a con opciones adicionales como ac i a o
desac i a la leyenda, ejes de coo denadas y la malla ca esiana. Cuen a
con la opci´on de de ini se como g ´a ica din´amica pa a ca ga las se ies de
da os desde una uen e de da os.
Pola Cha : Componen e que ep esen a una g ´a ica pola , pe mi e al e a
en e dos ipos de g ´a icas, la g ´a ica de sec o es y la g ´a ica de ada o
spide -web. Incluye opciones pa a a˜nadi , modi ica y bo a se ies de da os
adem´as de opciones adicionales pa a ac i a o desac i a la leyenda, malla
pola y mues a del adio de la g ´a ica. Cuen a con la opci´on de de ini se
como g ´a ica din´amica pa a ca ga se ies de da os desde una uen e de da os.
BubbleCha : Componen e que ep esen a una g ´a ica de dispe si´on en
dos a iables, pe mi e la c eaci´on, modi icaci´on y bo ado de se ies de da os,
incluye opciones pa a ac i a o desac i a la leyenda, malla ca esiana o ejes
88 CAP´
ITULO 5. DISE ˜
NO E IMPLEMENTACI ´
ON DEL SISTEMA
de coo denadas. Cuen a con la opci´on de de ini se como g ´a ica din´amica
pa a ca ga se ies de da os desde una uen e de da os.
Las acciones que modi ican un componen e se ejecu an desde su co espondien e
panel de edici´on, si uado en el paque e P opsPanels.
Paque e P opsPanels
El paque e P opsPanels con iene los componen es que ep esen an los pane-
les de edici´on de cada ipo de componen e que se pueda ep esen a en la pa e
cen al de la aplicaci´on.
En la igu a 5.12 y 5.13 se mues an las dis in as clases que con o man es e pa-
que e de componen es, como se puede obse a exis e un panel (una clase), po
cada componen e que se puede ep esen a en la pa e cen al de la aplicaci´on.
Figu a 5.12: Diag ama de clases del paque e P opsPanels (1)
5.4. DISE ˜
NO DE CLASES 89
Figu a 5.13: Diag ama de clases del paque e P opsPanels (2)
En esumen los componen es que o man es e paque e son los siguien es:
Ti leEdi Panel: Componen e que ep esen a el panel de edici´on de un
´ı ulo, con iene odas las acciones y llamadas a unciones pa a modi ica el
es ado del componen e ´ı ulo con el que es ´a inculado, incluy´endose las
opciones de ex o o con enido del mismo.
Pa ag aphEdi Panel: Componen e que ep esen a el panel de edici´on de
un p´a a o, con iene odas las acciones y llamadas a unciones pa a modi i-
ca el es ado del componen e p´a a o con el que es ´a inculado, incluy´endose
las opciones de ex o o con enido del mismo.
ImagenEdi Panel: Componen e que ep esen a el panel de edici´on de una
imagen, con iene las opciones pa a modi ica el al o y ancho de la imagen
adem´as de subi una imagen desde almacenamien o local, odo es o me-
dian e ealizaci´on de llamadas a unciones del componen e imagen con el
que es ´a inculado.
G idEdi Panel: Componen e que ep esen a un panel de edici´on de una
malla de celdas, con iene opciones pa a a˜nadi m´as celdas a la malla.
Lis Edi Panel: Componen e que ep esen a un panel de edici´on de una lis-
a de elemen os, con iene opciones pa a a˜nadi , bo a y edi a los elemen os

90 CAP´
ITULO 5. DISE ˜
NO E IMPLEMENTACI ´
ON DEL SISTEMA
de la lis a inculada, ambi´en pe mi e de ini el ipo de lis a (o denada o
no o denada) adem´as de edi a las p opiedades de ex o de los elemen os y
el encabezado de cada elemen o de la lis a, adem´as pe mi e de ini la lis a
como din´amica seleccionando la uen e de da os desde la que se ob end ´an
los da os que ep esen a ´a la lis a.
TableEdi Panel: Componen e que ep esen a un panel de edici´on de una
abla, con iene opciones pa a a˜nadi ilas y columnas nue as, pe mi e de ini
la abla inculada como din´amica y selecciona la uen e de da os que se
ca ga ´a en ella.
Ca esianEdi Panel: Componen e que ep esen a un panel de edici´on de
una g ´a ica ca esiana, con iene opciones pa a a˜nadi y bo a se ies de
da os, adem´as de pe mi i edi a su con enido y colo , pe mi e adem´as
de ini la g ´a ica inculada como din´amica y selecciona la uen e de da os
que se ca ga ´a en ella.
Pola Edi Panel: Componen e que ep esen a un panel de edici´on de una
g ´a ica pola , con iene opciones pa a a˜nadi y bo a se ies de da os, adem´as
de pe mi i edi a su con enido, colo y opacidad, pe mi e adem´as seleccio-
na el ipo de g ´a ica pola (sec o es o ada ) y de ini la g ´a ica inculada
como din´amica seleccionado la uen e de da os que ca ga ´a los da os en ella.
BubbleEdi Panel: Componen e que ep esen a un panel de edici´on de una
g ´a ica de dispe si´on, con iene opciones pa a a˜nadi y bo a se ies de da os,
adem´as de pe mi i edi a su con enido, colo y o ma de ep esen aci´on de
los pun os, ambi´en pe mi e de ini la g ´a ica inculada como din´amica
seleccionado la uen e de da os desde la que se ca ga ´an los da os.
Paque e Va sSec ion
El paque e Va sSec ion con iene los componen es que ep esen an las secci´on
de de inici´on y manipulaci´on de a iables y uen es de da os de la aplicaci´on.
En la igu a 5.14 se mues an las clases que o man el paque e, la cons ucci´on de
es a secci´on se basa en la u ilizaci´on del componen e Va sLayou como n´ucleo de
la secci´on, de modo que las dis in as pa es que componen es a secci´on se in e-
g an en el como un componen e m´as ejecu ando cada una sus uncionalidades de
o ma au ´onoma pe o pasando siemp e po el componen e n´ucleo pa a ealiza
modi icaciones en las o as pa es de la aplicaci´on.
5.4. DISE ˜
NO DE CLASES 91
Figu a 5.14: Diag ama de clases del paque e Va sSec ion
Es e paque e eemplaza ´a la secci´on cen al de la aplicaci´on cuando el usua io
cambie de secci´on, de modo que los paneles de edici´on y c eaci´on de componen es
se ocul a ´an has a que el usua io decida ol e a la is a del edi o .
Las clases que o man es e paque e son las siguien es:
Va sLayou : Componen e n´ucleo de la secci´on, en ella se in eg an odos
los dem´as componen es que o man la secci´on.
JSONLoade : Componen e que ges iona la ca ga de JSON en la aplica-
ci´on, ambi´en ges iona que JSON se es ´a u ilizando en ese momen o, en caso
de que el usua io ealice una ca ga m´ul iple de JSONs en la aplicaci´on.
Va sDisplay: Componen e que mues a las a iables ya decla adas en la
aplicaci´on, pe mi iendo elimina cualquie a que ya no sea necesa ia.
Va sC ea o : Componen e que se enca ga de c ea nue as a iables a pe-
ici´on del usua io, pe mi e de ini el nomb e y el ipo de la a iable que se
a a c ea .
Va sMappe : Componen e que se enca ga de ealiza el mapeado de una
u a de JSON a una a iable, adem´as de pe mi i de ini opciones adicio-
nales dependiendo del ipo de a iable que se es ´e edi ando, las dis in as
92 CAP´
ITULO 5. DISE ˜
NO E IMPLEMENTACI ´
ON DEL SISTEMA
a iables que se ep esen an en es e componen e es ´an ag upadas en Va s-
Mappe I em que son las enca gadas de ges iona indi idualmen e la a iable
que engan inculada.
Va iable: Clase que ep esen a la es uc u a de da os de una a iable,
incluye oda clase de a ibu os pa a de ini el nomb e, u a del JSON y ipo.
Adicionalmen e incluye oda clase de a ibu os opcionales que dependiendo
del ipo que enga la a iable son cubie os o no desde el Va sMappe .
Va sTypes: Enum que indica los dis in os ipos de a iables que se pueden
de ini en el Va sC ea o , dependiendo del ipo de a iable que se de ina se
ac i a an unas opciones o o as en elVa sMappe .
Paque e Repo Layou
El paque e Repo Layou con iene los componen es que ep esen an la pa e
cen al de la aplicaci´on, aquella donde se ep esen an los componen es del paque-
e Layou Componen s.
En la igu a 5.15 se mues an las clases que con o man es e paque e, el en oque de
cons ucci´on de la composici´on de es e paque e iene dado po la ep esen aci´on
adicional de una abla, de modo que se di ide el layou en ilas y es as a su
ez en columnas, los componen es se in oducen en las columnas y el ama˜no que
ocupan es a ´a de e minado po el ama˜no de la columna.
5.4. DISE ˜
NO DE CLASES 93
Figu a 5.15: Diag ama de clases del paque e Repo Layou
La clase p incipal es Repo Layou , es a iene como ´unico come ido la c eaci´on
y eliminaci´on de ilas de componen es en la plan illa que se es ´a gene ando, las
ilas es ´an ep esen adas median e la clase Repo Row.
La clase Repo Row se subdi ide en columnas y se enca ga de ges iona el ama˜no
que ocupa cada una de ellas, de modo que ninguna de ellas exceda el m´aximo
ama˜no que iene asignada la ila, ambi´en ges iona la eliminaci´on de columnas.
La clase Repo Column es la que ep esen a una columna en la plan illa, su co-
me ido es gua da el componen e que se desea mos a en la plan illa, se modo
que se enca ga de cons ui lo cuando ecibe un e en o de la API de D ag and
D op. Es e componen e ambi´en puede pasa se a la API de D ag and D op de
modo que se puede a as a pa a cambia lo de posici´on en la plan illa.
5.4.3. Dise˜no de clases del se ido
En dise˜no de las clases del se ido es m´as sencillo que el del clien e, pues en
el simplemen e se gene an una se ie de endpoin s que in ocan se icios REST,
es os se icios u ilizan po debajo uncionalidades ya implemen adas de o os pa-
que es, como Mongoose pa a abaja con la base de da os MongoDB o Phan om
100 CAP´
ITULO 5. DISE ˜
NO E IMPLEMENTACI ´
ON DEL SISTEMA
5.6. Dise˜no de in e az de usua io
En es a secci´on se mues an los dis in os dise˜nos que se han ealizado de la
in e az g ´a ica.
La ealizaci´on de es os dise˜nos iene su ele ancia pa a indica le al clien e o
usua io inal de o ma abs ac a la apa iencia de la aplicaci´on jun o con los ele-
men os que la an a compone . Median e la ealizaci´on de es os dise˜nos se puede
ob ene eedback po pa e del usua io y del clien e y de es e modo mejo a el
dise˜no inicial, adem´as en caso de que el dise˜no no sa is aga las demandas del clien-
e se puede ec i ica con su icien e cele idad como pa a que el p oyec o no acase.
Los dise˜nos iniciales de la in e az se ealiza on en HTML5 y CSS pues o que
se cuen a con expe iencia y conocimien o su icien e de ambas ecnolog´ıas como
pa a c ea los de o ma ´apida, adem´as se pueden eu iliza los componen es que
se c een en u u as e siones de la aplicaci´on.
Se c ea on dos dise˜nos de la in e az, uno inicial muy b´asico que solo in en aba
e leja la idea gene al de la aplicaci´on y uno comple o en el que se ep esen aban
sin uncionalidad alguna los componen es que o ma ´ıan la aplicaci´on.
La e si´on de la in e az ep esen ada en al igu a 5.20 ue la p ime a c eada
pa a su e aluaci´on po pa e del clien e, la in e az c eada es minimalis a y sen-
cilla pues o que su ´unico p op´osi o e a mos a la idea de disposici´on de los
componen es que o man la aplicaci´on jun o con el p op´osi o de cada uno de
ellos.
Figu a 5.20: Ve si´on minimalis a de la in e az de la aplicaci´on

5.6. DISE ˜
NO DE INTERFAZ DE USUARIO 101
En es e dise˜no inicial simplemen e se mos aba una idea inicial y gene al de
como se ´ıa la aplicaci´on, con un panel de componen es en la pa e izquie da y un
men´u de na egaci´on en la pa e supe io pa a cambia de secci´on, los elemen os
c eados se mos a ´ıan en la pa e cen al de la aplicaci´on y se edi a ´ıan en esa
misma pa e.
En base a ese dise˜no se ob u o eedback del clien e y se aplica on mejo as y
cambios al dise˜no minimalis a, las ideas se han basado en el boce o de disposi-
ci´on de elemen os ep esen ado en la igu a 5.21. En base a es e boce o se c e´o una
e si´on nue a y m´as a anzada de la in e az que inclu´ıa odos los componen es
si uados de la misma mane a que en el boce o.
Figu a 5.21: Boce o de la disposici´on de los elemen os en la in e az comple a
En la siguien e e si´on de la in e az se aplica on mejo as de usabilidad al
dise˜no inicial, como uso de colo es m´as cla os pa a el con enido gene al y colo es
102 CAP´
ITULO 5. DISE ˜
NO E IMPLEMENTACI ´
ON DEL SISTEMA
oscu os pa a con enido impo an e a esal a , di isi´on de los men´us en paneles
plegables y aslado de las opciones de edici´on de los componen es al men´u de e-
cho en ez de edi a las en la pa e cen al de la aplicaci´on.
Como consecuencia de lo an e io se ob u o el dise˜no de la in e az p esen e
en la igu a 5.22.
Es e dise˜no con enci´o m´as al clien e po lo que se p ocedi´o a desa olla las
uncionalidades de la aplicaci´on en o no a es e dise˜no de in e az.
Figu a 5.22: Ve si´on comple a de la in e az de la aplicaci´on
Cap´ı ulo 6
Validaci´on y p uebas
En es a secci´on se indican las dis in as p uebas que se han ealizado con a el
so wa e que se ha desa ollado a lo la go de es e p oyec o.
Es a ase iene dos obje i os p incipales:
Comp oba que el so wa e p og amado unciona co ec amen e an e las
en adas y salidas con empladas y no con empladas en sus algo i mos y
o mula ios, m´as conocido como ase de e i icaci´on.
Comp oba que el so wa e cons uido cumple con las expec a i as del clien-
e, es o es, que el so wa e esuel e el p oblema que el clien e ha plan eado
de o ma co ec a seg´un sus c i e ios, ambi´en conocido como ase de ali-
daci´on.
A con inuaci´on se mues an los dis in os ipos de p uebas que se han ealizado
jun o con sus esul ados.
6.1. P uebas uni a ias
Las p uebas uni a ias ienen como obje i o comp oba que cada uncionalidad
de la aplicaci´on comp obada de o ma independien e unciona seg´un lo espe ado
an e pa ´ame os ´alidos e in ´alidos, es as p uebas ienen que se lo m´as comple as
posibles, po lo que ienen que p oba la mayo can idad de c´odigo posible y el
mayo ango posible de pa ´ame os de en ada.
103
104 CAP´
ITULO 6. VALIDACI ´
ON Y PRUEBAS
ID PU-01
Desc ipci´on Se ab e la in e az web en la secci´on del edi o y se se-
lecciona la opci´on de Nue a, a con inuaci´on se indica
el nomb e de la plan illa y la e si´on y se con i ma la
c eaci´on.
Casos de uso asociados CU-04
C i e io de acep aci´on La pa e cen al de la aplicaci´on cambia al con enido de
una plan illa en blanco, adem´as el nomb e y e si´on de
la plan illa apa ecen co ec amen e en el pie de p´agina
Es ado Supe ada
ID PU-02
Desc ipci´on Se ab e la in e az web en la secci´on del edi o y se se-
lecciona la opci´on de Gua da .
Casos de uso asociados CU-05
C i e io de acep aci´on El con enido que exis e en la plan illa es con e ido a
o ma o JSON y “en iado al se ido ”.
Es ado Supe ada
ID PU-03
Desc ipci´on Se ab e la in e az web en al secci´on del edi o y se se-
lecciona una e si´on de una plan illa pa a su ca ga.
Casos de uso asociados CU-06
C i e io de acep aci´on El con enido de la pa e cen al de la aplicaci´on cambia
pa a mos a el con enido de la plan illa seleccionada,
adem´as el pie de p´agina se ac ualiza con el nomb e y
e si´on de la plan illa seleccionada.
Es ado Supe ada
ID PU-04
Desc ipci´on Se ab e la in e az web en la secci´on del edi o y se se-
lecciona la opci´on de bo ado de una plan illa exis en e.
Casos de uso asociados CU-07
C i e io de acep aci´on La plan illa es bo ada y desapa ece de la lis a pa a su
selecci´on.
Es ado Supe ada
6.1. PRUEBAS UNITARIAS 105
ID PU-05
Desc ipci´on Se ab e la in e az web y se p ocede a a as a cual-
quie componen e de ex o ( ´ı ulo, p´a a o o lis a) del
panel de componen es a la pa e cen al de la aplicaci´on
donde pos e io men e se suel a en una ila con espacio
disponible.
Casos de uso asociados CU-01
C i e io de acep aci´on Se c ea un componen e de ex o con con enido po de-
ec o en la posici´on seleccionada.
Es ado Supe ada
ID PU-06
Desc ipci´on En la secci´on de a iables se p ocede a esc ibi el nom-
b e de una a iable y selecciona cualquie a de los ipos
disponible, pos e io men e se pulsa la opci´on de a˜nadi
a iable.
Casos de uso asociados CU-08
C i e io de acep aci´on Se c ea la a iable con el nomb e y ipo seleccionado y
se a˜nade a la abla de a iables.
Es ado Supe ada
ID PU-07
Desc ipci´on En la secci´on de a iables, se pulsa el bo ´on de ca ga
JSON y se selecciona un a chi o en o ma o JSON pa a
su ca ga.
Casos de uso asociados CU-11
C i e io de acep aci´on El JSON queda ca gado en la aplicaci´on y se mues a su
con enido.
Es ado Supe ada

106 CAP´
ITULO 6. VALIDACI ´
ON Y PRUEBAS
ID PU-08
Desc ipci´on Se selecciona un componen e ya c eado en la pa e cen-
al de la aplicaci´on y se p ocede a modi ica su ama˜no
y desplazamien o jun o con sus opciones p opias de con-
enido.
Casos de uso asociados CU-02
C i e io de acep aci´on El ama˜no y desplazamien o del componen e aumen a o
se educe en base al espacio disponible y seg´un el c i-
e io indicado po el usua io, adem´as el con enido del
componen e se modi ica seg´un el c i e io del usua io.
Es ado Supe ada
ID PU-09
Desc ipci´on Se selecciona un componen e ya c eado y se pulsa en la
opci´on de bo a componen e.
Casos de uso asociados CU-03
C i e io de acep aci´on El componen e es bo ado comple amen e y queda su es-
pacio como una columna ac´ıa.
Es ado Supe ada
ID PU-10
Desc ipci´on Se selecciona una componen e lis a y se pasa su ipo
a din´amico, a con inuaci´on se selecciona una uen e de
da os de las disponibles y se pulsa en el bo ´on de ca ga .
Casos de uso asociados CU-09
C i e io de acep aci´on La lis a e leja el con enido de la uen e de da os selec-
cionada.
Es ado Supe ada
ID PU-11
Desc ipci´on En la secci´on de a iables se pulsa sob e el bo ´on de ca -
ga JSON y se seleccionan m´ul iples a chi os en o ma o
JSON pa a su ca ga.
Casos de uso asociados CU-11
C i e io de acep aci´on Se ca gan en la aplicaci´on odos los JSON ´alidos y se
mues a al usua io la lis a de cual es ´a seleccionado ac-
ualmen e.
Es ado Supe ada
6.1. PRUEBAS UNITARIAS 107
ID PU-12
Desc ipci´on Se selecciona un componen e de ex o cualquie a y se
p ocede a inse a una a iable median e la sin axis
{{nomb e de la a iable}}.
Casos de uso asociados CU-09
C i e io de acep aci´on La a iable queda inculada al ex o, po lo que se ´a e-
emplazada cuando el usua io seleccione la opci´on de e-
emplaza a iables.
Es ado Supe ada
ID PU-13
Desc ipci´on Se selecciona un componen e abla y se cambia su ipo
a din´amico, a con inuaci´on se selecciona una uen e de
da os y se pulsa el bo ´on de ca ga uen e de da os.
Casos de uso asociados CU-09
C i e io de acep aci´on El con enido de la abla se modi ica pa a ep esen a la
uen e de da os que se ca ga.
Es ado Supe ada
ID PU-14
Desc ipci´on Se selecciona un componen e g ´a ica cualquie a y se
cambia su ipo a din´amico, a con inuaci´on se selecciona
una uen e de da os y se pulsa el bo ´on de ca ga uen e
de da os
Casos de uso asociados CU-09
C i e io de acep aci´on El con enido de la g ´a ica se adap a a la uen e de da os
seleccionada.
Es ado Supe ada
ID PU-15
Desc ipci´on Con a iables a iables inculadas a componen es de
ex o y uen es de da os seleccionadas en g ´a icas y a-
blas se pulsa el bo ´on de Reemplaza a iables.
Casos de uso asociados CU-10
C i e io de acep aci´on Las a iables inculadas a componen es de ex o se e-
emplazan co ec amen e y el con enido de las uen es de
da os se ca ga en los componen es co espondien es.
Es ado Supe ada
108 CAP´
ITULO 6. VALIDACI ´
ON Y PRUEBAS
ID PU-16
Desc ipci´on Con una plan illa con cie os componen es c eados se
pulsa el bo ´on de Imp imi a PDF.
Casos de uso asociados CU-12
C i e io de acep aci´on Se ecibe un PDF con el con enido de la plan illa.
Es ado Supe ada
ID PU-17
Desc ipci´on Con una plan illa con cie os componen es y m´ul iples
JSON se pulsa el bo ´on de Imp imi odos.
Casos de uso asociados CU-12
C i e io de acep aci´on Se ecibe un PDF po cada JSON eemplazando las a-
iables pa a cada JSON.
Es ado Supe ada
6.2. P uebas de in eg aci´on
Las p uebas de in eg aci´on ienen como obje i o comp oba que la in e acci´on
en e los dis in os m´odulos que o man la aplicaci´on se ealiza co ec amen e, de
modo que enemos la segu idad que la uncionalidad comple a se ealiza co ec-
amen e sin allo alguno y que mues a los esul ados co ec os.
ID PI-01
Desc ipci´on Con una plan illa con con enido ya c eada se p ocede a
pulsa en el bo ´on de Gua da
C i e io de acep aci´on El con enido es ansmi ido po HTTP al se ido , es e
lo ecibe y lo gua da en la base de da os, inalmen e el
clien e ecibe una espues a HTTP 200 indiciando que
la ope aci´on ha sido un ´exi o.
Es ado Supe ada
6.2. PRUEBAS DE INTEGRACI ´
ON 109
ID PI-02
Desc ipci´on Se ab e la in e az de la aplicaci´on y se pulsa en el men´u
de ca ga pa a ob ene odas las plan illas disponibles
del se ido .
C i e io de acep aci´on Se ansmi e una pe ici´on HTTP GET al se ido pa-
a ob ene odas las plan illas, es e con es a con o a
pe ici´on HTTP 200 con las plan illas ob enidas, a con-
inuaci´on el clien e las mues a odas en o ma de lis a
paginada.
Es ado Supe ada
ID PI-03
Desc ipci´on Con el men´u de ca ga plan illas abie o se selecciona
una de las plan illas de la lis a pa a ob ene sus e sio-
nes.
C i e io de acep aci´on Se ansmi e una pe ici´on HTTP GET al se ido pa-
a ob ene odas las e siones de la plan illa selecciona-
da, a con inuaci´on el se ido esponde con una pe ici´on
HTTP 200 con las e siones de la plan illa ob enidas, el
clien e mues a es as e siones en o ma de lis a pagi-
nada.
Es ado Supe ada
ID PI-04
Desc ipci´on Con el men´u de ca ga plan illas abie o se selecciona
una de la e siones de una plan illa de e minada y se
pulsa en la opci´on de edi a .
C i e io de acep aci´on Se ansmi e una pe ici´on HTTP GET al se ido pa a
ob ene el con enido de la e si´on de la plan illa selec-
cionada, el se ido esponde con un HTTP 200 con el
con enido de la e si´on, el clien e ca ga odos los da os
ecibidos y cambia la pa e cen al de la aplicaci´on pa a
que ep esen e el con enido ecibido.
Es ado Supe ada
116 CAP´
ITULO 6. VALIDACI ´
ON Y PRUEBAS
P egun a 1
P egun a 2
P egun a 3
P egun a 4
P egun a 5
P egun a 6
P egun a 7
P egun a 8
P egun a 9
P egun a 10
Pun uaci´on
Usua io 1 5 2 5 3 4 0 3 1 5 0 82/100
Usua io 2 4 1 4 3 5 1 4 2 4 1 76/100
Usua io 3 4 3 5 2 2 1 5 2 5 1 80/100
Usua io 4 5 2 5 0 4 3 2 3 4 3 72/100
Usua io 5 5 0 5 0 4 3 4 0 5 0 90/100
La media ob enida de la pun uaci´on de los usua ios es de 80 pun os, po lo
que se conside a que la in e az es usable en su conjun o debido a que es supe io
al l´ımi e de 75 pun os es ablecido.
6.4. Ma iz de azabilidad
PU-01
PU-02
PU-03
PU-04
PU-05
PU-06
PU-07
PU-08
PU-09
PU-10
PU-11
PU-12
PU-13
PU-14
PU-15
PU-16
PU-17
CU-01 X
CU-02 X
CU-03 X
CU-04 X
CU-05 X
CU-06 X
CU-07 X
CU-08 X
CU-09 X X X X
CU-10 X
CU-11 X X
CU-12 X X
Cuad o 6.1: Ma iz de azabilidad P uebas Uni a ias - Casos de uso

Cap´ı ulo 7
Conclusiones y ampliaciones
En es e apa ado se comen an las conclusiones ob enidas as la ealizaci´on
de es e abajo in de g ado, adicionalmen e se indican las posibles ampliaciones
que se le pod ´ıan aplica pa a consegui que la aplicaci´on sea m´as uncional o
p esen e mejo as de endimien o.
7.1. Conclusiones
Como p incipal conclusi´on menciona que el uso de las ecnolog´ıas de Big Da-
a y en especial de Business In elligence ha p o ocado un aumen o sus ancial de
la in o maci´on que enemos a nues a disposici´on, p o ocando que sea necesa io
la implemen aci´on de so wa e adicional pa a mos a dicha in o maci´on de o ma
legible y di ec a pa a los usua ios, no malmen e, en o ma de in o mes.
Dichos p og amas p esen an el p oblema de que son cons uidos a medida pa-
a un sis ema de BI conc e o, p o ocando que sea necesa io adap a los cuando
sea necesa io modi ica el modelo de da os a mos a , en es e abajo se ha desa-
ollado un so wa e que pe mi e la c eaci´on de in o mes que no dependen de un
modelo de da os conc e o, p oponiendo de es e modo una soluci´on al p oblema
an e io , aunque es e so wa e no es pe ec o ni aplicable a absolu amen e odos
los con ex os, la idea gene al de cons ui de o ma gen´e ica is as asociadas a
modelos de da os que el usua io ca gue, y odo lo an e io de la o ma m´as sencilla
posible, pe mi e soluciona la al a de lexibilidad de los sis emas an e io men e
mencionados.
Po una banda, des aca la impo ancia del uso de la compu aci´on dis ibui-
da en el mundo ac ual, especialmen e el pa adigma de a qui ec u as o ien adas
a se icios. Es o es debido a que es posible la c eaci´on de aplicaciones clien e
enca gadas de ealiza cie as uncionalidades que an es solo se pod´ıan ealiza
en el se ido , de modo que es posible dis ibui la ca ga que an es esid´ıa ple-
117
118 CAP´
ITULO 7. CONCLUSIONES Y AMPLIACIONES
namen e en los se ido es en e el clien e y el se ido , aho ando de es e modo
capacidad de c´ompu o. G acias a es o es posible c ea a qui ec u as escalables
aplicables al mundo de in o maci´on ol´a il ac ual en el que es necesa io con inuas
adap aciones pa a man ene la escalabilidad de los sis emas, adem´as de acili a
el desacoplamien o de uncionalidades y aumen a la segu idad de los se ido es.
Adicionalmen e, du an e es e TFG se ha ob enido conocimien o sob e un g an
abanico de ecnolog´ıas y amewo ks, des acando que el uso co ec o de es as ec-
nolog´ıas puede agiliza eno memen e el desa ollo de cualquie sis ema so wa e
ac ual, es o es debido a que se e i a “ ein en a la ueda” y po ello se puede
in e i el iempo de desa ollo desa ollando uncionalidades nue as en ez de
ec ea las que ya se han implemen ado an e io men e.
Po o a banda, des aca la impo ancia de la aplicaci´on y uso de pa ones de
dise˜no en el desa ollo de so wa e, pues g acias a ellos es posible la ealizaci´on de
aplicaciones al amen e escalables, ´aciles de man ene y cuyas pa es pueden se
eu ilizadas en o as aplicaciones dis in as. En es e abajo se han aplicado dis-
in os pa ones de dise˜no, incluyendo composici´on, he encia y di isi´on modula
(module pa e n) los cuales han pe mi ido agiliza el desa ollo de la aplicaci´on
adem´as de acili a la co ecci´on de e o es en ases m´as a anzadas del desa ollo
sin necesidad de des ui g an pa e del c´odigo.
Finalmen e, menciona la impo ancia de la gene aci´on de documen aci´on aso-
ciada al uso de un sis ema so wa e, ecnolog´ıa de e minada o amewo k, pues
ella es la que pe mi e el uso co ec o de odo lo an e io adem´as de agiliza la
cu a de ap endizaje eque ida pa a usa co ec amen e lo documen ado.
Sin emba go, es necesa io menciona ambi´en las di icul ades p esen adas a la
ho a de desa olla es e p oyec o.
La p incipal di icul ad p esen ada en el p oyec o es el uso de ecnolog´ıas nue-
as po p ime a ez po pa e del desa ollado , en conc e o el uso del lenguaje
Ja aSc ip . Aunque Ja aSc ip es un lenguaje sencillo de comp ende inicialmen e
puede llega a se complejo de depu a debido a que no es ´a ue emen e ipado a
di e encia de o os lenguajes de p og amaci´on como C++ o Ja a que ipi ican de
o ma es ´a ica, sin emba go es o puede sol en a se median e el uso de lenguajes
de supe conjun o, como TypeSc ip , que a˜naden ipado es ´a ico a Ja aSc ip .
O a de las g andes di icul ades ue el uso del amewo k Reac , es e amewo k
esc i o en Ja aSc ip p esen a una cu a de ap endizaje muy ele ada al in oduci
concep os nue os como ciclos de ida de componen es, pa ´on de composici´on y
ende izado que no son concep os sencillos de comp ende inicialmen e. Es o ha
p o ocado que uese necesa io es ue zo adicional pa a empeza a u iliza es e a-
7.2. AMPLIACIONES 119
mewo k, adem´as de aplica m´ul iples e ac o izaciones al c´odigo de la aplicaci´on
seg´un el conocimien o que se pose´ıa sob e el amewo k iba aumen ando du an e
el anscu so del p oyec o.
7.2. Ampliaciones
Aunque se alcanza on los obje i os con emplados en el alcance del p oyec o y
los equisi os p opues os po el clien e, el so wa e desa ollado p esen a ca encias
y al as en cie os aspec os.
En p ime luga , el so wa e solo pe mi e ca ga modelos de da os en o ma o
JSON, una de las posibles ampliaciones se ´ıa gene aliza la ca ga de modelos de
da os pa a pe mi i de es e modo la ca ga de modelos de da os en o ma o XML,
CSV o incluso ex a´ıdos desde bases de da os elacionales.
Adicionalmen e, el so wa e cuen a con un conjun o limi ado de opciones de edi-
ci´on, pues solo se ha con emplado opciones b´asicas y m´ınimas pa a da legibilidad
a un in o me, o as de las posibles ampliaciones se ´ıa a˜nadi m´as opciones de edi-
ci´on a los componen es de la aplicaci´on, como po ejemplo cambia el colo de la
uen e, cambia el ama˜no de la uen e, cambia el ipo de uen e o el colo de
ondo del componen e.
O a de las posibles ampliaciones se ´ıa a˜nadi o o ipo de componen es a la
aplicaci´on, como ´a boles, diag amas o a˜nadi o os ipos de g ´a icas que no es ´an
con empladas en el sis ema ac ual.
Tambi´en es posible aumen a las opciones de imp esi´on, pe mi iendo que el in-
o me gene ado sea u ilizado pa a dis in os ipos de olios como DIN A3, DIN A2
o o ma o ca a.
Como ´ul ima posible ampliaci´on p opues a es a ´ıa una mejo a gene al del en-
dimien o de la aplicaci´on, pues en caso de usa un in o me con muchas g ´a icas
y ablas el endimien o de la aplicaci´on se mina al p o oca cambios de is a,
p incipalmen e la mejo a de endimien o implica ´ıa el uso de ans o maciones
CSS3 y uso de GPU pa a calcula las ansiciones y animaciones de la in e az y
de es e modo man ene el endimien o.
120 CAP´
ITULO 7. CONCLUSIONES Y AMPLIACIONES
Ap´endice A
Manuales ´ecnicos
En es a secci´on se adjun an los manuales ela i os a la pa e ´ecnica del p o-
yec o, incluy´endose el despliegue de la aplicaci´on jun o con las opciones de con-
igu aci´on que es a pueda p esen a y el modo de con igu a las.
A.1. Manual de despliegue
Pa a desplega la aplicaci´on es necesa io las siguien es aplicaciones/en o nos,
es os no se p opo cionan en el CD del c´odigo de la aplicaci´on y deben de se
ins alados apa e:
Node.js (Ve si´on 9.11.1), es el en o no en el que se despliega la capa de
se icios y la aplicaci´on web, se puede desca ga desde h ps://nodejs.
o g/en/.
NPM (Ve si´on 6.1.0), ges o de dependencias u ilizado en las aplicaciones,
se puede desca ga desde h ps://www.npmjs.com/ge -npm.
Docke (Opcional) (Ve si´on 18.03.1-ce build 9ee9 40), u ilizado pa a des-
plega los con enedo es de la base de da os MongoDB ac ual, se puede
desca ga desde h ps://www.docke .com/ge -s a ed.
El uso de Docke es opcional si se op a po u iliza o o ipo de base de da os
MongoDB en o a URI de acceso, el uso de Node.js y NPM es obliga o io si se
desea desplega la aplicaci´on web y la capa de se icios pues o que ambas ue on
desa olladas den o de ese en o no.
Pa a desplega la aplicaci´on web:
1. Descomp imi su con enido en un di ec o io.
2. Ab i una e minal del sis ema ope a i o (bash, x e m, powe shell, ...).
121

122 AP´
ENDICE A. MANUALES T´
ECNICOS
3. Si ua la e minal en el di ec o io donde es ´a la aplicaci´on web y donde se
si ´ua el a chi o package.json de NPM.
4. Ejecu a el comando npm s a .
Pa a desplega la capa de se icios:
1. Descomp imi su con enido en un di ec o io.
2. Ab i una e minal del sis ema ope a i o (bash, x e m, powe shell, ...).
3. Si ua la e minal en el di ec o io donde es ´a la capa de se icios y donde
se si ´ua el a chi o package.json de NPM.
4. Ejecu a el comando npm s a .
Pa a desplega la base de da os mongoDB:
1. Ab i una e minal del sis ema ope a i o (bash, x e m, powe hsell, ...).
2. Si ua la e minal el di ec o io del a chi o a que con iene la imagen de la
base de da os.
3. Ejecu a el comando docke load -i <nomb e del a chi o a >.
4. Ejecu a el comando docke images pa a ob ene el ID de la imagen que se
ha ca gado.
5. Ejecu a el comando docke un –name <nomb e del con enedo >-i -
<ID de la imagen>pa a c ea el con enedo e inicia lo.
6. Aho a solo es necesa io ejecu a el comando docke s a <nomb e del
con enedo >pa a a anca el con enedo an e io en caso de que se pa e
o se cie e la e minal an e io .
A.2. Manual de con igu aci´on
A.2.1. Cambia la URI de la capa de se icios
En caso de que la capa de se icio se despliegue en una URI di e en e a local-
hos es necesa io modi ica el a chi o App. sx oApp.js de la aplicaci´on web.
Si se op a po modi ica el a chi o App. sx es necesa io u iliza el compilado de
TypeSc ip pa a compila el a chi o a Ja aSc ip in e p e able po el na egado ,
la URI es ´a especi icada en la l´ınea expo cons globalAPI : s ing = “URI
de capa de se icios”del a chi o App. sx.
A.2. MANUAL DE CONFIGURACI ´
ON 123
Si no in e esa compila lo con TypeSc ip y se decide cambia la URI de o -
ma m´as di ec a, cambia la l´ınea expo s. globalAPI = “URI de capa de
se icios” en el a chi o App.js.
A.2.2. Cambia la URI de la base de da os
En caso de u iliza o a base de da os MongoDB localizada en o a URI es
necesa io modi ica el a chi o db.js de la capa de se icios, en conc e o la l´ınea
a u l = URI a la base de da os.
A.2.3. Ve siones u ilizadas en el desa ollo
En caso de necesi a modi ica el c´odigo de la aplicaci´on o ac ualiza los
en o nos indica que es e p oyec o se ha ealizado bajo las siguien es e siones de
en o nos y lenguajes:
Node.js (Ve si´on 9.11.1)
NPM (Ve si´on 6.1.0)
Docke (Ve si´on 18.03.1-ce build 9ee9 40)
TypeSc ip (Ve si´on 2.9.2)
Reac (Ve si´on 16.3)
Ja aSc ip (ES2017)
Na egado es (Fi e ox 60 y Google Ch ome 64)
En caso de u iliza e siones supe io es o in e io es no se ga an iza que el c´odi-
go pueda unciona debido a la eliminaci´on de uncionalidades o cambios en las
APIs de los en o nos, se ecomienda u iliza es as e siones pa a maximiza la
compa ibilidad.
En e e encia a los na egado es, se ha p obado la aplicaci´on en Fi e ox 60 y
Google Ch ome 64 pues o que son ac ualmen e los na egado es m´as u ilizados y
m´as es ables en ´e minos de endimien o. P oba con e siones an e io es no ga-
an iza que el so wa e uncione co ec amen e debido a al as de uncionalidades
de Ja aSc ip o CSS.
124 AP´
ENDICE A. MANUALES T´
ECNICOS
Ap´endice B
Manual de usua io
En es a secci´on se adjun a el manual de usua io de la aplicaci´on, en el se
indican las opciones que con iene y el modo de usa las as´ı como sus limi aciones.
B.1. Vis a no mal de la aplicaci´on
Figu a B.1: Pan alla p incipal de la aplicaci´on
Cuando se accede a la aplicaci´on se mues a la in e az de la igu a B.1, la
aplicaci´on po de ec o c ea una plan illa ac´ıa cuyo nomb e y e si´on es New
Templa e y0.0.1 espec i amen e, la plan illa es ´a en blanco y solo con end ´a
una ila ac´ıa pa a c ea con enido.
125
132 AP´
ENDICE B. MANUAL DE USUARIO
con ando con dis in os encabezamien os pa a las lis as o denadas y pa a las no
o denadas.
Si se desea a˜nadi un elemen o nue o bas a con in oduci el con enido del ele-
men o en la en ada de o mula io in e io y pulsa En e pa a c ea el elemen o,
al ealiza es a acci´on el elemen o se ´a mos ado en la lis a y se c ea ´a una en-
ada de o mula io pa a ese elemen o en la secci´on Edi a elemen os ac uales.
En la secci´on Edi a elemen os ac uales se mues a una en ada de o mula-
io po cada elemen o p esen e en la lis a, modi icando la en ada del o mula io
aplica cambios di ec amen e al componen e de la lis a. Pa a elimina el elemen o
pulsa en el bo ´on ojo si uado al inal del o mula io.
Las opciones de edici´on an e io es solo es ´an disponibles cuando la
lis a es es ´a ica, es deci , su con enido no se ob iene desde una uen e
de da os.
B.4.4. P opiedades del componen e malla
Una malla pe mi e la c eaci´on de celdas independien es con dimensiones pe -
sonalizadas po el usua io, el panel de edici´on de es e componen e solo cuen a
con un bo ´on pa a a˜nadi m´as celdas a la malla con dimensiones p ede inidas,
dichas celdas solo con ienen componen es de ex o simples.
Pa a edi a una celda si ua el cu so encima de ella y pulsa en el bo ´on de
edici´on que se mues a, pos e io men e se ac i a ´a el panel de edici´on de la celda
que se ha seleccionado mos ado en la igu a B.8.
Figu a B.8: Panel de edici´on de una celda de una malla
El panel pe mi e edi a el con enido de la celda y las p opiedades del ex o,
adicionalmen e se adjun an en adas de o mula io pa a edi a el ancho y al o que
ocupa la celda, el al o se mide el pixeles y solo puede oma alo es supe io es
a 10 pixeles, el ancho se mide en % y oma alo es supe io es al 10 % y como
m´aximo 100 %. Adicionalmen e se adjun an dos bo ones que pe mi en desplaza
la celda de izquie da a de echa en la malla o bo a la. Pa a con i ma los cambios

B.4. PROPIEDADES, TAMA ˜
NO Y POSICI ´
ON DE UN COMPONENTE 133
de edici´on se debe de pulsa en el bo ´on de check si uado al inal de la en ada
del o mula io de edici´on.
B.4.5. P opiedades del componen e abla
El panel de edici´on de una abla es ´a ica se co esponde con la igu a B.9,
en es e panel se pe mi e al usua io a˜nadi ilas ac´ıas a la abla y c ea columnas
del mismo modo que un elemen o de una lis a, in oduciendo el nomb e de la
columna en la en ada del o mula io y pulsando en e .
Figu a B.9: Panel de edici´on de una abla es ´a ica
Cuando se a˜nade una columna o ila a la abla desde es e panel, es e se e ´a
e lejado inmedia amen e en la abla inculada, pa a edi a el con enido de la ila
o columna se sigue el mismo p ocedimien o que en una celda de una malla, se
si ´ua el cu so encima de la columna o ila pe inen e y se selecciona la opci´on de
edi a , pos e io men e se in oduce el alo deseado en la en ada del o mula io
que se habili a pa a la edici´on y se pulsa en e o el bo ´on de check pa a inaliza
la edici´on.
Adicionalmen e se pe mi e al usua io cambia el o den de las ilas y columnas
que a˜nada a la abla median e el uso de las lechas de di ecci´on que se habili an
cuando se si ´ua el cu so encima de una ila o columna.
Las opciones de edici´on an e io es solo es ´an disponibles cuando la
abla es es ´a ica, es deci su con enido no es ca gado desde una uen-
e de da os.
134 AP´
ENDICE B. MANUAL DE USUARIO
B.4.6. P opiedades del componen e g ´a ica ca esiana
El componen e g ´a ica ca esiana pe mi e ep esen a g ´a icas de l´ıneas,
ba as y ´a eas, odas ellas combinadas seg´un el usua io de ina en las se ies del
componen e, el panel de es e componen e se e leja en la igu a B.10.
Figu a B.10: Panel de edici´on de una g ´a ica ca esiana
En es e panel se p o ee al usua io de un conjun o de opciones que pe mi en
B.4. PROPIEDADES, TAMA ˜
NO Y POSICI ´
ON DE UN COMPONENTE 135
ac i a o desac i a elemen os isuales de la g ´a ica, como la malla ca esiana,
ejes de coo denadas o la leyenda, es as opciones se encuen an en la secci´on de
P opiedades de la g ´a ica. Adicionalmen e se pe mi e edi a el ama˜no de la
al u a de la g ´a ica en la en ada num´e ica del o mula io de la secci´on Al u a
de la g ´a ica.
Si se quie e a˜nadi nue as se ies de da os bas a con in oduci el nomb e de
la se ie en la en ada del o mula io de la secci´on A˜nadi nue as se ies de da-
os y pulsas en e pa a c ea la se ie, al hace es o se c ea un bo ´on en la secci´on
Edi a conjun os de da os con el nomb e de la se ie que se acaba de in oduci .
Pa a edi a el con enido de una se ie bas a con pulsa el bo ´on de Edi a se-
ie <nomb e de la se ie>si uada en la secci´on Edi a conjun os de da os, al
hace es o se desplega ´a el men´u de edici´on de esa se ie, es e panel es ´a compues o
po una en ada de o mula io donde se in oducen los da os de la se ie.
Los da os de la se ie deben de es a in oducidos en e los co che es y sepa ados
po comas, solo admi i´endose n´ume os pa a compone los alo es de la se ie. Un
ejemplo de alo es de una se ie se ´ıa [1,2,3,4,5,6,7,8,9].
Adicionalmen e el panel de edici´on pe mi e de ini el ipo de g ´a ica que ep e-
sen a ´an los da os adem´as del colo de la se ie.
Los ipos de g ´a icas disponibles son : l´ınea,´a ea yba as. Los colo es deben
de se in oducidos en o ma o hexadecimal RGB, un ejemplo de colo ´alido
se ´ıa # 0000.
Adicionalmen e la g ´a ica ca esiana pe mi e edi a las e ique as del eje X, in o-
duciendo cadenas de ex o a olun ad del usua io. Pa a edi a las pulsa sob e el
bo ´on Edi a e ique as del eje X, e in oduci en los co che es las e ique as
sepa adas po comas y en e comillas dobles, un ejemplo ´alido de e ique as se ´ıa
[“E ique a 1”,“E ique a2”].
B.4.7. P opiedades del componen e g ´a ica pola
El componen e g ´a ica pola pe mi e ep esen a g ´a icas de sec o es o de
ada , el panel de edici´on de es e componen e es ´a e lejado en la igu a B.11 pa a
una g ´a ica de sec o es y en la igu a B.12 pa a una g ´a ica de ada .
136 AP´
ENDICE B. MANUAL DE USUARIO
Figu a B.11: Panel de edici´on de una g ´a ica de sec o es
Ambos paneles uncionan del mismo modo que una g ´a ica ca esiana, pe mi-
iendo el a˜nadido de se ies de la misma mane a y pe mi iendo la pe sonalizaci´on
de opciones isuales en la misma localizaci´on que las g ´a icas ca esianas, adem´as
de pe mi i cambia el ama˜no de la al u a de la g ´a ica.
El panel pola p opo ciona adem´as de lo an e io la opci´on de selecciona que
ipo de g ´a ica se desea ep esen a , siendo los posibles alo es sec o es o ada .
Cabe des aca que exis en di e encias en como se a an los da os a ni el in e no
en cada uno de los dos ipos de g ´a icas disponibles. Las g ´a icas de sec o es
calculan su alo de ep esen aci´on como el suma o io de los alo es de la
se ie de modo que la se ie [5,5] es lo mismo que [10] en una g ´a ica de sec o es.
Sin emba go en una g ´a ica de ada , los alo es de ep esen aci´on se calculan
como cualquie o a g ´a ica de pun os, como una lis a de alo es, de modo que
[5,5] no es equi alen e a [10] en una g ´a ica de sec o es.
B.4. PROPIEDADES, TAMA ˜
NO Y POSICI ´
ON DE UN COMPONENTE 137
Figu a B.12: Panel de edici´on de una g ´a ica de ada
Adicionalmen e la g ´a ica de sec o es pe mi e edi a las e ique as de los ´e i-
ces del ada de ep esen aci´on, mien as que las g ´a icas de sec o es no pe mi en
es e ipo de opci´on. Adicionalmen e la g ´a icas pola es pe mi en edi a la opaci-
dad del colo de las se ies.
B.4.8. P opiedades del compone e g ´a ica de dispe si´on
El componen e g ´a ica de dispe si´on pe mi e ep esen a g ´a icas de bu -
bujas o de dispe si´on en dos a iables, el panel de edici´on es ´a ep esen ado en
la igu a B.13.
El panel de edici´on de una g ´a ica de dispe si´on sigue los mismos p ocedimien os
que una g ´a ica ca esiana, con ando con opciones de pe sonalizaci´on isuales de
la g ´a ica y de edici´on y a˜nadido de se ies jun o el ama˜no de la g ´a ica.

138 AP´
ENDICE B. MANUAL DE USUARIO
La di e encia adica en que la g ´a ica de dispe si´on pe mi e edi a las e ique-
as del eje X y del eje Y pulsando en los bo ones de Edi a e ique as del eje X y
Edi a e ique as del eje Y espec i amen e, el o ma o de las e ique as es el mis-
mo que el de las g ´a icas ca esianas, in oduciendo las e ique as en e comillas
dobles y sepa adas po comas.
Adicionalmen e las se ies de da os de una g ´a ica de dispe si´on cuen an con dos
conjun os de da os po se ie, el p ime conjun o de da os ep esen a los alo-
es que oma el pun o en el eje X mien as que el segundo conjun o de da os
ep esen a los alo es que oma el pun o en el eje Y.
Figu a B.13: Panel de edici´on de una g ´a ica de dispe si´on
B.5. DEFINICI ´
ON DE VARIABLES 139
B.5. De inici´on de a iables
La aplicaci´on posee opciones pa a decla a e inse a a iables en componen es
exis en es en la plan illa, el con enido de una a iable puede se una cadena de
ex o, un n´ume o o un conjun o de da os, pa a con igu a las a iables que se
pueden u iliza en la plan illa que se es ´e edi ando bas a con accede a la secci´on
de Va iables en la ba a de na egaci´on. La secci´on de a iables se subdi ide en
secciones m´as peque˜nas, cada una de ellas con una uncionalidad conc e a, dichas
secciones se explican a con inuaci´on.
B.5.1. Secci´on de c eaci´on de a iables
La p ime a secci´on es la secci´on de c eaci´on de a iables, la cual se encuen a
bajo el ´ı ulo de Va iables, dicha secci´on se puede obse a en la igu a B.14.
Figu a B.14: Panel de c eaci´on de a iables
En es a secci´on se mues an las a iables que hay de inidas a ni el de plan illa
en una abla, en dicha abla se indica el nomb e de la a iable el ipo de a iable
y se pe mi e la opci´on de bo a la a iable. Adicionalmen e se pe mi e c ea a-
iables nue as in oduciendo el nomb e de la a iable en la en ada del o mula io
in e io y seleccionando el ipo que la a iable ocupa ´a du an e su es ancia.
B.5.2. Tipos de a iables
Las a iables que se de inen a ni el de plan illa ienen un ipo asignado, de-
pendiendo del ipo su uso es a ´a pe mi ido en unos componen es y p ohibido en
o os, adicionalmen e el ipo de ine las opciones de aducci´on de la a iable de
modo que es c ucial de ini el ipo adecuadamen e o es a pod ´ıa no mos a se en
los componen es.
Los ipos de a iables disponibles son:
140 AP´
ENDICE B. MANUAL DE USUARIO
Cadena de ex o: El con enido de la a iable es una cadena de ex o y
se aduci ´a li e almen e su alo , de modo que se mos a ´a exac amen e el
alo ob enido de la u a del JSON especi icada.
N´ume o: El con enido de la a iable es un n´ume o, se aduci ´a li e al-
men e su alo pe o es a aducci´on alla ´a si exis en le as o si el n´ume o
es ´a en e comillas como una cadena ex o.
Fecha y ho a: El con enido de la a iable es una echa y una ho a, la
aducci´on de es e ipo de a iable se ealiza omando los milisegundos
desde el epoch de los sis emas UNIX, de modo que el alo ecibido se ´a
un n´ume o que ep esen e es os milisegundos, en caso con a io se mos a ´a
In alid Da e al aduci la echa.
Fecha (DD/MM/AAAA): El con enido de la a iable es una echa en
o ma o d´ıa mes y a˜no, la aducci´on de es e ipo de a iable se ealiza
omando los milisegundos desde el epoch de los sis emas UNIX, de modo
que el alo ecibido se ´a un n´ume o que ep esen e es os milisegundos, en
caso con a io se mos a ´a In alid Da e al aduci la echa.
Fecha (MM/DD/AAAA): El con enido de la a iable es una echa en
o ma o mes d´ıa y a˜no, la aducci´on de es e ipo de a iable se ealiza
omando los milisegundos desde el epoch de los sis emas UNIX, de modo
que el alo ecibido se ´a un n´ume o que ep esen e es os milisegundos, en
caso con a io se mos a ´a In alid Da e al aduci la echa.
F. Da os (Lis a): El con enido de la a iable es una uen e de da os pa a
un componen e ipo lis a, es e ipo de a iable espe a un a ay de obje os
de los cuales solo mos a ´a una p opiedad que el usua io seleccione en el
Mapeado de a iables.
F. Da os (Tabla): El con enido de la a iable es una uen e de da os pa a
un componen e ipo abla, es e ipo de a iable espe a un a ay de obje os,
la abla c ea ´a una columna po cada p opiedad del obje o gen´e ico del
a ay y una ila po cada obje o p esen e en el a ay.
F. Da os (Ca esiana): El con enido de la a iable es una uen e de da os
pa a un componen e g ´a ica ca esiana, es e ipo de a iable espe a un a ay
de obje os, la g ´a ica ca esiana c ea ´a una se ie po cada p opiedad p esen e
en el obje o gen´e ico del a ay, los alo es de la se ie se ´an los alo es de
dicha p opiedad en odos los obje os que componen el a ay ecibido como
pa ´ame o.
F. Da os (Pola ): El con enido de la a iable es una uen e de da os
pa a un componen e g ´a ica pola , es e ipo de a iable espe a un a ay
B.5. DEFINICI ´
ON DE VARIABLES 141
de obje os, la g ´a ica pola c ea ´a una se ie po cada p opiedad p esen e
en el obje o gen´e ico del a ay, los alo es de la se ie se ´an los alo es de
dicha p opiedad en odos los obje os que componen el a ay ecibido como
pa ´ame o.
F. Da os (Dispe si´on): El con enido de la a iable es una uen e de da os
pa a un componen e g ´a ica de dispe si´on, es e ipo de a iable espe a un
mapa de a ays de obje os, la g ´a ica de dispe si´on c ea ´a una se ie po
cada cla e del mapa, los alo es de cada se ie son los a ays de la cla es,
dichos a ays deben de con ene obje os que engan dos p opiedades, xpa a
de ini el alo del pun o en el eje x e ypa a de ini el alo del pun o en
el eje y.
B.5.3. Mapeado de a iables
Figu a B.15: Mapeado de a iables
La siguien e secci´on es el mapeado de a iables, es e se encuen a bajo el
´ı ulo Mapeo de a iables, una posible ep esen aci´on del panel se puede ob-