PDF de programación - Desarrollo de una aplicación web para la gestión de un servicio de préstamo de material.

Escola Tècnica Superior d’Enginyeria Informàtica

Universitat Politècnica de València



Desarrollo de una aplicación web para la

gestión de un servicio de préstamo de

material.



Trabajo Fin de Grado

Grado en Ingeniería Informática



Autor: Jose Boix Ruiz

Tutor: Vicente Luis Atienza Vanacloig

Diciembre 2014



1



Desarrollo de una aplicación web para la gestión de un servicio de préstamo de
material.



2



Resumen

Se ha desarrollado una aplicación web en PHP (framework Yii) totalmente dinámica
para la gestión de préstamo de material para la asignatura de Producción Multimedia.
Los encargados de administrar la aplicación podrán crear categorías, donde se les dará
la posibilidad de crear dinámicamente formularios y posteriormente registrar sus
productos. En cambio, los alumnos podrán reservar los productos anteriormente
registrados y llevar un amplio control de las reservas realizadas. Debido a los requisitos
de comodidad y usabilidad que se plantean hoy en día, la aplicación podrá ser utilizada
desde cualquier dispositivo conectado a internet, con el único requisito de disponer un
navegador web.



Palabras clave: Aplicación, PHP, MySQL, Producción Multimedia, gestión,

dispositivo.



Abstract

A fully dynamic web application in PHP has been developed towards the management
of loan material for the Multimedia Production subject. The responsible of managing
the web application can create categories, in which they will have the opportunity of
creating forms dynamically and then register their products. By the way, students may
reserve the products previously registered and take a major control over the products
already booked. Due to comfort and usability requirements which arise nowadays, the
application may be used from any internet connected device, with the only requirement
of having a web browser.



Keywords: Application, PHP, MySQL, Multimedia Production, management, device.



3

Desarrollo de una aplicación web para la gestión de un servicio de préstamo de
material.

Tabla de contenidos


Introducción ................................................................................................................ 8

1.

1.1 Motivación y Justificación ................................................................................. 8

1.2

1.3

Objetivos del proyecto ....................................................................................... 8

Estructura de la memoria .................................................................................. 9

2. Conceptos Básicos ...................................................................................................... 11

2.1

2.2

2.3

¿Qué es una página web dinámica? .................................................................. 11

¿Por qué una página dinámica? ........................................................................ 11

¿Qué es SGBD? ................................................................................................. 12

2.3.1

Ventajas de las bases de datos ................................................................... 12

3. Tecnologías Utilizadas ................................................................................................ 14

3.1

3.2

3.3

3.4

3.5

3.6

¿Por qué HTML? ............................................................................................... 14

¿Por qué CSS, Bootstrap 3 y Media Queries? ................................................... 14

¿Por qué Javascript y JQuery? .......................................................................... 15

¿Por qué MySQL? ............................................................................................. 15

¿Por qué PHP? .................................................................................................. 15

¿Por qué Yii Framework? .................................................................................. 16

3.6.1

¿Por qué Gii? ............................................................................................. 18

3.7

¿Por qué XAMPP? ............................................................................................. 18

3.8

¿Por qué NetBeans y GitHub? .......................................................................... 19

4. Descripción del Escenario .......................................................................................... 20

5. Diseño e Implementación ........................................................................................... 22

5.1

Esquemas de diseño ......................................................................................... 22

5.1.1

Esquema página de inicio de sesión ......................................................... 22

5.1.2

Esquema página portada .......................................................................... 24

5.1.3

Esquema página categorías ...................................................................... 25

5.1.4

Esquema página objetos ........................................................................... 28

5.1.5

Esquema página reservar ......................................................................... 30

5.1.6

Esquema página lote ................................................................................. 31

5.2 Diagrama y Diseño de la Base de Datos........................................................... 33

5.2.1

Diagrama de casos de uso ......................................................................... 33

5.2.2

Diagrama de clases ................................................................................... 36

5.2.3

Tabla Usuario ............................................................................................ 37

4



5.2.4

Tabla Categoría ......................................................................................... 39

5.2.5

Tabla Objeto ............................................................................................. 40

5.2.6

Tabla Lote .................................................................................................. 41

5.2.7

Tabla Reserva ............................................................................................ 41

6. Resultados y Ampliación ............................................................................................ 43

6.1

Resultados ........................................................................................................ 43

6.2 Mejoras ............................................................................................................ 49

7. Conclusión ................................................................................................................ 50

8. Bibliografía ................................................................................................................ 51

ANEXO A: Manual de instalación ..................................................................................... 53



5

Desarrollo de una aplicación web para la gestión de un servicio de préstamo de
material.

Tabla de ilustraciones



Ilustración 1: Estructura estática aplicación Yii .............................................................. 17
Ilustración 2: Interacción usuario con Yii ....................................................................... 17
Ilustración 3: Diseño previo inicio ................................................................................. 22
Ilustración 4: Resultado inicio en ordenador ................................................................. 23
Ilustración 5: Resultado inicio en móvil ......................................................................... 23
Ilustración 6: Diseño de portada .................................................................................... 24
Ilustración 7: Resultado potada en ordenador ............................................................... 24
Ilustración 8: Resultado portada en móvil ..................................................................... 25
Ilustración 9: Diseño de categorías ................................................................................ 25
Ilustración 10: Resultado categorías en ordenador........................................................ 26
Ilustración 11: Resultado categorías en móvil ................................................................ 26
Ilustración 12: Diseño de categoría seleccionada ............................................................ 27
Ilustración 13: Resultado categoría seleccionada ordenador ......................................... 28
Ilustración 14: categoría seleccionada móvil .................................................................. 28
Ilustración 15: Diseño de objeto ..................................................................................... 29
Ilustración 16: Resultado objeto en ordenador .............................................................. 29
Ilustración 17: Resultado objeto en móvil ...................................................................... 29
Ilustración 18: Diseño de tabla reservas ........................................................................ 30
Ilustración 19: Resultado tabla reservas en ordenador ................................................... 31
Ilustración 20: Resultado tabla reservas en móvil .......................................................... 31
Ilustración 21: Diseño de lote ......................................................................................... 32
Ilustración 22: Resultado lote en ordenador .................................................................. 32
Ilustr