UNIVERSIDAD REGIONAL AUTÓNOMA DE LOS ANDES -...
100
UNIVERSIDAD REGIONAL AUTÓNOMA DE LOS ANDES “UNIANDES - IBARRA” FACULTAD DE SISTEMAS MERCANTILES CARRERA DE SISTEMAS PROYECTO DE EXAMEN COMPLEXIVO PREVIO A LA OBTENCIÓN DEL TÍTULO DE INGENIERO EN SISTEMAS E INFORMÁTICA TEMA: APLICACIÓN WEB PARA LA GESTIÓN DE SOPORTE TÉCNICO DE LA EMPRESA DE TELECOMUNICACIONES NEXTEL CIA. LTDA. DE LA CIUDAD DE ATUNTAQUI AUTOR: ORTEGA CAIPE ALCIDES HERNANDO ASESOR: ING. LLERENA OCAÑA LUIS ANTONIO AMBATO - ECUADOR 2016
Transcript of UNIVERSIDAD REGIONAL AUTÓNOMA DE LOS ANDES -...
UNIVERSIDAD REGIONAL AUTÓNOMA DE LOS ANDES
“UNIANDES - IBARRA”
FACULTAD DE SISTEMAS MERCANTILES
CARRERA DE SISTEMAS
PROYECTO DE EXAMEN COMPLEXIVO PREVIO A LA OBTENCIÓN DEL
TÍTULO DE INGENIERO EN SISTEMAS E INFORMÁTICA
TEMA:
APLICACIÓN WEB PARA LA GESTIÓN DE SOPORTE TÉCNICO DE LA
EMPRESA DE TELECOMUNICACIONES NEXTEL CIA. LTDA. DE LA
CIUDAD DE ATUNTAQUI
AUTOR: ORTEGA CAIPE ALCIDES HERNANDO
ASESOR: ING. LLERENA OCAÑA LUIS ANTONIO
AMBATO - ECUADOR
2016
CERTIFICACIÓN DEL ASESOR
El Ing. Luis Llerena, en calidad de Asesor de Tesis, designado por la disposición de la
Cancillería de UNIANDES, certifica que el Señor Hernando Ortega, estudiante de la
Carrera de Ingeniería en Sistemas, ha culminado su tesis de grado, con el tema:
“Aplicación Web Para La Gestión De Soporte Técnico De La Empresa De
Telecomunicaciones Nextel Cía. Ltda. De La Ciudad De Atuntaqui", quien ha
cumplido con todos los requerimientos exigidos por lo que se aprueba la misma para su
presentación.
Es todo cuanto puedo decir en honor a la verdad, facultando al interesado hacer el trámite
respectivo para la evaluación por parte del jurado que designe la Institución.
Atentamente,
DECLARACIÓN DE LA AUTORÍA DEL PROYECTO
Yo Hernando Ortega, declaro que he trabajado en el presente Proyecto de Tesis en el cual
el tema es la “Aplicación Web Para La Gestión De Soporte Técnico De La Empresa
De Telecomunicaciones Nextel Cía. Ltda. De La Ciudad De Atuntaqui”, El mismo que
es de mi originalidad y autoría; la cual he sometido a revisión por el Ing. Luis Llerena,
Asesor del Proyecto de Tesis.
Es todo cuanto puedo manifestar en honor a la verdad.
Atentamente,
-----------------------------------
Hernando Ortega
Autor
DEDICATORIA
Dedico de manera especia mi trabajo de grado, primeramente a Dios por darme la
existencia y la oportunidad de haber llegado hasta esta instancia de mi vida, a mis padres
por haber confiado en mí y haberme apoyado con su esfuerzo y dedicación para terminar
mis estudios, principalmente a mi esposa Germania Vásquez y mi hija Alice Ortega quien
con su amor incondicional me han apoyado en cada instante ya que son mi inspiración de
lucha día a día.
AGRADECIMIENTO
Agradezco infinitamente a mi universidad por haberme dado la oportunidad de estudiar en
tan linda institución, a mis tutores de toda mi formación académica quienes me supieron
guiar con sus conocimientos, al Ing. Luis Llerena en calidad de asesor por haberme guiado
durante el transcurso del desarrollo del proyecto final.
ÍNDICE GENERAL
CERTIFICACIÓN DEL ASESOR
DECLARACIÓN DE AUTORÍA DEL PROYECTO
DEDICATORIA
AGRADECIMIENTO
ÍNDICE GENERAL
ÍNDICE DE CUADROS
INDICE DE GRÁFICOS
RESUMEN EJECUTIVO
EXECUTIVE SUMMARY
1.INTRODUCCIÓN……………………………………………………………………...1
1.1 Antecedentes de la Investigación ................................................................................. 1
1.2 Planteamiento del problema ......................................................................................... 2
1.3 Formulación del problema ........................................................................................... 3
1.4 Delimitación del problema ........................................................................................... 3
1.5 Objeto de investigación y campo de acción ................................................................. 3
1.6 Identificación de la línea de investigación ................................................................... 3
1.7 Objetivo General .......................................................................................................... 3
1.8 Objetivos Específicos .................................................................................................. 4
1.9 Idea a Defender ............................................................................................................ 4
1.10 Justificación del tema ................................................................................................. 4
1.11 Metodología investigativa a emplear ......................................................................... 5
1.11.1 Investigación documental – bibliográfica ............................................................... 6
1.11.2 Investigación de Campo .......................................................................................... 6
1.11.3 Resumen de la Estructura del Proyecto .................................................................. 7
1.11.4 Aporte teórico y significación práctica. .................................................................. 8
CAPITULO II .................................................................................................................... 9
2.MARCO TEORICO ....................................................................................................... 9
2.2Análisis de las distintas posiciones teóricas sobre las Aplicaciones web. .................. 10
2.2.1 Aplicación web ....................................................................................................... 10
2.2.6 Base de datos .......................................................................................................... 15
2.2.7 Servidores web ........................................................................................................ 22
2.2.8 Lenguaje de programación web PHP ..................................................................... 24
2.2.9 Navegadores web .................................................................................................... 26
2.2.10 PHPRunner ........................................................................................................... 27
2.2.11JavaScript ............................................................................................................... 29
2.2.12JQuery .................................................................................................................... 31
2.2.13HTML5 .................................................................................................................. 32
2.2.14CSS3 ...................................................................................................................... 34
2.3Valoración crítica de los conceptos principales de las distintas posiciones teóricas
sobre las aplicaciones web. .............................................................................................. 38
2.4 Conclusiones parciales del capítulo. .......................................................................... 39
CAPÍTULO III ................................................................................................................. 40
3.MARCO PROPOSITIVO ............................................................................................. 40
3.1 Tema: ......................................................................................................................... 40
3.2 Descripción de la propuesta ....................................................................................... 40
3.3 Desarrollo de la propuesta ......................................................................................... 40
3.3.1 Metodología de Desarrollo ..................................................................................... 40
3.3.2 Análisis previo ........................................................................................................ 41
3.3.3 Diseño ..................................................................................................................... 46
3.3.4 Desarrollo ................................................................................................................ 56
3.3.5 Pruebas .................................................................................................................... 58
3.3.6 Implementación ...................................................................................................... 68
3.3.7 Validación de la propuesta ...................................................................................... 69
CONCLUSIONES ........................................................................................................... 70
RECOMENDACIONES .................................................................................................. 72
ÍNDICE DE CUADROS
Cuadro N°1, Tabla Categoría - Fuente: Autor ............................................................... 51
Cuadro N°2, Tabla Ciudad - Fuente: Autor ................................................................... 51
Cuadro N°3, Tabla Cliente - Fuente: Autor ................................................................... 52
Cuadro N°4, Tabla Detallesalidaequipos - Fuente: Autor ............................................. 52
Cuadro N°5, Tabla Detallasolicitud - Fuente: Autor ..................................................... 52
Cuadro N°6, Tabla Detallesoporte - Fuente: Autor ....................................................... 52
Cuadro N°7, Tabla Equipo - Fuente: Autor ................................................................... 53
Cuadro N°8, Tabla Observaciones soporte - Fuente: Autor .......................................... 53
Cuadro N°9, Tabla Personal - Fuente: Autor ................................................................. 53
Cuadro N°10, Tabla Provincia - Fuente: Autor ............................................................. 54
Cuadro N°11, Tabla Salidaequipos - Fuente: Autor ...................................................... 54
Cuadro N°12, Tabla Solicitud - Fuente: Autor .............................................................. 54
Cuadro N°13, Tabla soporte - Fuente: Autor ................................................................. 55
Cuadro N°14, Tabla Vehículo - Fuente: Autor .............................................................. 56
Cuadro N° 15, Cuadro de resumen de las pruebas y rendimientos - Fuente: Autor. ..... 65
Cuadro N° 16 – Cuadro de Prueba de Hardware -Fuente: Autor. ................................. 66
Cuadro N° 17, Cuadro de la Prueba de Software - Fuente: Autor. ................................ 67
Cuadro N° 18, Cuadro de la Prueba de la Aplicación Web - Fuente: Autor. ................. 68
ÍNDICE DE GRÁFICOS
Figura N°1, partes de una URL (Localizador Uniforme de Recursos) .......................... 23
Figura N°2, caso de uso Atención al cliente - Fuente: Autor ......................................... 41
Figura N°3, Flujo de eventos Atención al cliente - Fuente: Autor ................................. 42
Figura N°4, caso de uso del Técnico - Fuente: Autor…………………………………..42
Figura N°5, Flujo de eventos Técnico - Fuente: Autor................................................... 43
Figura N°6, caso de uso del Jefe Técnico - Fuente: Autor. ............................................ 43
Figura N°7, Flujo de eventos Jefe Técnico - Fuente: Autor. .......................................... 44
Figura N°8, caso de uso del área de bodega - Fuente: Autor.......................................... 44
Figura N°9, Flujo de eventos del área de bodega - Fuente: Autor. ................................. 45
Figura N°10, caso de uso del Administrador - Fuente: Autor ........................................ 45
Figura N°11, Flujo de eventos del Administrador - Fuente: Autor ................................ 46
Figura N°12, Diseño de la base de datos - Fuente: Autor………………………………49
Figura N°13, Modelo lógico de la base de datos - Fuente: Autor ................................. 48
Figura N°14, Modelo Físico de la base de datos - Fuente: Autor ................................. 48
RESUMEN EJECUTIVO
El presente trabajo de grado consiste en la realización y programación de una aplicación
web, el cual está orientado a la automatización en los procesos de gestión de soporte
Técnico para la empresa de Telecomunicaciones Nextel Cía. Ltda. de la ciudad de
Atuntaqui.
La aplicación web permitirá el acceso a la información desde cualquier lugar que se
encuentre el usuario por medio de un dispositivo con acceso a internet para realizar las
consultas o trabajo asignado sobre todo para el personal técnico de la empresa.
Las herramientas que han sido utilizadas para la construcción del presente trabajo son las
denominadas de uso libre, como son principalmente la base de datos MySql, el lenguaje de
programación Web PHP, Framework PHPRunner (RAD) y el servidor web Apache,
también se utilizó herramientas adicionales como MySQL Workbench, JavaScript, Ajax, y
Dreamweaver.
Con estos elementos, se procedió a la realización de la aplicación web en la que se registra
principalmente el trabajo designado para cada empleado de la empresa Nextel Cía. Ltda.
En síntesis la aplicación web automatiza los procesos de gestión de soporte técnico y
estará disponible para cualquier usuario en el momento que lo requiera.
EXECUTIVE SUMMARY
The following thesis work consists of the performance and programming of a web
application aimed to the automation in the management processes of the technical support
for the telecom company Nextel Cia. Ltd. From the city of Atuntaqui.
This web application will permit the access to information from any place where the user is
using a gadget with internet access to perform searches, for the company`s tech staff.
The tools used for the construction of this work are the free-to-use ones. Such as the data
basis MySql, the programming language Web PHP, Framework Php runner (RAD) and the
web server Apache. Apart from these tools, additional tools such as MySQL, Workbench,
JavaScript, Ajax, and Dreamweaver were used.
With the use of these elements, the web performance was carried out where mainly the
work designated for each employee of the Nextel Cia. Ltd. was registered.
In summary, the web application will automate the management processes of the technical
support and will be available for every user at any required moment.
1
CAPITULO I
1. INTRODUCCIÓN
1.1 Antecedentes de la Investigación
Realizando las primeras investigaciones en la Biblioteca de la Universidad Regional
Autónoma de Los Andes, se ha encontrado algunos trabajos de grado y postgrado de la
Facultad de Sistemas en la cual sirve como antecedente previo en donde se puede
mencionar los siguientes como:
El trabajo del Señor Darwin Fernando Farinango Chávez en 2015 con la realización del
“Portal Web para la Gestión de Ventas en el Almacén CHF-ARTE’S de San Antonio de
Ibarra” donde se pretende mejorar la gestión de ventas mediante la Implementación de un
Portal Web Orientado al Comercialización Electrónica.
En Mayo del 2015 la señorita María Luzmila Otavalo Criollo realizó “Aplicación web
para la Gestión Contable de la microempresa comunitaria de agua potable y alcantarillado
“ECAPASR” SCC, de la Parroquia de San Rafael, Cantón Otavalo”, donde pretende
mejorar los procesos contables de la microempresa comunitaria de Agua Potable y
Alcantarillado “ECAPASR” SCC, Implementando mediante el lenguaje PHP y MySql
como Base de Datos.
La Ingeniera Mónica Nátaly Hernández Manzano, en Abril del 2015 con el tema
“Aplicación Web Para la Gestión de Evaluación Académica en la Universidad Regional
Autónoma De Loa Andes”, donde el objetivo principal es lograr la agilidad en un alto
porcentaje el cálculo de resultados, en los exámenes de admisión y nivelación, los cuales se
obtendrán en tiempo real, de manera eficiente y eficaz con la utilización de tecnologías
como es el lenguaje de programación C# y la utilización de herramientas ORM (Mapeo
Objeto Relacional) como novedad en el ámbito del desarrollo de aplicaciones.
2
1.2 Planteamiento del problema
En la Empresa de Telecomunicaciones Nextel Cía. Ltda. de la ciudad de Atuntaqui –
Provincia de Imbabura los procesos en la gestión de soporte técnico, no se los realiza de
una forma eficaz debido a que todos los procesos se los maneja de forma manual en donde
existe desorganización de la documentación, ocasionando cierta incomodidad y desorden
en almacenar físicamente la cantidad de información por parte del personal encargado de
asignar agendas de visitas técnicas al personal técnico que es quien sale hacia el domicilio
del cliente e ingresa en hojas impresas todo el trabajo realizado. Esto fundamentalmente a
ocasionado molestias e inconformidad en los clientes ya que los técnicos no llegan a
realizar el soporte en la hora establecida por retrasos debido al complicado trabajo que se
toma la persona encargada de asignar soportes a cada técnico. Además para la Empresa es
de vital importancia llevar adecuadamente los registros de las revisiones donde
actualmente se los lleva de una manera desorganizada en lo que se refiere a revisiones
solucionadas, instalaciones informáticas, modificaciones en el sistemas, enlaces, estado del
servicio, estado de los equipos, modificaciones, reinstalaciones.
En la empresa de telecomunicaciones Nextel Cía. Ltda. De la Ciudad de Atuntaqui –
provincia de Imbabura, el personal técnico entrega sus reportes de visitas técnicas de
forma física, en hojas impresas y muchas veces documentos con deterioros debido a la
forma como se los traslada estos documentos hasta finalizar la jornada de trabajo, esto
ocasiona un malestar en los trabajadores, por la incomodidad, el tiempo y la complejidad
que les toma en administrar y trasladar físicamente dicha información.
Debido a las necesidades de agilitar la gestión de soporte técnico, muchas veces los
funcionarios del cuerpo técnico por la extensa cantidad de documentación acumulada, no
entregan completamente todos sus reportes y respaldos de lo que han realizado en el
transcurso del día.
En dicha Institución existe deficiencia en la planificación, organización, ejecución y
evaluación en forma sistemática y ordenada, el control del trabajo que desarrollan los
técnicos de la empresa por la ineficiencia del sistema actual de control del trabajo técnico.
Además la deficiencia de actualizar a diario el trabajo realizado con su respectiva solución,
no permite realizar un diagnóstico para Identificar las metas a lograr, los procesos y
3
producciones esperadas por parte de los técnicos.
1.3 Formulación del problema
¿Cómo mejorar la gestión de soporte técnico de la Empresa de Telecomunicaciones Nextel
Cía. Ltda. De la ciudad de Atuntaqui?
1.4 Delimitación del problema
Objeto de investigación: Procesos informáticos
Campo de acción: Programación de sistemas.
Lugar: Ciudad de Atuntaqui
Tiempo: 6 meses Año 2015 – 2016
1.5 Objeto de investigación y campo de acción
Objeto de investigación.- Procesos de gestión de soporte Técnico de la Empresa
Nextel Cía. Ltda.
Campo de acción.- Automatización de la información relacionado a las actividades del
departamento técnico.
1.6 Identificación de la línea de investigación
Desarrollo de Software y programación de sistemas
1.7 Objetivo General
Implantar una aplicación web para la gestión de soporte técnico de la empresa de
telecomunicaciones Nextel Cía. Ltda. De la Ciudad de Atuntaqui.
4
1.8 Objetivos Específicos
Fundamentar teóricamente los procesos de gestión de soporte técnico de la Empresa de
Telecomunicaciones Nextel Cía. Ltda. De la ciudad de Atuntaqui.
Diagnosticar los procesos actuales de gestión de soporte técnico que se realiza en la
Empresa de Telecomunicaciones Nextel Cía. Ltda. de la ciudad de Atuntaqui, mediante
la recopilación de información con el fin de llegar a establecer las necesidades dentro
de la empresa.
Desarrollar la aplicación web para la gestión de soporte técnico de la Empresa de
Telecomunicaciones Nextel Cía. Ltda. De la ciudad de Atuntaqui.
Validar la propuesta.
1.9 Idea a Defender
Con el desarrollo e implementación de una aplicación web se mejorará los procesos de
soporte mediante la automatización de información en vinculación a las actividades por
parte de los miembros del área de soporte de la empresa, donde también contribuirá con la
superación de labores y se ahorrará tiempo y recursos en la solución a los problemas que
presenta la compañía.
1.10 Justificación del tema
El desarrollo de la APLICACIÓN WEB PARA LA GESTIÓN DE SOPORTE TÉCNICO
DE LA EMPRESA DE TELECOMUNICACIONES NEXTEL CIA. LTDA. DE LA
CIUDAD DE ATUNTAQUI, será el inicio de un cambio muy importante ya que la
institución con el uso de la Aplicación Web estará logrando un alto nivel en la prestación
del servicio de internet, la optimización de tiempo, recursos y los procesos de información
en el trabajo diario, es un factor muy importante que ayuda al crecimiento constante de
dicha empresa.
El presente proyecto de investigación se ejecutara principalmente en el área de soporte
técnico, logrando brindarles al personal de soporte comodidades por la utilización de
información digital, ágil y rápida accesibilidad a la información laboral por medio de la
5
Aplicación web que brinda servicios con tecnología actualizada, y por ende lograr brindar
un mejor servicio, donde se pretende la satisfacción de los clientes.
Actualmente es indiscutible que las aplicaciones web pueden contribuir a mejorar la
calidad de servicio de una empresa en la época de la información y las comunicaciones,
puesto que hoy en día la innovación y mejora debe ser constante por la alta competitividad
que se presenta dentro del área de telecomunicaciones, mantenerse en el mercado y la
fidelidad de los clientes implica incorporar algunos aspectos complementarios y
superación en el área laboral ya que es una empresa de servicios.
Con este argumento, al analizar todos los procesos actuales de cómo se llevan a cabo
dentro del área de soporte se puede concluir que urge un cambio en el sistema sobre todo
para mantener al cliente satisfecho viendo la puntualidad, el profesionalismo, el trabajo a
tiempo, la solución inmediata y algunos aspectos positivo que se lograría con el uso de la
aplicación web que abarcan para brindar un servicio de calidad, esto significa también los
buenos comentarios y recomendaciones de los clientes las mismas que son relevantes para
el prestigio de la empresa logrando a demás extenderse con el ingreso de nuevos usuarios.
En cuanto al desarrollo del presente proyecto la parte teórica está fundamentado de
acuerdo a las distintas herramientas que se van a utilizar en la construcción de la
Aplicación Web como son principalmente la base de datos MySql, el lenguaje de
programación Web PHP y el servidor web Apache, se considera como ventaja en el
aspecto económico tanto para la empresa Nextel. Cía. Ltda. Como para el jefe de proyecto
ya que estas herramientas son de gran utilidad y están dentro de la rama del software libre,
lo que hace justificativo y viable su elaboración.
1.11 Metodología investigativa a emplear
Existen varios tipos de metodologías que ayudan con los procesos de investigación que
permitan analizar las necesidades de la empresa de cómo se desempeña laboralmente y
posteriormente a un desarrollo de un software de calidad y en un cronograma previamente
estipulado.
6
Para iniciar el desarrollo del sistema se empleará el método inductivo para tener en
conocimiento de cómo se realizan los procesos de cada una de las actividades que ejercen
el personal de cada departamento dentro de la institución, posteriormente agrupar toda la
información obtenida para luego pasar a un análisis antes de continuar con el desarrollo y
programación del sistema mediante herramientas adicionales, un lenguajes de
programación, y una base de datos.
Entre los tipos de investigación que se utilizaran tenemos:
1.11.1 Investigación documental – bibliográfica
Permite la utilización de libros, información dentro del internet, bibliotecas de la
universidad la misma información entregada por parte de la empresa, sirve para la
elaboración del marco teórico quien fundamenta científicamente la propuesta de solución.
En este caso, se refiere a las herramientas que se utilizaran en el desarrollo de la aplicación
web.
1.11.2 Investigación de Campo
Se lo realiza precisamente en el lugar donde se manifiesta la problemática se podría decir
que el investigador se sitúa en el medio natural donde vive directamente la realidad de los
hechos, recopilando información o datos reales, en este caso se realiza en las diferentes
zonas de cobertura donde se presta el servicio.
Las técnicas a aplicarse en este proceso investigativo son la encuesta, así como también los
instrumentos de investigación que están orientados a las técnicas son los cuestionarios que
se utilizarán para las encuestas dirigido hacia los clientes y empleados de la empresa.
7
1.11.3 Resumen de la Estructura del Proyecto
Capitulo I. Introducción.- En el presente trabajo de investigación la introducción
describe el alcance del proyecto, y se da una breve explicación o resumen del mismo.
También puede explicar algunos antecedentes, objetivos, la problemática misma que da
lugar al estudio y algunos aspectos que son importantes para el posterior desarrollo de
la “APLICACIÓN WEB PARA LA GESTIÓN DE SOPORTE TÉCNICO DE LA
EMPRESA DE TELECOMUNICACIONES NEXTEL CIA. LTDA. DE LA CIUDAD
DE ATUNTAQUI”
Capitulo II. Marco Teórico.- La base teórica del presente informe es la parte
fundamental del trabajo investigativo ya que tiene que ver con el fundamento
relacionado a las herramientas de software libre mismas que se utilizaran para el
desarrollo de la aplicación web se fundamenta científicamente MySql como gestor de
base de datos, el lenguaje de programación web PHP, y Apache como servidor web,
esta netamente sustentado en los medios de información como internet, libros,
biblioteca virtual, etc. La cual es bastante reciente y ligada estrictamente con el
desarrollo de proyectos informáticos, aprovechando a su vez por la utilización de la
información científica y tecnológica, la misma que sirve como base para dar solución a
la propuesta planteada.
Capitulo III. Marco Propositivo.- contiene la documentación detallada de las
funcionalidades de la aplicación web, las entradas y salidas de datos sobre la utilización
de los usuarios que manipulan el sistema, además se detalla la importancia sobre la
funcionalidad de la aplicación.
El inicio de proyecto “Aplicación Web para la gestión de Soporte Técnico de la
Empresa de Telecomunicaciones Nextel Cía. Ltda. De la Ciudad de Atuntaqui”
generalmente está dado en la solicitud de requerimientos de los usuarios, y siendo que
los diferentes sistemas de Información abordan los diferentes tipos de problemas
organizacionales; podemos clasificar a los Sistemas de Información según sean las
aplicaciones que necesite cada usuario en: Sistemas de Transacciones documentales,
Sistemas de Soporte para la toma de decisiones, y Sistemas de recopilación de
información.
8
1.11.4 Aporte teórico y significación práctica.
Con el uso de las nuevas tecnologías y el aporte teórico, científico y práctico se pretende
llegar hacia un nuevo cambio en lo que se refiere a la gestión de los procesos de soporte
técnico de la Empresa de Telecomunicaciones Nextel Cía. Ltda. De la ciudad de Atuntaqui
Provincia de Imbabura. Lo que lleva un avance muy importante para la empresa, puesto
que estas tecnologías han sido estudiadas he implantadas en diferentes empresas e
instituciones y han logrado éxito en su misión a nivel empresarial.
Dicha aplicación estará desarrollada bajo software libre ya que es una ventaja para la
institución y jefe de proyecto debido a que no incluye costos de software y la integración
de Mysql, como base de datos, el servidor web Apache y el lenguaje de programación web
PHP es novedoso porque es un software libre y muy seguro en el almacenamiento de la
información de la Empresa.
9
CAPITULO II
2. MARCO TEORICO
2.1 Origen y Evolución de las Aplicaciones Web.
Referente a su funcionalidad, en los primeros tiempos de la computación cliente-servidor,
cada aplicación tenía su programa cliente que servía como interfaz de usuario que debía ser
instalado por separado en cada ordenador personal de cada usuario. El cliente realizaba
peticiones a otro programa (el servidor) que le daba la respuesta. Una mejora en el
servidor, como parte de la aplicación, requería normalmente una mejora de los clientes
instalados en cada ordenador personal, añadiendo un coste de soporte técnico y
disminuyendo la productividad. (De La Cruz, 2015)
A diferencia de lo anterior, las aplicaciones web, generan dinámicamente una serie de
páginas en un formato estándar, como HTML o XHTML, que soportan los navegadores
web comunes. Se utilizan lenguajes interpretados en el lado del cliente, tales como
JavaScript, para añadir elementos dinámicos a la interfaz de usuario. Generalmente cada
página web en particular se envía al cliente como un documento estático, pero la secuencia
de páginas ofrece al usuario una experiencia interactiva. Durante la sesión, el navegador
web interpreta y muestra en pantalla las páginas, actuando como cliente para cualquier
aplicación web. (De La Cruz, 2015)
Hablando de diseño, las páginas web comenzaron como simples documentos de texto sin
los adornos modernos con los que se está familiarizado. Como resultado, los navegadores
web en realidad no tendrían que ser capaces de hacer toda esa magia en absoluto. HTML
representaba contenido de acuerdo a una jerarquía semántica, permitiendo que el autor de
la página pudiese elegir la importancia relativa de las diferentes piezas de contenido, de
manera parecida a como un escritor crea capítulos, títulos y párrafos de contenido. (De La
Cruz, 2015)
10
A medida que la web comenzó a despegar, los creadores de sitios web quisieron aumentar
los límites estéticos asociadas a las webs. No se conformaban con documentos de texto
plano y quisieron introducir una serie de efectos como la posibilidad de incorporar
imágenes, organizar el contenido en secciones visuales y tener un “diseño” en torno a los
contenidos que estaban creando.
Una de las etiquetas originales disponibles para los autores de páginas fue la etiqueta
<table>. Fue creada para permitir el etiquetado de datos tabulares (HTML nació de una
comunidad científica después de todo, y los científicos adoran los datos y cifras
organizadas en tablas). Pronto se dieron cuenta de que podían aprovecharse de esas tablas
y las usaron para etiquetar páginas completas, podían organizar diferentes partes de
contenido en áreas específicas de la página. Y así nació el diseño web. (De La Cruz, 2015)
2.2 Análisis de las distintas posiciones teóricas sobre las Aplicaciones web.
2.2.1 Aplicación web
Según el Autor (Cardador, 2014) manifiesta que, la ingeniería del Software, la cual es la
encargada de estudiar los principios y metodologías para el desarrollo y mantenimiento de
sistemas Software, define Aplicación Web como el conjunto de herramientas orientadas al
usuario con el fin de que este pueda acceder a un servidor web mediante el uso de un
navegador web que se conecta a internet o bien a una intranet.
También menciona que una aplicación web es una aplicación Software que se codifica bajo
un determinado lenguaje de programación, que es soportado por los navegadores web y
que sirve para que el usuario pueda interactuar con el servidor web.
Para desarrollar aplicaciones web, se van a usar los lenguajes de programación o bien los
entornos de desarrollo integrado, conocidos como IDE, en los cuales se diseñara mediante
código la aplicación web y luego se podrá ir testeando con las herramientas que ofrece que
dicho código es correcto y cumple con sus objetivos.
11
Las Aplicaciones Web son muy exitosas debido a su independencia del sistema operativo
que tenga instalado el usuario y porque pueden encontrarse de cualquier tipo: web-mails,
tiendas on-line gestión bancaria, blogs, foros, etc. Parte de este éxito se basa también en el
concepto de interactividad que mantienen las aplicaciones web con el usuario. Un ejemplo
es el uso del formulario o gestionar bases de datos.
(Véronneau, 2015) Manifiesta que, puede ser difícil percibir la diferencia entre un sitio
web y una aplicación web. Según el Diccionario Oxford en línea, nos enteramos que una
aplicación es "un programa o conjunto de programas para ayudar al usuario de un
ordenador para procesar una tarea específica". Una aplicación web es básicamente una
manera de facilitar el logro de una tarea específica en la Web, a diferencia de un sitio web
estático que es más bien una herramienta, no menos importante, para la comunicación.
(Alegsa, 2010) Una aplicación web es cualquier aplicación que es accedida vía web por
una red como internet o una intranet. En general, el término también se utiliza para
designar aquellos programas informáticos que son ejecutados en el entorno del navegador
o codificado con algún lenguaje soportado por el navegador (como JavaScript, combinado
con HTML); confiándose en el navegador web para que reproduzca la aplicación.
De acuerdo con los diferentes Autores, Aplicación web es todas aquellas aplicaciones que
las personas pueden utilizar que están alojadas en un servidor web por medio de internet o
de una intranet a través de un navegador en otras palabras es una aplicación de software
que se codifica en un lenguaje soportado por los navegadores web por la que se espera el
óptimo rendimiento del navegador por donde sale la aplicación web.
2.2.1.1 Características
Las aplicaciones web no necesitan instalarse, ya que se visualizan usando el navegador
web del dispositivo.
12
Al tratarse de aplicaciones que funcionan sobre la web, no es necesario que el usuario
reciba actualizaciones, ya que siempre va a estar viendo la última versión.
La base de programación de las aplicaciones web, es el HTML, conjuntamente con
JavaScript y CSS, herramientas ya conocidas para los programadores web.
No se emplea un SDK, lo cual permite programar de forma independiente al sistema
operativo en el cual se usará la aplicación. Por eso, estas aplicaciones pueden ser
fácilmente utilizadas en diferentes plataformas sin mayores inconvenientes y sin
necesidad de desarrollar un código diferente para cada caso particular.
Las aplicaciones web suelen tener una interfaz más genérica e independiente de la
apariencia del sistema operativo. (Cuello, 2013)
2.2.1.2 Tipos
Las aplicaciones web pueden diferenciarse por los diferentes tipos tales como:
2.2.1.2.1 Publicitario
Este tipo de aplicaciones web, enfoca su objetivo principal en lanzar al mundo de la web la
información acerca de su empresa y cada uno de sus artículos y/o productos a usuarios a
nivel mundial mediante la red de internet.
Estas Aplicaciones se orientan particularmente al área de Marketing de la empresa, en
efecto, promocionar la producción y servicios y conseguir mejores y nuevas oportunidades
dentro del mercado.
Características
Impresionar al publico
Ser llamativo y claro para los usuarios que visiten el sitio
No se mantiene siempre en la web
Entre más amplio mejor
13
2.2.1.2.2 Informativo
Las Aplicaciones web Informativas se encuentran en internet con el propósito de mostrar
de forma general la información de la empresa así como también de sus productos o
servicios en la cual se presentaran con un diseño muy distintivo para dar mayor relevancia
a la institución.
Características
Mantener clara la información
Actualización constante
Que esté bien estructurado
Que sea fácil de navegar
2.2.1.2.3 Comunidad
Son Aplicaciones web que se crean con el fin de reunir usuarios con intereses en común,
donde facilita a las comunidades organizadas la publicación en Internet de un evento
mediante la creación de un sitio Web
Características
Usuarios con los mismos intereses
Están diseñadas para informar un evento
Que la red aporte un “valor añadido”
2.2.1.2.4 Catálogo/tienda
Son Aplicaciones web que las empresas implementan en la web con el fin de vender sus
productos en internet de forma directa, así como también pueden tener la posibilidad de
que sus clientes puedan pagar desde el lugar donde se encuentran.
14
Este tipo de aplicaciones Web son una herramienta de marketing que hoy en día ha sido de
gran utilidad y progreso para las empresas.
Características
Es más específico en mostrar un articulo
Actualiza periódicamente la información
Mantiene una estructura de datos
Guardar la información de navegación
Integra una herramienta para buscar
Ventajas
Se facilita el trabajo a distancia.
No se requieren complicadas combinaciones de Hardware/Software para utilizar estas
aplicaciones. Solo un computador con un buen navegador Web.
Las aplicaciones Web son fáciles de usar (no requieren conocimientos avanzados de
computación).
Con una aplicación Web tendrá alta disponibilidad, ya que puede realizar consultas en
cualquier parte del mundo donde tenga acceso a Internet y a cualquier hora.
Desventajas
Para la implantación de la aplicación web implican costos de instalación de equipos de
hardware para la corrida del sistema.
muchos servicios dan un espacio limitado para sus archivos, dependiendo del tipo de
aplicación y aunque puedes agrandar tu espacio no todas las empresas son tan flexibles,
generalmente usan la aplicación web para venderte la física por lo que obliga al usuario
a escoger la última.
Todas las aplicaciones no están libres de amenaza o del delito Informático.
15
2.2.2 Base de datos
Una base de datos prácticamente es un almacén de datos que generalmente se los genera a
través de un sistema o por los mismos SGBD los cuales son importantes para muchos
usuarios o empresas e instituciones etc. En donde quiera que veamos las siglas BD
estamos presenciando contenidos de una base de datos en informática, además debemos
saber que el tema base de datos es un tema considerablemente extenso ya que estas
herramientas que se las ha venido utilizando son de vital importancia y el contenido en
general se subdivide en varias categorías por lo cual lo hace más extenso.
Actualmente se ha ido creando o saliendo diferentes tipos y modelos de bases de datos a
continuación se mostrara algunos de ellos.
2.2.2.1 Tipos de Base de Datos.
Según (González, 2015) Los tipos de base de datos que podemos encontrar atendiendo a la
forma de organizar la información o a su estructura interna son:
2.2.2.1.1 Bases de datos relacionales
Una base de datos relacional es una base de datos en donde todos los datos visibles al
usuario están organizados estrictamente como tablas y en donde todas las operaciones que
se realizan en la base de datos se hacen sobre estas tablas.
2.2.2.1.2 Bases de datos documentales
Estas bases de datos permiten la indexación a texto completo y permiten realizar
búsquedas más competentes.
Las características fundamentales de este tipo de bases de datos son:
Cada registro se corresponde con un documento.
Una base de datos es un conjunto de información estructurada en registros y
almacenada en un soporte electrónico que se puede leer desde un ordenador
16
Todos los registros están asociados a un documento
Este tipo de base de datos está orientado exclusivamente a gestionar de forma efectiva
el almacenamiento y exceso a los documentos
Según el contenido completo de los documentos que describen la base de datos
documentales se pueden clasificar en:
Base de datos a texto completo.- son aquellas que están constituidas por los propios
documentos en formato electrónico, por un volcado completo de su texto. Pueden
incorporar además campos en los que se contiene la información fundamental para
facilitar su descripción y recuperación.
Base de datos referenciales.- sus registros no contiene el texto original si no tan solo la
información fundamental para describir y permitir la localización de documentos
impresos, sonoros, iconográficos, audiovisuales o electrónicos.
Según la cobertura temática, es decir, la disciplina científica o materia que abarca las bases
de datos documentales se pueden clasificar en:
Multidisciplinares
Especializadas
Según el modo de acceso las bases de datos documentales pueden ser:
Bases de datos de acceso local
Bases de datos en DVD
Bases de datos en línea
Las bases de datos se componen de diferentes registros con su correspondiente número de
identificación, en una base de datos bibliografía cada registro se corresponde con una
referencia de un documento original, que puede ser una publicación independiente o una
parte con autonomía de contenido dentro de otra publicación.
17
Otros tipos de bases de datos son:
Base de datos Jerárquicas
En estas base de datos la información es almacenada de acurdo a una estructura jerárquica,
En este tipo de base de datos la organización de la información es similar a la de un árbol
visto al revés, en donde un nodo padre puede tener varios hijos. El nodo que no tiene
padres se llama raíz y los nodos que no tienen hijos se les denominan como hojas.
Estas bases de datos son muy útiles para el caso de aplicaciones en las que se maneja un
gran volumen de información y los datos están muy compartidos, permitiéndonos crear
estructuras estables y con un gran rendimiento.
La redundancia de datos es uno de los principales problemas que presentan estas bases de
datos.
Bases de datos de redes
Este modelo es muy similar al modelo jerárquico su diferencia fundamental es la
modificación del concepto de nodo, ya que se permite que un mismo nodo tenga varios
padres. Esto es una gran mejora ya que permite tratar eficientemente la redundancia de
datos, pero sigue presentando grades problemas para administrar la información de una
base de datos.
Los sistemas jerárquicos y en red forman la primera generación de los SGBD. Pero estos
sistemas presentan algunos inconvenientes como son:
Se necesitan complejos programas y amplios conocimientos de programación para
responder a cualquier tipo de consulta de datos, por simple que esta sea.
la independencia de datos es mínima.
No incluye controles de integridad
Estas bases de datos han sido sustituidas por las bases de datos relacionales.
18
Bases de datos orientadas a objetos
Una base de datos orientada a objetos es una base de datos donde los elementos son objetos
esto puede ser bases de datos multimedia y contener videos, imágenes y sonidos, donde la
herencia nos permite una mejor presentación de la información. Esta base de datos tiene
una identidad de ser un todo y no una sola parte de una gran base.
El objetivo de una base de datos orientada a objetos son los mismos que los de las bases de
datos tradicionales, pero con la ventaja de representar los modelos de datos con un marco
mucho más eficiente, manteniendo la integridad y la relación entre ellos.
Las claves que poseen estas bases de datos son el poder que confieren al diseñador para
especificar tanto la estructura de objetos completos como las operaciones que se pueden
aplicar a esos objetos.
Otra de las ventajas es que manipula datos complejos de forma rápida.
Bases de datos transaccionales.
El único fin de estas bases de datos es el envío y recepción de datos a grandes velocidades.
Estas bases de datos son muy poco comunes y están dirigidos al entorno de análisis de
calidad, datos de producción e industrial, es de gran importancia comprender que su único
fin es recolectar y recuperar los datos a la mayor velocidad posible, por lo tanto, la
redundancia y la duplicación de información no es un problema como las demás bases de
datos.
Bases de datos multidimensionales
Estas surgen para desarrollar aplicaciones muy concretas. Básicamente no se diferencia
demasiado de las bases de datos relacionales, la diferencia está más bien a nivel
conceptual, en la base de datos multidimensional los campos o atributos de la tabla pueden
ser de dos tipos o bien representan dimensiones de la tabla o bien presentan métricas que se
desean estudiar.
19
Bases de datos deductivas.
Estas son un sistema de bases de datos pero con la diferencia de que permiten hacer
deducciones atreves de inferencias. Se basa principalmente en reglar y hechos que son
almacenados en la base de datos.
2.2.2.2 MYSQL
Según (Arias, 2015) MYSQL es un sistema de gestión de base de datos (SGBD), que
utiliza el lenguaje SQL (Lenguaje de consulta estructurada, en inglés Structured Query
Language) como interfaz. Actualmente es una de las bases de datos más populares, con
más de 15 millones de instalaciones en el mundo.
Para el autor (Cobo, 2005) MYSQL es un sistema de administración de bases de datos
relacionales rápido, sólido y flexible. Es ideal para crear bases de datos con acceso desde
páginas web dinámicas, para la creación de sistemas de transacciones on-line o para
cualquier otra solución profesional que implique almacenar datos, teniendo la posibilidad
de realizar múltiples y rápidas consultas.
Según (Cobo, 2005) La utilización conjunta de MySQL con el lenguaje de programación
web PHP permite llegar a desarrollar interesantes aplicaciones web que puedan cubrir las
necesidades de pequeñas empresas que quieran fortalecer su presencia en Internet o
usuarios individuales que quieran generar verdaderas páginas dinámicas. Como
complemento a ambas herramientas, en Internet se pueden encontrar igualmente gestores
de contenidos, aplicaciones basadas en PHP que permiten a los usuarios finales aprovechar
las ventajas de estas tecnologías sin necesidad de tener grandes conocimientos sobre su
funcionamiento y sintaxis de los lenguajes.
2.2.2.2.1 Historia de MYSQL
(Arias, 2015) Manifiesta que, MYSQL fue creado en Suecia por dos suecos y un finlandés:
David Axmark, Allan Larsson y Michael “Monty” Widenius, que han trabajado juntos
20
desde la década de los 1980. Hoy su desarrollo y mantenimiento emplean
aproximadamente 400 profesionales en el mundo entero, y más de mil contribuyen
probando el software, integrándolo en otros productos, y escribiendo acerca de este.
El 16 de enero del 2008, MYSQL AB, desarrolladora de MYSQL fue adquirida por Sun
Microsystems, por un billón de dólares americanos, un precio jamás vista en el sector de
las licencias libres. El 20 de abril de 2009, se anunció que Oracle compraba a Sun
Microsystem y todos sus productos, incluyendo MYSQL.
2.2.2.2.2 Características
Las siguientes características además son consideradas como ventajas ante otros sistemas
gestores de base de datos (SGBD) por su gran velocidad, por ser libre en cuanto a costos
aunque en la actualidad la concesión de licencias ha cambiado de acuerdo con el artículo
mencionado anteriormente en la breve historia de MYSQL, por otro lado podemos
mencionar su estabilidad y potente con todas las características que se requirieren las
aplicaciones web.
A Continuación una lista de las principales características del sistema de base de datos
MYSQL como son:
Interioridades y portabilidad
Escrito en C y en C++
Probado con un amplio rango de compiladores diferentes
Funciona en diferentes plataformas.
Pueden usarse fácilmente múltiple CPUs si están disponibles.
Proporciona sistemas de almacenamiento transaccional y no transaccional.
Relativamente sencillo de añadir otro sistema de almacenamiento. Esto es útil si desea
añadir una interfaz SQL para una base de datos propia.
Un sistema de reserva de memoria muy rápido basado en threads.
Tablas hash en memoria, que son usadas como tablas temporales.
21
Las funciones SQL están implementadas usando una librería altamente optimizada y
deben ser tan rápidas como sea posible. Normalmente no hay reserva de memoria tras
toda la inicialización para consultas.
El servidor está disponible como un programa separado para usar en un entorno de red
cliente/servidor.
También está disponible como biblioteca y puede ser incrustado en aplicaciones
autónomas. Dichas aplicaciones pueden usarse por sí mismas o en entornos donde no
hay red disponible.
2.2.2.2.3 Ventajas
Según (Cobo, 2005) MYSQL ofrece varias ventajas respecto a otros sistemas gestores de
bases de datos:
Tiene licencia pública, permitiendo no solo la utilización del programa sino también la
consulta y modificación de su código fuente. Resulta por tanto fácil de personalizar y
adaptar a las necesidades concretas.
El programa está desarrollado en C y C++, lo que facilita su integración en otras
aplicaciones desarrolladas igualmente en esos lenguajes.
Puede ser descargado gratuitamente de internet (http://www.mysql.com) haciendo uso
de su licencia GPL.
para aquellos que deseen que sus desarrollos basados en MYSQL no sean “código
abierto “existe también una licencia comercial.
MYSQL utiliza el lenguaje SQL (Structured Query Languaje – Lenguaje de consulta
estructurado) que es el lenguaje de consulta más usado y estandarizado para acceder a
las bases de datos relacionales. Soporta la sintaxis estándar del lenguaje SQL para la
realización de consultas de manipulación, creación y selección de datos.
Es un sistema cliente/servidor, permitiendo trabajar como servidor multiusuario y de
subprocesamiento múltiple, es decir cada ver que se establece una conexión con el
servidor, el programa servidor crea un subproceso para manejar la solicitud del cliente,
22
controlando el acceso simultaneo de un gran número de usuarios a los datos y
autorizando el acceso solo a usuarios autorizados.
MYSQL dispone de un sistema sencillo de ayuda en línea, y de un monitor que permite
realizas todas las operaciones desde la línea de comandos del sistema, sin necesitar
ningún tipo de interface de usuario gráfica. Esto facilita la administración remota del
sistema utilizando telnet
Es portable, es decir, se puede ser llevado a cualquier plataforma informática. MYSQL
está disponible en más de veinte plataformas diferentes incluyendo las distribuciones
más usadas de Linux, sistema operativo Mac X, UNIX y Microsoft Windows.
Es posible encontrar gran cantidad de software desarrollado sobre MYSQL o que
soporte MYSQL. En concreto, son de destacar diferentes aplicaciones open sourse
para la administración de las bases de datos a través de un servidor web.
2.2.2.2.4 Arranque del servidor de MYQSL
MYSQL dispone de los programas principales: el servidor o motor y el cliente o monitor
MYSQL. El primero de ellos se encarga de estas a la espera de posibles peticiones
recibidas de los clientes; mientras que el segundo es el encargado de actuar de interfaz con
el usuario.
Para comenzar a utilizar el sistema MYSQL lo primero que se debe hacer es arrancar su
programa servidor. Este programa se ejecutara en un segundo plano como un proceso o
servicio, no tiene una interfaz de usuario y su único propósito es estar a la espera de que
alguien se conecte a él y le envíe una solicitud. (Cobo, 2005)
2.2.3 Servidores web
Físicamente sería un computador donde se instala el programa Servidor, el cual puede
ejecutar las peticiones de diferentes páginas web mediante un navegador web, toda la
información que se publica diariamente en cada sitio web, se almacena o se encuentra
alojada en un espacio distinto, para luego poder interpretar la información digital
almacenada.
23
Para la buena utilización del servidor web y que este funcione correctamente se debe
utilizar un método para intercambiar la información o transferir los sitios web al ordenador,
esto se realiza mediante el protocolo http (protocolo de transferencia de hipertexto), es el
que aparece al inicio en la barra de búsqueda cuando se ingresa cualquier dirección de
internet.
Para (Ramos, 2011) Un servidor web es un programa diseñado para aceptar peticiones
HTTP del navegador y servir las páginas web que tiene alojadas. Para navegar a un sitio
web se necesita saber la dirección web exacta del sitio. Cada sitio web tiene una dirección
única conocida como URL (Uniform Resorurse Locator – Localizador Uniforme de
Recursos). En una URL se pueden distinguir tres partes: el Protocolo, el nombre de
dominio del ordenador servidor y la ruta en el servidor. El protocolo que se utiliza para
servir páginas web es HTTP, el nombre de dominio indica el ordenador de internet que nos
va a dar la información solicitada y la ruta indica la ubicación del archivo solicitado dentro
del servidor (véase figura N°1).
Figura N°1, partes de una URL (Localizador Uniforme de Recursos) - Fuente: (Ramos, 2011).
2.2.3.1 Tipos de servidores web
Apache: este es el más utilizado en todo el mundo, es gratuito y corre sobre toda
plataforma
Microsoft ISS: solo funciona sobre Windows, si se quiere implementar en otro sistema
se deberá utilizar una máquina virtual.
24
Ngnix: este sistema web es muy rápido y corre solamente en sistemas Unix y
Windows.
Lighttp: este también es uno de los más rápidos pero su principal característica está en
que soporta cargas pesadas sin perder balance, utilizando poca memoria RAM y poco
del CPU.
2.2.4 Servidor Apache
Es un servidor web gratuito, el más popular el cual abarca el 70% de los sitios web en el
mundo, este es apto para trabajar con distintos sistemas operativos, ya que es flexible,
eficiente y rápido. El servidor web Apache es utilizado principalmente para realizar
servicios a páginas web ya sean estáticas o dinámicas.
Entre las principales características están:
Soporte de seguridad SSL y TLS
Soporte para lenguajes Perl, Python, Tcl y PHP
Capacidad de manejar más de un millón de visitas por día.
2.2.5 Lenguaje de programación web PHP
(Cobo, 2005) Manifiesta que, PHP es un lenguaje interpretado del lado del servidor que
surge dentro de la corriente denominada código abierto (open source). Se caracteriza por su
potencia, versatilidad, robustez y modularidad. Al igual que ocurre con tecnologías
similares, los programas son integrados directamente dentro del código HTML.
2.2.5.1 Comparativa PHP con Otros lenguajes de programación.
(Cobo, 2005) Comparado con ASP, la principal ventaja de PHP es su carácter
multiplataforma. Por otro lado, los programas en ASP resultan más lentos y pesados, y
también menos estables. En los entornos Microsoft la ventaja de ASP es que los servidores
web de Microsoft soportan directamente ASP sin necesidad de ninguna instalación
adicional Señalar también la existencia de herramientas que permiten convertir programas
25
desarrollados en ASP al lenguaje PHP, una de las más conocidas es asp2php. Comparando
el lenguaje PHP con el lenguaje Perl, utilizado habitualmente en la programación CGI,
puede decirse que PHP fue diseñado para desarrollo de scripts orientados a web, mientras
que Perl fue diseñado para hacer muchas más cosas y debido a esto, se hace muy
complicado. La sintaxis de PHP es menos confusa y más estricta, pero sin perder la
flexibilidad. En comparación con ColdFusion, PHP es más rápido y eficiente para tareas
complejas de programación, además PHP resulta más estable y usa una menor cantidad de
recursos. En definitiva, PHP es uno de los lenguajes más utilizados actualmente en el
desarrollo de aplicaciones web y viene experimentado un constante crecimiento en su nivel
de utilización en Internet.
2.2.5.2 Características
Para (Arias, 2015) El lenguaje PHP es un lenguaje de programación de dominio específico,
es decir, su alcance se extiende a un campo de actuación que es el desarrollo web, aunque
existan variantes como el PHP-GTK. Su propósito principal es de implementar soluciones
web veloces, simples y eficientes. Sus Principales características:
Velocidad y robustez
Estructurado y orientado a objetos
Portabilidad- independencia de plataforma – escriba una vez, ejecute en cualquier lugar
Mecanografiado dinámica
Sintaxis similar a C/C++ Y Perl.
Open-sourse.
2.2.5.3 Constituyentes de un documento PHP
(Arias, 2015) Un documento PHP consta de dos tipos de constituyentes:
Código HTML o XHTML encomenderos, con texto intercalado y con la
especificaciones de estilo que haga falta (con las parejas propiedad / atributo del
HTML o de las hojas de estilo CSS.
instrucciones de PHP, que hacen varios tipos de cometidos:
o recepción de datos exteriores (por ejemplo de un formulario).
26
o Manipulación de datos (cálculos, modificaciones de cadenas de texto, etc.)
o Adopción de decisiones en función de algún dato.
o Presentación de valores de los datos resultantes, implicados dentro del código
HTML
o Acciones sobre el sistema de fichero del servidor, incluyendo la creación,
modificación, lectura, y eliminación de datos.
2.2.6 Navegadores web
Según (Ramos, 2011) Un navegador web (del inglés web browser) es un programa que
permite visualizar la información que contiene una página web, pues interpreta el código
de la página (normalmente HTML) y lo visualiza en la pantalla. Es la herramienta que
utiliza el usuario para moverse e interactuar con la información contenida en la distintas
páginas web en la red.
2.2.6.1 Historia
El primer navegador web apareció en los años 90 concretamente en 1993 y fue
desarrollado en los laboratorios del CERN (centro europea para la investigación nuclear)
de Ginebra, su nombre era Mosaic. Inicialmente solo funcionaba en entorno Unix, pero
pronto aparecieron versiones para Windows (Spyglass Mosaic) y Macintosh. Más tarde
entro en el mercado Netscape Navigator, que rápidamente supero en capacidades y
velocidad a Mosaic. Este navegador era capaz de funciones en entornos Unix y Windows.
En 1995 Microsoft lanzo internet Explorer (IE), el antiguo Spyglass Mosaic. En el año
1997 se escribió el código de este navegador y ello, unido a la aparición del sistema
operativo Windows 98, consiguió desbancar a Netscape.
En la empresa Netscape comunication corporation libero el código fuente de su navegador,
con el fin de recuperar su cuota de mercado, naciendo así el proyecto Mozilla. La
comunidad de usuarios del software libre decidió reescribir el navegador desde cero.
La primera versión apareció en junio del 2002 y era capaz de funciones con múltiple
sistemas operativos.
27
A finales del 2004 apareció en el mercado Firefox, una rama de desarrollo de Mozilla.
Actualmente está consiguiendo una gran popularidad gracias a sus pestañas. Su ligereza y
su versatilidad, basada en un sistema modular de extensiones. (Ramos, 2011)
En la actualidad Existen muchos más navegadores como Ópera, Zafarí, Konqueror,
SeaMonkey, Camino, Maxthon, o Google Chrome. Cada uno de ellos tiene unas
características específicas. (Ramos, 2011)
2.2.7 PHP Runner
(Xlinesoft, 2015) PHPRunner crea un conjunto de páginas PHP para acceder y modificar
cualquier MySQL, Oracle, MS SQL Server, PostgreSQL o base de datos de MS
Access. Usando generados usuarios de páginas PHP puede buscar, editar, borrar y añadir
datos en la base de datos.
Ofrece un gran número de plantillas de aplicación - sitios web temáticos ya hechos con
interfaz gráfica completa y la estructura de base de datos. Todas las plantillas son fáciles de
trabajar y completamente personalizable. La plantilla se podría utilizar como un sitio web
de soporte solo, o se podría integrar con otras aplicaciones web PHPRunner. (Xlinesoft,
2015)
En PHPRunner todas las fuentes de datos y las relaciones entre ellos, incluyendo detalles
magistrales, se muestran visualmente lo que son muy intuitiva para manejar. Es posible
unir dos o más conjuntos de datos con facilidad de arrastrar y soltar. Una vez que se haya
establecido las relaciones, en la solicitud se puede navegar a través de los registros
maestros y rápidamente saltar por encima de los detalles de esos registros. Algunos
escenarios básicos de maestro-detalle relaciones serían datos de clientes y pedidos, o los
pacientes y los registros médicos. (Xlinesoft, 2015)
28
2.2.7.1 Compatibilidad
PHPRunner compatible con las siguientes bases de datos: MySQL, Oracle, Microsoft SQL
Server, MS Access, PostgreSQL, archivos de hojas de cálculo, Informix, DB2, SQLite,
cualquier otra base de datos compatible con ODBC. (Xlinesoft, 2015)
2.2.7.2 Seguridad
PHPRunner que permite proteger con contraseña el acceso a la aplicación web. Puede
codificar ya sea el nombre de usuario y contraseña, almacenar las combinaciones de inicio
de sesión en la base de datos o utilizar la autenticación de Active Directory. Puede agregar
la opción inicio de sesión con Facebook a su sitio. PHPRunner también le permite
establecer el permiso grupos de usuarios donde se pueden restringir las tablas y vistas,
páginas y la funcionalidad del sitio, ya sea a la derecha en el software o en línea.
(Xlinesoft, 2015)
2.2.7.3 Características
Viene con funcionalidad incorporada AJAX basada en la toma de sus sitios web mucho
más fácil de usar
Conexiones de bases de datos múltiples.
Compatibilidad con Active Directory
Permitirá crear y modificar tablas justo en el software.
Permite subir todo el conjunto de páginas a un servidor web a través de FTP
Permite integrar sin problemas las aplicaciones web que construya en su sitio web
existente. Podrá asemejarse a la apariencia de todas sus páginas.
Ofrece una gran variedad de controles de edición, que le permiten personalizar el
aspecto de los campos de editar y añadir páginas
Cuadros desplegables dependientes
Cargar los documentos e imágenes de cualquier tipo a la base de datos o en un
directorio en el servidor web
Controles editor de texto enriquecido
Puede personalizar el aspecto visual de la aplicación web mediante la selección de una
amplia gama de diseños de página y esquemas de color y su modificación
Permite establecer permisos dinámicos
29
2.2.7.4 Requisitos del sistema
Para ejecución de PHPRunner, el sistema debe estar equipado con lo siguiente:
Windows 8, Windows 7, Windows 2008, Windows Vista.
· Internet Explorer 9.
2.2.7.5 Requisitos del servidor Web
Internet Information Server (5.0 o posterior) o Apache.
PHP 5.x o mejor
PHPRunner viene con servidor web integrado, así que es perfecto para las pruebas
locales.
2.2.7.6 Bases de datos soportadas
MySQL 4.x, 5.x MySQL
Microsoft SQL Server
PostgreSQL
Oracle
DB2
Informix
SQLite
Cualquier base de datos ODBC habilitado
2.2.8 JavaScript
Según (Gauchat, 2012) Javascript es un lenguaje interpretado usado para múltiples
propósitos pero solo considerado como un complemento hasta ahora. Una de las
innovaciones que ayudó a cambiar el modo en que vemos Javascript fue el desarrollo de
nuevos motores de interpretación, creados para acelerar el procesamiento de código. La
clave de los motores más exitosos fue transformar el código Javascript en código máquina
para lograr velocidades de ejecución similares a aquellas encontradas en aplicaciones de
30
escritorio. Esta mejorada capacidad permitió superar viejas limitaciones de rendimiento y
confirmar el lenguaje Javascript como la mejor opción para la web.
Para aprovechar esta prometedora plataforma de trabajo ofrecida por los nuevos
navegadores, Javascript fue expandido en relación con portabilidad e integración. A la vez,
interfaces de programación de aplicaciones (APIs) fueron incorporadas por defecto en cada
navegador para asistir al lenguaje en funciones elementales. Estas nuevas APIs (como Web
Storage, Canvas, y otras) son interfaces para librerías incluidas en navegadores. La idea es
hacer disponible poderosas funciones a través de técnicas de programación sencillas y
estándares, expandiendo el alcance del lenguaje y facilitando la creación de programas
útiles para la web.
2.2.8.1 Incorporación de Javascript
Siguiendo los mismos lineamientos que en CSS, existen tres técnicas para incorporar
código Javascript dentro de HTML. Sin embargo, al igual que en CSS, solo la inclusión de
archivos externos es la recomendada a usar en HTML5. (Gauchat, 2012)
2.2.8.1.1 JavaScript En línea
(Gauchat, 2012) Esta es una técnica simple para insertar Javascript en nuestro documento
que se aprovecha de atributos disponibles en elementos HTML. Estos atributos son
manejadores de eventos que ejecutan código de acuerdo a la acción del usuario.
Los manejadores de eventos más usados son, en general, los relacionados con el ratón,
como por ejemplo onclick, onMouseOver, u onMouseOut. Sin embargo, encontraremos
sitios web que implementan eventos de teclado y de la ventana, ejecutando acciones luego
de que una tecla es presionada o alguna condición en la ventana del navegador cambia (por
ejemplo, onload u onfocus).
2.2.8.1.2 JavaScript Embebido
Según (Gauchat, 2012) Para trabajar con códigos extensos y funciones personalizadas
debemos agrupar los códigos en un mismo lugar entre etiquetas <script>. El elemento
31
<script> actúa exactamente igual al elemento <style> usado para incorporar estilos CSS.
Nos ayuda a organizar el código en un solo lugar, afectando a los elementos HTML por
medio de referencias.
Del mismo modo que con el elemento <style>, en HTML5 no debemos usar ningún
atributo para especificar lenguaje. Ya no es necesario incluir el atributo type en la etiqueta
<script>. HTML5 asigna Javascript por defecto.
2.2.8.2 Archivos externos
Para (Gauchat, 2012) Los códigos Javascript crecen exponencialmente cuando agregamos
nuevas funciones y aplicamos algunas de las APIs mencionadas previamente. Códigos
embebidos incrementan el tamaño de nuestros documentos y los hacen repetitivos (cada
documento debe volver a incluir los mismos códigos). Para reducir los tiempos de
descarga, incrementar nuestra productividad y poder distribuir y reusar nuestros códigos en
cada documento sin comprometer eficiencia, recomendamos grabar todos los códigos
Javascript en uno o más archivos externos y llamarlos usando el atributo src.
2.2.8.3 Manejadores de eventos en JavaScript
En Javascript las acciones de los usuarios son llamadas eventos. Cuando el usuario realiza
una acción, como un clic del ratón o la presión de una tecla, un evento específico para cada
acción y cada elemento es disparado. Además de los eventos producidos por los usuarios
existen también otros eventos disparados por el sistema (por ejemplo, el evento load que se
dispara cuando el documento es completamente cargado). Estos eventos son manejados por
códigos o funciones. El código que responde al evento es llamado manejador. Cuando
registramos un manejador lo que hacemos es definir cómo nuestra aplicación responderá a
un evento en particular. Luego de la estandarización del método addEventListener(), este
procedimiento es usualmente llamado “escuchar al evento”, y lo que hacemos para
preparar el código que responderá a ese evento es “agregar una escucha” a un elemento en
particular. (Gauchat, 2012)
32
2.2.9 JQuery
(Gauchat, 2012) Esta es la librería web más popular disponible en estos días. La librería
jQuery es gratuita y fue diseñada para simplificar la creación de sitios web modernos.
Facilita la selección de elementos HTML, la creación de animaciones y efectos, y también
controla eventos y ayuda a implementar Ajax en nuestras aplicaciones.
La librería jQuery se encuentra en un archivo pequeño que se puede descargar desde
www.jquery.com y luego incluir en nuestros documentos usando la etiqueta <script>.
Provee una API sencilla que cualquiera puede aprender y rápidamente aplicar a sus
proyectos.
Una vez que el archivo provisto por jQuery es incluido en nuestro documento, ya estamos
listos para aprovechar los métodos simples incorporados por la librería y convertir nuestra
web estática en una moderna y práctica aplicación.
JQuery tiene la ventaja de proveer soporte para viejos navegadores y vuelve simple tareas
cotidianas. Puede ser utilizado junto con HTML5 o como una forma simple de reemplazar
funciones de HTML5 en navegadores que no están preparados para esta tecnología.
2.2.10 HTML5
(Gauchat, 2012) HTML5 provee básicamente tres características: estructura, estilo y
funcionalidad. Nunca fue declarado oficialmente pero, incluso cuando algunas APIs
(Interface de Programación de Aplicaciones) y la especificación de CSS3 por completo no
son parte del mismo, HTML5 es considerado el producto de la combinación de HTML,
CSS y Javascript. Estas tecnologías son altamente dependientes y actúan como una sola
unidad organizada bajo la especificación de HTML5. HTML está a cargo de la estructura,
CSS presenta esa estructura y su contenido en la pantalla y Javascript hace el resto que
(como veremos más adelante) es extremadamente significativo.
HTML5 es, de hecho, una mejora de esta combinación, el pegamento que une todo.
HTML5 propone estándares para cada aspecto de la web y también un propósito claro para
cada una de las tecnologías involucradas. A partir de ahora, HTML provee los elementos
estructurales, CSS se encuentra concentrado en cómo volver esa estructura utilizable y
33
atractiva a la vista, y Javascript tiene todo el poder necesario para proveer dinamismo y
construir aplicaciones web completamente funcionales.
2.2.10.1 Historia
Todo comenzó mucho tiempo atrás con una simple versión de HTML propuesta para crear
la estructura básica de páginas web, organizar su contenido y compartir información. El
lenguaje y la web misma nacieron principalmente con la intención de comunicar
información por medio de texto. (Gauchat, 2012)
El limitado objetivo de HTML motivó a varias compañías a desarrollar nuevos lenguajes y
programas para agregar características a la web nunca antes implementadas. Estos
desarrollos iniciales crecieron hasta convertirse en populares y poderosos accesorios.
Simples juegos y bromas animadas pronto se transformaron en sofisticadas aplicaciones,
ofreciendo nuevas experiencias que cambiaron el concepto de la web para siempre.
(Gauchat, 2012)
2.2.10.2 Elementos más relevantes de HTML5
(Gauchat, 2012) La especificación también incluye algunos elementos con la única tarea de
proveer estilos.
Esta es una lista de los que consideramos más relevantes:
<header> Este elemento presenta información introductoria y puede ser aplicado en
diferentes secciones del documento. Tiene el propósito de contener la cabecera de una
sección pero también puede ser utilizado para agrupar índices, formularios de búsqueda,
logos, etc…
<nav> Este elemento indica una sección de enlaces con propósitos de navegación, como
menús o índices. No todos los enlaces dentro de una página web tienen que estar dentro de
un elemento <nav>, solo aquellos que forman partes de bloques de navegación.
<section> Este elemento representa una sección general del documento. Es usualmente
utilizado para construir varios bloques de contenido (por ejemplo, columnas) con el
propósito de ordenar el contenido que comparte una característica específica, como
capítulos o páginas de un libro, grupo de noticias, artículos, etc…
34
<aside> Este elemento representa contenido que está relacionado con el contenido
principal pero no es parte del mismo. Ejemplos pueden ser citas, información en barras
laterales, publicidad, etc…
<footer> Este elemento representa información adicional sobre su elemento padre. Por
ejemplo, un elemento
<footer> insertado al final del cuerpo proveerá información adicional sobre el cuerpo del
documento, como el pie normal de una página web. Puede ser usado no solo para el cuerpo
sino también para diferentes secciones dentro del cuerpo, otorgando información adicional
sobre estas secciones específicas.
<article> Este elemento representa una porción independiente de información relevante
(por ejemplo, cada artículo de un periódico o cada entrada de un blog). El elemento
<article> puede ser anidado y usado para mostrar una lista dentro de otra lista de ítems
relacionados, como comentarios de usuarios en entradas de blogs, por ejemplo.
<hgroup> Este elemento es usado para agrupar elementos H cuando la cabecera tiene
múltiples niveles (por ejemplo, una cabecera con título y subtítulo).
<figure> Este elemento representa una porción independiente de contenido (por ejemplo,
imágenes, diagramas o videos) que son referenciadas desde el contenido principal. Esta es
información que puede ser removida sin afectar el fluido del resto del contenido.
<figcaption> Este elemento es utilizado para mostrar una leyenda o pequeño texto
relacionado con el contenido de un elemento <figure>, como la descripción de una
imagen.
<mark> Este elemento resalta un texto que tiene relevancia en una situación en particular
o que ha sido mostrado en respuesta de la actividad del usuario.
<small> Este elemento representa contenido al margen, como letra pequeña (por ejemplo,
descargos, restricciones legales, declaración de derechos, etc…).
<cite> Este elemento es usado para mostrar el título de un trabajo (libro, película, poema,
etc…).
<address> Este elemento encierra información de contacto para un elemento <article> o
el documento completo. Es recomendable que sea insertado dentro de un elemento
<footer>.
<time> Este elemento se utiliza para mostrar fecha y hora en formatos comprensibles por
los usuarios y el navegador.
El valor para los usuarios es ubicado entre las etiquetas mientras que el específico para
programas y navegadores es incluido como el valor del atributo datetime. Un segundo
35
atributo optativo llamado pubdate es usado para indicar que el valor de datetime es la
fecha de publicación.
2.2.11 CSS3
(Gauchat, 2012) CSS es un lenguaje que trabaja junto con HTML para proveer estilos
visuales a los elementos del documento, como tamaño, color, fondo, bordes, etc. La
versión 3 de CSS sigue el mismo camino, pero esta vez con un mayor compromiso. La
especificación de HTML5 fue desarrollada considerando CSS a cargo del diseño. Debido a
esta consideración, la integración entre HTML y CSS es ahora vital para el desarrollo web
y esta es la razón por la que cada vez que mencionamos HTML5 también estamos
haciendo referencia a CSS3, aunque oficialmente se trate de dos tecnologías
completamente separadas.
2.2.11.1 Historia
La primera versión de CSS (hojas de estilo en cascada) apareció en su primera versión en
1996 con la denominada versión CSS1, en el cual ha dado un avance muy importante en el
mundo del internet y un motivo más para los diseñadores. En mayo de 1998 la W3C lanzó
CSS2 que luego de tres años tras una revisión la denominaron como CSS2.1, pero los
rumores de los programadores y diseñadores más importantes comentaban que no faltaba
mucho tiempo en la que pronto apareciera una nueva versión de CSS, ya que las
necesidades y las ventajas que les brindaba eran realmente necesarias para su avance. Lo
que la W3C pronto lanzo la versión CSS3 pero lo que no sabían es que ha estado
trabajando en esta versión desde hace una década para su presentación. (Gauchat, 2012)
2.2.11.2 las nuevas propiedades de CSS3
(Gauchat, 2012) CSS3 provee nuevas propiedades para crear efectos visuales y dinámicos
que son parte esencial de la web en estos días.
border-radius Esta propiedad genera esquinas redondeadas para la caja formada por el
elemento. Posee dos parámetros diferentes que dan forma a la esquina. El primer
parámetro determina la curvatura horizontal y el segundo la vertical, otorgando la
36
posibilidad de crear una elipsis. Para declarar ambos parámetros de la curva, los valores
deben ser separados por una barra (por ejemplo, border-radius: 15px / 20px). Usando
solo un valor determinaremos la misma forma para todas las esquinas (por ejemplo,
border-radius: 20px). Un valor para cada esquina puede ser declarado en un orden que
sigue las agujas del reloj, comenzando por la esquina superior izquierda.
Box-shadow Esta propiedad crea sombras para la caja formada por el elemento. Puede
tomar cinco parámetros: el color, el desplazamiento horizontal, el desplazamiento vertical,
el valor de difuminación, y la palabra clave inset para generar una sombra interna. Los
desplazamientos pueden ser negativos, y el valor de difuminación y el valor inset son
opcionales (por ejemplo, box-shadow: #000000 5px 5px 10px inset).
text-shadow Esta propiedad es similar a box-shadow pero específica para textos.Toma
cuatro parámetros: el color, el desplazamiento horizontal, el desplazamiento vertical, y el
valor de difuminación (por ejemplo, text-shadow: #000000 5px 5px 10px).
@font-face Esta regla nos permite cargar y usar cualquier fuente que necesitemos.
Primero, debemos declarar la fuente, proveer un nombre con la propiedad font-family y
especificar el archivo con src (por ejemplo, @fontface{ font-family: Mifuente; src:
url('font.ttf') }). Luego de esto, podremos asignar la fuente (en el ejemplo Mifuente) a
cualquier elemento del documento.
Linear-gradient (posición inicio, color inicial, color final) Esta función puede ser
aplicada a las propiedades background o background-image para generar un gradiente
lineal. Los atributos indican el punto inicial y los colores usados para crear el gradiente. El
primer valor puede ser especificado en pixeles, en porcentaje o usando las palabras clave
top, bottom, left y right. El punto de inicio puede ser reemplazado por un ángulo para
proveer una dirección específica para el gradiente (por ejemplo, linear-gradient(top,
#FFFFFF 50%, #006699 90%);).
Radial-gradient (posición inicio, forma, color inicial, color final) Esta función puede ser
aplicada a las propiedades background o background-image para generar un gradiente
radial. La posición de inicio es el origen y puede ser declarado en pixeles, porcentaje o
como una combinación de las palabras clave center, top, bottom, left y right. Existen dos
37
valores para la forma: circle y ellipse, y puntos de terminación pueden ser declarados para
cada color indicando la posición donde la transición comienza (por ejemplo, radial-
gradient(center, circle, #FFFFFF 0%, #006699 200%);).
rgba() Esta función es una mejora de rgb(). Toma cuatro valores: el color rojo (0-255), el
color verde (0-255), el color azul (0-255), y la opacidad (un valor entre 0 y 1).
hsla() Esta función es una mejora de hsl(). Puede tomar cuatro valores: el tono (un valor
entre 0 y 360), la saturación (un porcentaje), la luminosidad (un porcentaje), y la opacidad
(un valor entre 0 y 1).
outline Esta propiedad fue mejorada con la incorporación de otra propiedad llamada
outline-offset. Ambas propiedades combinadas generan un segundo borde alejado del
borde original del elemento (por ejemplo, outline: 1px solid #000000; outline-offset:
10px;).
border-image Esta propiedad crea un borde con una imagen personalizada. Necesita que
el borde sea declarado previamente con las propiedades border o border-with, y toma al
menos tres parámetros: la URL de la imagen, el tamaño de las piezas que serán tomadas de
la imagen para construir el borde, y una palabra clave que especifica cómo esas piezas
serán ubicadas alrededor del elemento (por ejemplo, border-image: url("file.png") 15
stretch;).
transform Esta propiedad modifica la forma de un elemento. Utiliza cuatro funciones
básicas: scale (escalar), rotate (rotar), skew (inclinar), y translate (trasladar o mover). La
función scale recibe solo un parámetro. Un valor negativo invierte el elemento, valores
entre 0 y 1 reducen el elemento y valores mayores que 1 expanden el elemento (por
ejemplo, transform: scale(1.5);). La función rotate usa solo un parámetro expresado en
grados para rotar el elemento (por ejemplo, transform: rotate(20deg);). La función skew
recibe dos valores, también en grados, para la transformación horizontal y vertical (por
ejemplo, transform: skew(20deg, 20deg);). La función translate mueve el objeto tantos
pixeles como sean especificados por sus parámetros (por ejemplo, transform:
translate(20px);).
38
transition Esta propiedad puede ser aplicada para crear una transición entre dos estados de
un elemento. Recibe hasta cuatro parámetros: la propiedad afectada, el tiempo que le
tomará a la transición desde el comienzo hasta el final, una palabra clave para especificar
cómo la transición será realizada (ease, linear, ease-in, ease-out, ease-in-out) y un valor
de retardo que determina el tiempo que la transición tardará en comenzar (por ejemplo,
transition: color 2s linear 1s;). (Gauchat, 2012)
2.3 Valoración crítica de los conceptos principales de las distintas posiciones
teóricas sobre las aplicaciones web.
En la actualidad el mundo de la tecnología avanzado a pasos agigantados el uso de las
aplicaciones web en diferentes empresas e instituciones financieras, comerciales y
educativas ha dado lugar a un óptimo y ágil desempeño en el avance y crecimiento a nivel
empresarial, permitiendo automatizar la transición de datos con exactitud y velocidad al
mismo tiempo ahorrar tiempo y recursos económicos en mano de obra ya que estas
aplicaciones web tienden a tener diferentes e incluso múltiples tareas dentro de una
empresa o institución.
Las aplicaciones web actualmente son utilizadas en las grandes y medianas empresas ya
que por medio de estas pueden lograr optimizar el servicio, el trabajo, mejor desempeño y
ayuda en la competitividad del negocio ya que la importancia en el manejo de estas
tecnologías logran el avance y adelanto de cualquier empresa o institución.
De acuerdo con el análisis que se ha realizado en cuanto a la utilización de las aplicaciones
por la web para la ayuda del trabajo en las empresas en el área de telecomunicaciones, se
ha notado un ligero avance por parte de las empresas que han implantado dentro de su
sistema laboral.
39
2.4 Conclusiones parciales del capítulo.
La base teórica del presente informe esta netamente sustentado en los medios de
información como internet, libros, biblioteca virtual, etc. La cual es bastante reciente y
ligada estrictamente con el desarrollo de proyectos informáticos.
La investigación previamente realizada en cada uno de los aspectos en cuanto a la
determinación de la problemática, ha sido de gran ayuda para definir e iniciar la
elaboración de la propuesta, sustentada teórica y tecnológicamente en cada uno de los
conceptos descritos en este capítulo.
Gracias a las nuevas tecnologías que hoy en día ofrecen para la ayuda de construcción
de aplicaciones web, es donde se puede lograr satisfacer las necesidades del usuario de
acuerdo a las actividades o negocio que realice.
40
CAPÍTULO III
3. MARCO PROPOSITIVO
3.1 Tema:
Aplicación web para la gestión de soporte técnico de la empresa de Telecomunicaciones
Nextel Cía. Ltda. De la ciudad de Atuntaqui.
3.2 Descripción de la propuesta
El propósito de este documento es recoger, analizar y definir las necesidades de alto nivel
y las características de un sitio web que proporciona el servicio de gestión en los procesos
de gestión de Soporte Técnico de Nextel Cía. Ltda.
El documento se centra en la necesidad requerida por los participantes en el proyecto y los
usuarios finales que intervendrán.
Esta funcionalidad se basa en proporcionar y dar a conocer a la Compañía “Nextel Cía.
Ltda, los servicios que ofrece el personal de Soporte y Clientes los beneficios y
obligaciones.
3.3 Desarrollo de la propuesta
La propuesta de solución planteada como solución al problema descrito en el capítulo
inicial, consiste en la implementación de una Aplicación Web la cual ha sido elaborada en
base a los siguientes pasos:
3.3.1 Metodología de Desarrollo
Para el desarrollo de este sistema de información se ha elegido la metodología de cascada o
lineal, ya que su enfoque metodológico ordena rigurosamente las etapas del ciclo de vida
del software, de tal forma que el inicio de cada etapa debe esperar a la finalización de la
inmediatamente anterior; siendo las siguientes etapas, Análisis de requisitos, Diseño del
41
Sistema, Desarrollo, Pruebas, Implantación y Mantenimiento.
3.3.2 Análisis previo
En esta fase se describen los principales procesos que se realizan en la gestión de Soporte
Técnico por parte de los empleados del área, así como también el personal de atención al
cliente y bodega.
3.3.2.1 Modelo de casos de uso para Nextel. Cía. Ltda.
La Empresa Nextel. Cía. Ltda. Consta con las siguientes áreas o departamentos.
1. Administrativa
2. Soporte Técnico
3. Atención al Cliente
4. Bodega
La Empresa de Telecomunicaciones Nextel. Cía. Ltda. Tiene un sistema de gestión de
Soporte Técnico donde los procesos se realizan de forma inadecuada y no cuenta con una
aplicación web donde promociona la información necesaria para realizar dichos procesos.
A continuación se presentan los siguientes diagramas de casos de uso establecidos para los
diferentes procesos que realiza la aplicación web.
3.3.2.1.1 Casos de uso atención al cliente
Figura N°2, caso de uso Atención al cliente - Fuente: Autor
42
3.3.2.1.1.1 Creación de actividades
3.3.2.1.1.1.1 Descripción
En este caso de uso la persona de Atención al cliente tiene la necesidad de ingresar al
sistema con los datos de autentificación proporcionados por el administrador del sistema,
ya que debe subir toda la información de los clientes que solicitan servicio y soporte.
3.3.2.1.1.1.2 Flujo de Eventos
1. El personal de Atención al cliente ingresa al sistema.
2. Ingresa clientes
3. Ingresa instalación
4. Guarda la información.
5. Busca cliente para asignar soportes a Técnicos
6. Asigna soporte a Técnicos
7. Crea actividades laborales para el Técnico durante la jornada laboral.
8. Edita y actualiza información.
Figura N°3, Flujo de eventos Atención al cliente - Fuente: Autor
3.3.2.1.2 Casos de uso del técnico.
Figura N°4, caso de uso del Técnico - Fuente: Autor.
43
3.3.2.1.2.1 Creación De actividades
3.3.2.1.2.1.1 Descripción
El Técnico no tiene la autorización para el ingreso a la parte administrativa del sistema
solo puede ingresar la información de sus actividades de instalaciones y soporte al módulo
informativo.
En este caso de uso el Técnico tiene la necesidad de ingresar al sistema con los datos de
autentificación proporcionados por el administrador del sistema, ya que debe subir toda la
información de las instalaciones realizadas tanto como detalles de enlace series de los
equipos instalados, y todos los datos de instalación, así como también ingresar los cambios
realizado cuando sean revisiones.
3.3.2.1.2.1.2 Flujo de eventos
1. Ingresa al sistema
2. Revisa soportes asignados
3. Realiza soporte
4. Ingresa cambios
5. Revisa Instalaciones
6. Realiza Instalaciones
7. Ingresa datos del enlace
Figura N°5, Flujo de eventos Técnico - Fuente: Autor.
3.3.2.1.3 Casos de uso Jefe Técnico.
Figura N°6, caso de uso del Jefe Técnico - Fuente: Autor.
44
3.3.2.1.3.1 Creación de actividades
3.3.2.1.3.1.1 Descripción
El Jefe Técnico una vez ingresado a la aplicación web con los datos de autentificación
proporcionados por el administrador del sistema, podrá seleccionar el menú que desee ya
que puede revisar las actividades de los Técnicos, así como también podrá ingresar
soportes he instalaciones, actividades de infraestructura o a fines. Todos estos datos serán
agregados o modificados en la base de datos al momento de guardar.
3.3.2.1.3.1.2 Flujo de eventos
1 Ingresa al sistema.
2 Actualiza información de soportes he instalaciones.
3 Busca cliente para asignar soportes a Técnicos
4 Ingresa instalación
5 Asigna soporte a Técnicos
6 Crea actividades laborales para el Técnico durante la jornada laboral.
7 Ingresa observaciones de soportes
8 Guarda la información.
Figura N°7, Flujo de eventos Jefe Técnico - Fuente: Autor.
3.3.2.1.4 Casos de uso del personal de bodega
Figura N°8, caso de uso del área de bodega - Fuente: Autor.
45
3.3.2.1.4.1 Creación de actividades
3.3.2.1.4.1.1 Descripción
El personal encargado de bodega una vez ingresado a la aplicación web podrá seleccionar
el menú que desea ya que es quien gestiona el módulo de inventario, además en quien
asigna equipos y materiales según las actividades de los Técnicos.
3.3.2.1.4.1.2 Flujo de eventos
1. Ingreso al sistema
2. Ingresa al módulo inventario
3. Ingresa categorías
4. Ingresa equipos
5. Realiza la búsqueda de equipos y materiales para asignar a Técnicos
6. Registra la salida de equipos y materiales
7. Guarda información
Figura N°9, Flujo de eventos del área de bodega - Fuente: Autor.
3.3.2.1.5 Casos de uso del administrador
Figura N°10, caso de uso del Administrador - Fuente: Autor
46
3.3.2.1.5.1 Creación de actividades
3.3.2.1.5.1.1 Descripción
El Administrador es quien tiene la facultad de ver y revisar todos los procesos que se
realicen en el sistema ya que es el indicado de dar mantenimiento del sistema y la base de
datos
3.3.2.1.5.1.2 Flujo de eventos
1. Ingreso al sistema
2. Ingreso de parámetros
3. Mantenimiento a la base de datos
4. Realiza consultas
5. Realiza el mantenimiento del Sistema
6. Es quien da los privilegios de usuarios
7. Crea usuarios
8. Coordina las actividades que deberán seguir los empleados de la empresa de las
Diferentes áreas, para las respectivas revisiones e ingresar datos en la BBDD.
9. Reportes
Figura N°11, Flujo de eventos del Administrador - Fuente: Autor.
3.3.3 Diseño
El presente sistema de aplicación web está conformado de los siguientes módulos:
Soportes. En este módulo el personal de soporte visualiza todas las actividades asignadas a
cada Técnico
Ingresos de clientes. Este módulo permite registrar datos de los clientes.
47
Seguridad. En este módulo el sistema controla el rol de usuarios y permite el registro e
identificación de cada uno de los trabajadores.
Inventario. Este módulo controla la entrada, existencia y salida de equipos y materiales
que adquiere la empresa.
Diseño de la base de datos
A continuación se presenta el diseño de la base de datos en donde actualmente cuenta con
17 tablas las cuales se relacionan entre si según los procesos que se realicen.
Esta base de datos está diseñada de acuerdo a las necesidades y los requerimientos que se
han detectado en la Empresa “Nextel. Cía. Ltda. “En lo que refiere a la gestión de Soporte
Técnico.
Diseño de la base de datos
Figura N°12, Diseño de la base de datos - Fuente: Autor
48
Modelo lógico de la Base de datos
Figura N°13, Modelo lógico de la base de datos - Fuente: Autor
Modelo Físico de la Base de datos
Figura N°14, Modelo Físico de la base de datos - Fuente: Autor
49
Script de la base de datos
CREATE TABLE IF NOT EXISTS `categoria` (
`IDCATEGORIA` int(11) NOT NULL AUTO_INCREMENT,
`CATEGORIA` varchar(50) DEFAULT NULL,
`DESCRIPCION` varchar(50) DEFAULT NULL,
`ESTADO` varchar(10) DEFAULT NULL,
PRIMARY KEY (`IDCATEGORIA`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=3 ;
INSERT INTO `categoria` (`IDCATEGORIA`, `CATEGORIA`, `DESCRIPCION`, `ESTADO`) VALUES
CREATE TABLE IF NOT EXISTS `ciudad` (
`IDCIUDAD` int(11) NOT NULL AUTO_INCREMENT,
`IDPROVINCIA` int(11) DEFAULT NULL,
`CIUDAD` varchar(50) DEFAULT NULL,
`ESTADO` varchar(10) DEFAULT NULL,
PRIMARY KEY (`IDCIUDAD`),
KEY `FK_REFERENCE_11` (`IDPROVINCIA`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=3 ;
INSERT INTO `ciudad` (`IDCIUDAD`, `IDPROVINCIA`, `CIUDAD`, `ESTADO`) VALUES
CREATE TABLE IF NOT EXISTS `cliente` (
`CEDULA` varchar(13) NOT NULL,
`APELLIDOS` varchar(50) DEFAULT NULL,
`NOMBRES` varchar(50) DEFAULT NULL,
`EDAD` varchar(20) DEFAULT NULL,
`DIRECCION` varchar(100) DEFAULT NULL,
`MAIL` varchar(100) DEFAULT NULL,
`TELEFONO` varchar(50) DEFAULT NULL,
`CELULAR` varchar(50) DEFAULT NULL,
`SEXO` varchar(10) DEFAULT NULL,
`REFERENCIA` varchar(100) DEFAULT NULL,
`ESTADO` varchar(10) DEFAULT NULL,
PRIMARY KEY (`CEDULA`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1;
INSERT INTO `cliente` (`CEDULA`, `APELLIDOS`, `NOMBRES`, `EDAD`, `DIRECCION`, `MAIL`, `TELEFONO`, `CELULAR`,
`SEXO`, `REFERENCIA`, `ESTADO`) VALUES
CREATE TABLE IF NOT EXISTS `detallesalidaequipos` (
`IDDETALLSALEQ` int(11) NOT NULL AUTO_INCREMENT,
PRIMARY KEY (`IDDETALLSALEQ`),
KEY `FK_REFERENCE_15` (`IDSALIDAEQUIPOS`),
KEY `FK_REFERENCE_16` (`IDEQUIPO`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=2 ;
CREATE TABLE IF NOT EXISTS `equipo` (
`IDEQUIPO` int(11) NOT NULL AUTO_INCREMENT,
`IDCATEGORIA` int(11) DEFAULT NULL,
`CODIGO` varchar(50) DEFAULT NULL,
`MARCA` varchar(50) DEFAULT NULL,
`DESCRIPCION` varchar(50) DEFAULT NULL,
`CANTIDAD` int(11) DEFAULT NULL,
`ESTADO` varchar(50) DEFAULT NULL,
PRIMARY KEY (`IDEQUIPO`),
KEY `FK_REFERENCE_13` (`IDCATEGORIA`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=5 ;
INSERT INTO `equipo` (`IDEQUIPO`, `IDCATEGORIA`, `CODIGO`, `MARCA`, `DESCRIPCION`, `CANTIDAD`, `ESTADO`)
VALUES
CREATE TABLE IF NOT EXISTS `personal` ( `CEDULAP` varchar(13) NOT NULL,
`APELLIDOS` varchar(100) DEFAULT NULL,
`NOMBRES` varchar(100) DEFAULT NULL,
`DIRECCION` varchar(100) DEFAULT NULL,
`EDAD` varchar(10) DEFAULT NULL,
`TELEFONO` varchar(50) DEFAULT NULL,
`CELULAR` varchar(50) DEFAULT NULL,
`SEXO` varchar(100) DEFAULT NULL,
`CARGO` varchar(100) DEFAULT NULL,
`MAIL` varchar(50) DEFAULT NULL,
`ESTADO` varchar(10) DEFAULT NULL,
50
PRIMARY KEY (`CEDULAP`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1;
INSERT INTO `personal` (`CEDULAP`, `APELLIDOS`, `NOMBRES`, `DIRECCION`, `EDAD`, `TELEFONO`, `CELULAR`,
`SEXO`, `CARGO`, `MAIL`, `ESTADO`) VALUES
CREATE TABLE IF NOT EXISTS `provincia` (
`IDPROVINCIA` int(11) NOT NULL AUTO_INCREMENT,
`PROVINCIA` varchar(50) DEFAULT NULL,
`ESTADO` varchar(10) DEFAULT NULL,
PRIMARY KEY (`IDPROVINCIA`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=4 ;
INSERT INTO `provincia` (`IDPROVINCIA`, `PROVINCIA`, `ESTADO`) VALUES
CREATE TABLE IF NOT EXISTS `solicitud` (
`IDSOLICITUD` int(11) NOT NULL AUTO_INCREMENT,
`CEDULA` varchar(13) DEFAULT NULL,
`IDCIUDAD` int(11) DEFAULT NULL,
`CEDULAP` varchar(13) DEFAULT NULL,
`FECHASOLICITUD` datetime DEFAULT NULL,
`DESCRIPCION` text,
`ESTADO` varchar(13) DEFAULT NULL,
`TIPO` varchar(50) DEFAULT NULL,
PRIMARY KEY (`IDSOLICITUD`),
KEY `FK_REFERENCE_12` (`IDCIUDAD`),
KEY `FK_REFERENCE_19` (`CEDULAP`),
KEY `FK_REFERENCE_3` (`CEDULA`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=6 ;
INSERT INTO `solicitud` (`IDSOLICITUD`, `CEDULA`, `IDCIUDAD`, `CEDULAP`, `FECHASOLICITUD`, `DESCRIPCION`,
`ESTADO`, `TIPO`) VALUES
CREATE TABLE IF NOT EXISTS `soporte` (
`IDSOPORTE` int(11) NOT NULL AUTO_INCREMENT,
`IDSOLICITUD` int(11) NOT NULL,
`CEDULAP` varchar(13) DEFAULT NULL,
`FECHASOPROTE` datetime DEFAULT NULL,
`ESTADOSOPORTE` varchar(10) DEFAULT NULL,
`ESTADO` varchar(10) DEFAULT NULL,
PRIMARY KEY (`IDSOPORTE`,`IDSOLICITUD`),
KEY `FK_REFERENCE_18` (`CEDULAP`),
KEY `FK_REFERENCE_7` (`IDSOLICITUD`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=4 ;
INSERT INTO `soporte` (`IDSOPORTE`, `IDSOLICITUD`, `CEDULAP`, `FECHASOPROTE`, `ESTADOSOPORTE`, `ESTADO`)
VALUES
ALTER TABLE `ciudad`
ADD CONSTRAINT `FK_REFERENCE_11` FOREIGN KEY (`IDPROVINCIA`) REFERENCES `provincia` (`IDPROVINCIA`);
ALTER TABLE `detallesalidaequipos`
ADD CONSTRAINT `FK_REFERENCE_15` FOREIGN KEY (`IDSALIDAEQUIPOS`) REFERENCES `salidaequipos`
(`IDSALIDAEQUIPOS`),
ADD CONSTRAINT `FK_REFERENCE_16` FOREIGN KEY (`IDEQUIPO`) REFERENCES `equipo` (`IDEQUIPO`);
ALTER TABLE `detallesolicitud`
ADD CONSTRAINT `FK_REFERENCE_20` FOREIGN KEY (`IDSOLICITUD`) REFERENCES `solicitud` (`IDSOLICITUD`);
ALTER TABLE `detallesoporte`
ADD CONSTRAINT `FK_REFERENCE_8` FOREIGN KEY (`IDSOPORTE`, `IDSOLICITUD`) REFERENCES `soporte`
(`IDSOPORTE`, `IDSOLICITUD`);
ALTER TABLE `equipo`
ADD CONSTRAINT `FK_REFERENCE_13` FOREIGN KEY (`IDCATEGORIA`) REFERENCES `categoria` (`IDCATEGORIA`);
ALTER TABLE `observacionessoporte`
ADD CONSTRAINT `FK_REFERENCE_17` FOREIGN KEY (`IDSOPORTE`, `IDSOLICITUD`) REFERENCES `soporte`
(`IDSOPORTE`, `IDSOLICITUD`);
ALTER TABLE `salidaequipos`
ADD CONSTRAINT `FK_REFERENCE_14` FOREIGN KEY (`IDSOPORTE`, `IDSOLICITUD`) REFERENCES `soporte`
(`IDSOPORTE`, `IDSOLICITUD`);
ALTER TABLE `solicitud`
ADD CONSTRAINT `FK_REFERENCE_12` FOREIGN KEY (`IDCIUDAD`) REFERENCES `ciudad` (`IDCIUDAD`),
ADD CONSTRAINT `FK_REFERENCE_19` FOREIGN KEY (`CEDULAP`) REFERENCES `personal` (`CEDULAP`),
ADD CONSTRAINT `FK_REFERENCE_3` FOREIGN KEY (`CEDULA`) REFERENCES `cliente` (`CEDULA`);
ALTER TABLE `soporte`
ADD CONSTRAINT `FK_REFERENCE_18` FOREIGN KEY (`CEDULAP`) REFERENCES `personal` (`CEDULAP`),
ADD CONSTRAINT `FK_REFERENCE_7` FOREIGN KEY (`IDSOLICITUD`) REFERENCES `solicitud` (`IDSOLICITUD`);
51
Diccionario de datos
Categoría
Campo Tipo Nulo Predeterminado Comentarios Mime
id_categoria int(11) No
categoría varchar(50) Sí NULL
descripción varchar(50) Sí NULL
estado varchar(10) Sí NULL
Cuadro N°1, Tabla Categoría - Fuente: Autor
Ciudad
Campo Tipo Nulo Predeter
minado
Enlaces a Comentarios Mime
Id ciudad int(11) No
Id provincia int(11) Sí NULL Provincia -> idprovincia
Ciudad varchar(50) Sí NULL
Estado varchar(10) Sí NULL
Cuadro N°2, Tabla Ciudad - Fuente: Autor
Cliente
Campo Tipo Nulo Predeterminado Comentarios Mime
Cedula varchar(13) No
Apellidos varchar(50) Sí NULL
Nombres varchar(50) Sí NULL
Edad varchar(20) Sí NULL
Dirección varchar(100) Sí NULL
Mail varchar(100) Sí NULL
Teléfono varchar(50) Sí NULL
Celular varchar(50) Sí NULL
52
Sexo varchar(10) Sí NULL
Referencia varchar(100) Sí NULL
Estado varchar(10) Sí NULL
Cuadro N°3, Tabla Cliente - Fuente: Autor
Detallesalidaequipos
Campo Tipo Nulo Predeter
minado
Enlaces a Comentarios Mime
Iddetallesaleq int(11) No
Idsalidaequipos int(11) Sí NULL Salidaequipos -> IDSALIDAEQUIPOS
Idequipo int(11) Sí NULL Equipo -> IDEQUIPO
Hora datetime Si NULL
Lugar text Si NULL
Cuadro N°4, Tabla Detallesalidaequipos - Fuente: Autor
Detallesolicitud
Campo Tipo Nulo Predeter
minado
Enlaces a Comentarios Mime
Iddetallesol int(11) No
Idsolicitud int(11) Sí NULL solicitud ->IDSOLICITUD
Descrpcion text Sí NULL
Estado varchar(10) Sí NULL
Cuadro N°5, Tabla Detallasolicitud - Fuente: Autor
Detallesoporte
Campo Tipo Nulo Predeter
minado
Enlaces a Comentarios Mime
Iddetallesoporte int(11) No
Idsoporte int(11) Sí NULL
Idsolicitud int(11) Sí NULL
fechadetallesoprt Datetime Si NULL
descripciondetsop text Si NULL
Cuadro N°6, Tabla Detallesoporte - Fuente: Autor
53
Equipo
Campo Tipo Nulo Predeterm
inado
Enlaces a Comentarios Mime
Idequipo int(11) No
Id categoría int(11) Sí NULL categoría->IDCATEGORIA
Código varchar(50) Sí NULL
Marca varchar(50) Sí NULL
Descripción varchar(50) Sí NULL
Cantidad Int (11) Si NULL
Estado varchar(50) Sí NULL
Cuadro N°7, Tabla Equipo - Fuente: Autor
Observacionessoporte
Campo Tipo Nulo Predeterminado Comentarios Mime
Id observaciones int(11) No
Idsoporte int(11) Sí NULL
Idsolicitud int(11) Sí NULL
fechaobservacion Datetime Si NULL
Descripcion text Si NULL
Cuadro N°8, Tabla Observaciones soporte - Fuente: Autor
Personal
Campo Tipo Nulo Predeterminado Comentarios Mime
Cedulap varchar(13) No
Apellidos varchar(100) Sí NULL
Nombres varchar(100) Sí NULL
Dirección varchar(100) Sí NULL
Edad varchar(10) Sí NULL
Teléfono varchar(50) Sí NULL
Celular varchar(50) Sí NULL
Sexo varchar(100) Sí NULL
Cargo varchar(100) Sí NULL
Mail varchar(50) Sí NULL
Estado varchar(10) Sí NULL
Cuadro N°9, Tabla Personal - Fuente: Autor
54
Provincia
Campo Tipo Nulo Predeterminado Comentarios Mime
Idprovincia int(11) No
Provincia varchar(50) Sí NULL
Estado varchar(10) Sí NULL
Cuadro N°10, Tabla Provincia - Fuente: Autor
Salidaequipos
Campo Tipo Nulo Predeterminado Comentarios Mime
Idsalidaequipos int(11) No
Idsoporte int(11) Sí NULL
Idsolicitud int(11) Sí NULL
Cuadro N°11, Tabla Salidaequipos - Fuente: Autor
Solicitud
Campo Tipo Nulo Predeter
minado
Enlaces a Mime
Idsolicitud int(11) No
Cedula varchar(13) Sí NULL cliente -> CEDULA
Id ciudad int(11) Sí NULL ciudad -> IDCIUDAD
Cedulap varchar(13) Sí NULL personal -> CEDULAP
Fecha solicitud datetime Sí NULL
Descripción text Sí NULL
Estado varchar(13) Si NULL
Tipo varchar(50) Si NULL
Cuadro N°12, Tabla Solicitud - Fuente: Autor
Soporte
Campo Tipo Nulo Predeter
minado
Enlaces a Mime
Idsoporte int(11) No
Idsolicitud int(11) No solicitud IDSOLICITUD
Cedulap varchar(13) Sí NULL personal -> CEDULAP
Fechasoprote datetime Sí NULL
55
Estado soporte varchar(10) Sí NULL
Estado varchar(10) Sí NULL
Cuadro N°13, Tabla soporte - Fuente: Autor
Soporte tecnico_uggroups
Campo Tipo Nulo Predeterminado Comentarios MIME
GroupID int(11) No
Label varchar(300) Sí NULL
Cuadro N°14, Tabla Soportetecnico_uggroups - Fuente: Autor
Soporte tecnico_ugmembers
Campo Tipo Nulo Predeterminado Comentarios MIME
UserName varchar(300) No
GroupID int(11) No
Cuadro N°15, Tabla Soporte tecnico_ugmembers - Fuente: Autor
Soporte tecnico_ugrights
Campo Tipo Nulo Predeterminado Comentarios MIME
TableName varchar(300) No
GroupID int(11) No
AccessMask varchar(10) Sí NULL
Cuadro N°16, Tabla Soporte tecnico_ugrights - Fuente: Autor
Soporte tecnico_users
Campo Tipo Nulo Predeterminado Comentarios MIME
ID int(11) No
username varchar(300) Sí NULL
password varchar(300) Sí NULL
email varchar(300) Sí NULL
fullname varchar(300) Sí NULL
groupid varchar(300) Sí NULL
active int(11) Sí NULL
Cuadro N°17, Tabla Soporte tecnico_users - Fuente: Autor
56
3.3.4 Desarrollo
Conexión
PROTECTED FUNCTION _SETCONNECTIONSDATA()
{
$CONNECTIONSDATA = ARRAY();
$DATA = ARRAY();
$DATA["DBTYPE"] = 0;
$DATA["CONNID"] = "SERVICIOTECNICO2015_AT_LOCALHOST";
$DATA["CONNNAME"] = "SERVICIOTECNICO2015 AT LOCALHOST";
$DATA["CONNSTRINGTYPE"] = "MYSQL";
$DATA["CONNECTIONSTRING"] = "MYSQL;LOCALHOST;ROOT;;;SERVICIOTECNICO2015;;1"; //CURRENTLY UNUSED
$DATA["CONNINFO"] = ARRAY();
$DATA["CONNINFO"][0] = "LOCALHOST";
$DATA["CONNINFO"][1] = "ROOT";
$DATA["CONNINFO"][2] = "";
$DATA["CONNINFO"][3] = "";
$DATA["CONNINFO"][4] = "SERVICIOTECNICO2015";
$DATA["CONNINFO"][5] = ""; //CURRENTLY UNUSED
$DATA["CONNINFO"][6] = "1"; //CURRENTLY UNUSED
$DATA["ODBCSTRING"] = "DRIVER={MYSQL ODBC 3.51
DRIVER};SERVER=LOCALHOST;UID=ROOT;PWD=;DATABASE=SERVICIOTECNICO2015;OPTION=3";
$DATA["ODBCUID"] = "ROOT";
$DATA["ODBCPWD"] = "";
$DATA["LEFTWRAP"] = "`";
$DATA["RIGHTWRAP"] = "`";
$DATA["DBPATH"] = "DB"; //CURRENTLY UNUSED
$DATA["USESERVERMAPPATH"] = 1; //CURRENTLY UNUSED
$CONNECTIONSDATA["SERVICIOTECNICO2015_AT_LOCALHOST"] = $DATA;
$THIS->_CONNECTIONSDATA = $CONNECTIONSDATA;
}
PUBLIC FUNCTION CONNECT()
{
GLOBAL $CMYSQLNAMES;
IF( !$PORT )
$PORT = 3306;
$HOSTS = ARRAY();
//FIX IPV6 SLOW CONNECTION ISSUE
IF( $THIS->HOST == "LOCALHOST" )
{
IF( $_SESSION["MYQSLADDRESS"] )
$HOSTS[] = $_SESSION["MYQSLADDRESS"];
ELSE
$HOSTS[] = "127.0.0.1";
}
$HOSTS[] = $THIS->HOST;
57
FOREACH( $HOSTS AS $H )
{
$THIS->CONN = @MYSQL_CONNECT($H.":".$THIS->PORT, $THIS->USER, $THIS->PWD);
IF( $THIS->CONN )
{
$_SESSION["MYQSLADDRESS"] = $H;
BREAK;
}}
IF (!$THIS->CONN || !MYSQL_SELECT_DB($THIS->SYS_DBNAME, $THIS->CONN))
{
UNSET( $_SESSION["MYQSLADDRESS"] );
TRIGGER_ERROR( MYSQL_ERROR(), E_USER_ERROR );
}
IF( $CMYSQLNAMES != "" )
@MYSQL_QUERY("SET NAMES ".$CMYSQLNAMES);
$THIS->MYSQLVERSION = "4";
$RES = @MYSQL_QUERY("SHOW VARIABLES LIKE 'VERSION'", $THIS->CONN);
IF( $ROW = @MYSQL_FETCH_ARRAY($RES, MYSQL_ASSOC) )
$THIS->MYSQLVERSION = $ROW["VALUE"];
IF( SUBSTR($THIS->MYSQLVERSION, 0, 1) <= "4")
$THIS->SUBQUERIESSUPPORTED = FALSE;
RETURN $THIS->CONN;
}
Formulario principal
<! DOCTYPE HTML>
<HTML {$HTML_ATTRS}><HEAD>
<META HTTP-EQUIV="X-UA-COMPATIBLE" CONTENT="IE=EDGE"> <TITLE> {$PAGETITLE} </TITLE>
<META HTTP-EQUIV="CONTENT-TYPE" CONTENT="TEXT/HTML; CHARSET=UTF-8">
<LINK HREF="STYLES/DEFAULT.CSS" REL="STYLESHEET" TYPE="TEXT/CSS"> {BEGIN RTLCSS}<LINK
HREF="STYLES/DEFAULTRTL.CSS" REL="STYLESHEET" TYPE="TEXT/CSS">{END RTLCSS} {BEGIN
STYLECSSFILES}<LINK HREF="{$STYLEPATH}" REL="STYLESHEET" TYPE="TEXT/CSS">{END STYLECSSFILES}
{BEGIN PAGECSSFILES}<LINK HREF="{$PAGESTYLEPATH}" REL="STYLESHEET" TYPE="TEXT/CSS">{END
PAGECSSFILES}
<META NAME="GENERATOR" CONTENT="MSHTML 11.00.10240.16590"> </HEAD>
<BODY CLASS="{$STYLENAME} FUNCTION-LOGIN" {$BODYATTRS}> {BEGIN BODY}
{$HEADER}
<DIV CLASS="RNR-PAGE">
<DIV CLASS="RNR-TOP {$BLOCKCLASS_TOP}">
{BEGIN CONTAINER_LOGIN}
<DIV CLASS="RNR-C RNR-CV RNR-C-LOGIN">
{BEGIN LOGINHEADER}
<DIV CLASS ="RNR-BRICKCONTENTS STYLE2 RNR-B-LOGINHEADER {$BRICKCLASS_LOGINHEADER}"><SPAN><H1>
{$PAGETITLELABEL LOGIN} </H1>
</SPAN></DIV> {END LOGINHEADER}
{BEGIN MESSAGE_BLOCK}
<DIV CLASS="RNR-BRICKCONTENTS STYLE1 RNR-B-MESSAGE {$BRICKCLASS_MESSAGE}"><DIV CLASS="RNR-
MESSAGE"> {$MESSAGE} </DIV></DIV> {END MESSAGE_BLOCK}
<DIV CLASS="RNR-BRICKCONTENTS STYLE1 RNR-B-WRAPPER {$WRAPPERCLASS_FIELDS} RNR-WRAPPER RNR-
CBW-FIELDS">
{BEGIN CONTAINER_FIELDS}
<DIV CLASS="RNR-C RNR-CV RNR-C-FIELDS">
<DIV CLASS="RNR-BRICKCONTENTS STYLE1 RNR-B-LOGINFIELDS {$BRICKCLASS_LOGINFIELDS}"><TABLE
58
CLASS="FIELDGRID">
<TR>
<TD>
{BEGIN USERNAME_LABEL}NOMBRE DE USUARIO:{END USERNAME_LABEL}
</TD>
<TD CLASS="RNR-CONTROL">
<INPUT TYPE="TEXT" NAME="USERNAME" {$USERNAME_ATTRS}>
</TD>
</TR>
<TR>
<TD>
{BEGIN PASSWORD_LABEL}CONTRASEÑA :{ END PASSWORD_LABEL}
</TD>
<TD CLASS="RNR-CONTROL">
<INPUT TYPE="PASSWORD" NAME="PASSWORD" {$PASSWORD_ATTRS}>
</TD>
</TR>
<TR>
<TD>
{BEGIN REMEMBER_PASSWORD_LABEL}RECORDAR CONTRASEÑA :{ END REMEMBER_PASSWORD_LABEL}
</TD>
<TD>
<INPUT TYPE="CHECKBOX" {$REMEMBERBOX_ATTRS}>
</TD>
</TR>
</TABLE>
</DIV>
{BEGIN LOGINBUTTONS}
<DIV CLASS="RNR-BRICKCONTENTS STYLE2 RNR-B-LOGINBUTTONS {$BRICKCLASS_LOGINBUTTONS}"><A
HREF="#" CLASS="RNR-BUTTON MAIN" {$LOGINLINK_ATTRS}>PRESENTAR</A>
{BEGIN CONTINUE_BUTTON}
<A HREF="#" CLASS="RNR-BUTTON" {$CONTINUEBUTTON_ATTRS}>CONTINUAR</A>
{END CONTINUE_BUTTON}
</DIV> {END LOGINBUTTONS}
</DIV>
{END CONTAINER_FIELDS}
</DIV>
</DIV>
{END CONTAINER_LOGIN}
</DIV>
<DIV CLASS="RNR-MIDDLE">
<DIV CLASS="RNR-LEFT {$BLOCKCLASS_LEFT}"> </DIV>
<DIV CLASS="RNR-CENTER {$BLOCKCLASS_CENTER}"> </DIV>
<DIV CLASS="RNR-RIGHT {$BLOCKCLASS_RIGHT}"> </DIV></DIV>
<DIV CLASS="RNR-BOTTOM {$BLOCKCLASS_BOTTOM}"><!--%%BOTTOM %%--> </DIV></DIV>
{$FOOTER}
<P ALIGN="CENTER"><IMG SRC="IMAGES/LOGO_FINAL05.PNG" BORDER="0">
</P> {END BODY} </BODY></HTML>
3.3.5 Pruebas
Hoy en día las aplicaciones web han evolucionado a tal punto que son indispensables para
las grandes y medianas empresas ya que se encargan de controlar en todos los
departamentos y llevar el control de la economía.
Las pruebas del sistema tienen como objetivo verificar y analizar la funcionalidad del
sistema a través de sus interfaces externas, comprobando que dicha funcionalidad sea la
esperada en función de los requisitos del sistema y los requerimientos del usuario.
59
Sin embargo, muchas técnicas de prueba del sistema están descritas solo de manera
informal. Además, la fase de prueba del sistema suele realizarse al final del proceso de
desarrollo, por lo que estas pruebas suelen realizarse de manera superficial e incompleta.
Al utilizarse una forma informal para la realización de las pruebas, no se puede asegurar
que el software esté libre de errores. De hecho, uno de los problemas más difíciles con este
tipo de pruebas, es saber cuándo parar de probar.
Las pruebas
Son los procesos que permiten verificar y revelar la calidad de un producto como la
aplicación web y utilizada para identificar posibles fallos de implementación, calidad, o
usabilidad de un programa de ordenador, básicamente es una fase en el desarrollo de
software consistente en probar las aplicaciones construidas.
Objetivo de las pruebas
La prueba es unos procesos de ejecución de la aplicación web con la intención de descubrir
errores.
Un buen caso de prueba es aquel que tiene una falta de probabilidad de mostrar error
descubierto hasta entonces.
Utilidad de las pruebas
El proceso de prueba es clave a la hora de detectar errores o fallas. Conceptos como
estabilidad, escalabilidad, eficiencia y seguridad se relacionan a la calidad de un producto
bien desarrollado. Las aplicaciones de software han crecido en complejidad y tamaño, y
por consiguiente también en costos. Hoy en día es crucial verificar y evaluar la calidad de
lo construido de modo de minimizar el costo de su reparación. Mientras antes se detecte
una falla, más barata es su corrección.
El proceso de prueba es un proceso técnico especializado de investigación que requiere de
60
profesionales altamente capacitados en lenguajes de desarrollo, métodos y técnicas de
pruebas y herramientas especializadas. El conocimiento que debe manejar un ingeniero de
prueba es muchas veces superior al del desarrollador de software.
Las pruebas de software se integran dentro de las diferentes fases del ciclo del software
dentro de la Ingeniería de software. Así se ejecuta un programa y mediante técnicas
experimentales se trata de descubrir que errores tiene la aplicación web.
En la aplicación web de gestión de soporte técnico, se desarrolló la respectiva prueba con
el objetivo de corregir errores y modificarlo la cual se tomó en cuanta los siguientes puntos
de suma importancia de la aplicación web.
Importancia de las pruebas
El desarrollo de sistemas de la aplicación web implica una serie de actividades de
producción en las que las posibilidades de que aparezca el fallo humano son enormes. Los
errores pueden empezar a darse desde el primer momento del proceso, en el que los
objetivos pueden estar especificados de forma errónea o imperfecta, así como en
posteriores pasos de diseño y desarrollo. Debido a la imposibilidad humana de trabajar y
comunicarse de forma perfecta, el desarrollo de software ha de ir acompañado de una
actividad que garantice la calidad.
Las pruebas del software son un elemento crítico para la garantía de calidad de la
aplicación web y representa una revisión final de las especificaciones, del diseño y de la
codificación. La creciente percepción de la aplicación web como un elemento del sistema y
la importancia de los costes asociados a un fallo del propio sistema, están motivando la
creación de pruebas minuciosas y bien planificadas.
La prueba es un elemento crítico para la calidad del software. La importancia de los costes
asociados a los errores, promueve la definición y aplicación de un proceso de pruebas
minuciosas y bien planificadas. Las pruebas permiten validar y verificar el software,
entendiendo como validación del software el proceso que determina si el software satisface
los requisitos, y verificación como el proceso que determina si los productos de una fase
satisfacen las condiciones de dicha fase.
Las estrategias de pruebas permiten enfocar el plan de pruebas; Este comprende la visión
del proceso de pruebas, definición de actividades y roles involucrado en cada una de ellas.
61
3.3.5.1 Pruebas de la aplicación web basado en modelos
Pruebas del Sistema
Verifica que cada elemento encaja de forma adecuada y que se alcanza la funcionalidad y
el rendimiento del sistema total. La prueba del sistema está constituida por una serie de
pruebas diferentes cuyo propósito primordial es ejercitar profundamente el sistema de la
aplicación web y los módulos que contiene dicha aplicación para la ejecución de la gestión
de Soporte Técnico.
Pruebas de Seguridad
La prueba de seguridad intenta verificar que los mecanismos de protección incorporados en
el sistema lo protegerán, de hecho, de accesos impropios. Por supuesto, la seguridad del
sistema debe ser probada en su invulnerabilidad frente a un ataque frontal, pero también
debe probarse en su invulnerabilidad a ataques por los flancos o por la retaguardia.
Durante la prueba de seguridad, el responsable de la prueba desempeña el papel de un
individuo que desea entrar en el sistema. ¡Todo vale! Debe intentar conseguir las claves de
acceso por cualquier medio, puede atacar al sistema con software a medida, diseñado para
romper cualquier defensa que se haya construido, debe bloquear el sistema, negando así el
servicio a otras personas, debe producir a propósito errores del sistema, intentando acceder
durante la recuperación o debe curiosear en los datos sin protección, intentando encontrar
la clave de acceso al sistema, etc.
Con tiempo y recursos suficientes, una buena prueba de seguridad terminaría por acceder
al sistema. El papel del diseñador del sistema es hacer que el coste de la entrada ilegal sea
mayor que el valor de la información obtenida.
Planificación de las Pruebas
La fase de pruebas necesita una organización seria y fiable. Las pruebas funcionan cuando
encuentran errores. Debe de realizarse una planificación exhaustiva.
62
Terminación de las Pruebas
El objetivo de las pruebas consiste en encontrar errores, pero si ya no se encuentran errores
(no quiere esto decir que no los haya) debe seguirse un criterio de terminación de las
pruebas; el criterio puede ser:
Cuando el tiempo de la prueba ha expirado.
Cuando todos los casos de prueba se ejecutan sin error.
3.3.5.2 Técnicas de pruebas
Pruebas de regresión
Tiene como finalidad verificar el sistema de la aplicación web luego, de haber realizado
cambios o después de corregir fallas de la aplicación web de manera que mantenga una
correcta funcionalidad especifica.
Pruebas de operación
Su objetivo es verificar el sistema de la aplicación Web en operación por un largo periodo
bajo condiciones normales de uso para detectar errores y defectos en la aplicación web.
Pruebas a escala completa
Se trata de verificar el sistema en su carga máxima mediante los parámetros a su valor
límite o establecidos para una dicha calificación de la aplicación web y la interconexión del
sistema de la aplicación web con un número máximo de equipos y el uso de los usuarios
simultáneos.
Pruebas de rendimiento
Tiene como finalidad medir la capacidad de la aplicación web con los procesos del
sistema bajo diferentes cargas, incluyendo espacios de almacenamiento y la utilización de
la unidad de procesamiento del sistema de la aplicación web.
63
Pruebas de sobrecarga
Pretende observar cómo se comporta el sistema de la aplicación web cuando se le implica
una sobrecarga de datos, más allá de las pruebas de escala completa y el rendimiento.
Pruebas negativa
Tiene como propósito medir el estrés de la aplicación web en la situación inesperada, como
casos de uso que normalmente no serían utilizados de manera simultánea.
3.3.5.3 Pruebas unitarias
La prueba requerida se efectúo con cada una de las tablas de la base de datos
“serviciotecnico2015”, abriendo nuevos registros, modificando y eliminándolos.
Descripción
Este proceso cubre el conjunto de pruebas unitarias realizadas sobre la Base de Datos
(todas las tablas). Las pruebas que se realizaron a cada una de estas tablas a través de los
formularios fueron:
a) Ingreso de datos: validación de registro en blanco, validación de datos erróneos,
validación de tipos de datos, validación de longitud de los registros, validación con
datos nulos, validación de duplicidad de claves primarias.
b) Modificación de datos: validar la existencia del registro solicitado, validar la no
modificación de la clave primaria, validar tipo de dato, etc.
c) Validación de Cálculos: Validar tipos de datos, validar existencia de productos en
stock, validar la cantidad a reservar, validar la aproximación de decimales.
d) Acceso al sistema: validar la existencia del usuario y la contraseña en la base de datos
MySql, validar la conexión a la base de datos.
e) Consultas-Reportes: validad los resultados de los reportes, validar parámetros de
entrada y resultados esperados.
El entorno del cual partiremos para realizar la prueba será el formulario de entrada de la
aplicación.
64
Comprobar que la consulta funciona correctamente
Nos introducimos en el sistema como usuarios registrado en la base de datos MySql y con
los permisos correspondientes, accediendo a su funcionalidad y solicitamos consultar
realizar una determinada acción, el sistema nos mostrara información, mensaje y lista con
los resultados que se hayan almacenado en la base de datos del sistema.
Condiciones de ejecución
Las condiciones de ejecución del caso de prueba son que el usuario debe ingresar
correctamente los datos solicitados por el Sistema-Aplicación Web. Consultar la Base de
Datos ‘MySql’ (tabla: user)’ para ver toda la especificación completa de los datos.
Entrada
Se Introdujo ‘datos correctos’ en el campo requerido del formulario (específico para
cada una de las tablas de la base de datos).
Pulsar entrar o el botón “(según el formulario y la acción ’Ingresar’, ‘Modificar,
‘Eliminar’, ‘Buscar, etc.’)” de la aplicación y formularios.
Nos aparece la interfaz propia para cada tabla de la base de datos.
Digitamos los datos respectivos correctamente.
Pulsamos los botones correspondientes, Ejemplo “Buscar” y el Sistema muestra la
Información al instante de lo solicitado.
Resultado esperado
La Aplicación Web nos muestra una interfaz sencilla y fácil de manipularla, que muestra
información según sea la solicitada.
Evaluación de la Prueba
Para la siguiente evaluación de la aplicación web se tomara como más importante los
resultados cuantitativos por lo que se ha tomado la forma de la calificación y la evaluación
65
de la siguiente manera.
Calificación alta comprende el 100 %
Calificación alta media comprende el 75%
Calificación media comprende el 50%
Calificación media baja comprende el 25%
Calificación baja comprende el 10%
3.3.5.4 Análisis de las pruebas y el rendimiento
Prueba Descripción Rendim
iento
Hardware eficiente Una máquina Pentium IV, con disco de 80GB,
memoria de 512MB y un procesador de 2.6.Ghz,
son necesarias para la ejecución de la aplicación.
95%
Dispositivos adicionales Una impresora Canon S200X para imprimir los
reportes generados en la Aplicación Web.
80%
Cargas de Datos En cada una de las tablas se ingresaron unos 1000
datos para las pruebas de manipulación de datos
(eliminación, modificación, consultas, reportes y
almacenamiento).
89%
Usuarios del Sistema Se crearon 3 usuarios con privilegios de
administradores para el acceso a la Aplicación
Web, además otros usuarios que están restringidos
a ciertos procesos.
87%
Instalación de
Componentes
Adicionales
La instalación de Xampp y la base de datos
MySql, incluida en el Sistema Operativo Windows
para el desarrollo de la Aplicación Web antes de la
Implementación.
100%
Seguridad de la Base de
Datos.
MySql está limitado en cuanto a seguridades,
manipulación de la información y en súper
usuarios.
70%
Cuadro N° 18, Cuadro de resumen de las pruebas y rendimientos - Fuente: Autor.
66
3.3.5.5 Pruebas generales de hardware
PRUEBA DETALLE
Conexión de piezas (teclado, mouse,
pantalla, reguladores, UPS)
Se verifico que la instalación de los
componentes de entrada y salida de datos
este correctamente conectado
Encendido Se verifico que el computador encienda de
manera correcta, los dispositivos
funcionaron correctamente y el arranque del
sistema operativo donde se va a ejecutar la
aplicación fue correspondiente a usar
Corte de Energía Eléctrica Se Utilizó el UPS para evitar perdida de
información por algún corte de energía.
Cuadro N° 19 – Cuadro de Prueba de Hardware -Fuente: Autor.
PRUEBA DETALLE
Instalación de Windows Se Verifico que la instalación de Windows,
esté en buenas condiciones, sin fallas
internas y que arranque al momento de
encender el computador.
Instalar paquetes Framework de Microsoft Fueron Comprobados e instalados los
paquetes Framework de Microsoft para que
los paquetes a utilizar funcionen
correctamente
Instalación de herramientas de Desarrollo
(MYSQL, PHPRUNNER, Servidor web
Apache, )
Se instaló correctamente los programas de
desarrollo de la aplicación Web,
verificando compatibilidad de los sistemas
operativos y ejecutando varios ejemplos
para verificar la funcionalidad de los
programas.
Instalación de Xampp El lenguaje PHP que es la base para el
desarrollo de la aplicación web necesita de
67
un programa instalado como es el Xampp,
el cual es un paquete que viene incorporado
el servidor de base de datos MYSQL, PHP
y el Servidor Web Apache, para que
mediante la configuración en el servidor
Apache, desde el browser digitando
localhost, se ejecute la aplicación web
localmente
Cuadro N° 20, Cuadro de la Prueba de Software - Fuente: Autor.
Aplicación web
PRUEBA DETALLE
Código Fuente Se Verifico que la sintaxis usada este
correctamente al momento de realizar
compilaciones
Hipervinculos Al trabajar con formularios y el paso de
información de un formulario a otro se
verifico que los vínculos o enlaces se hagan
de manera relacionada.
Conexión a la base de Datos Al momento de compilar se verifico los
errores de conexión a la base de datos
posteriormente dando la solución
respectiva, ya sea verificando el nombre de
usuario y contraseña o también la sintaxis
de la cadena de conexión
Alineación y Justificación de Texto Se realizó una presentación agradable a la
vista de la información a mostrar, con los
espacios correspondientes entre los
márgenes y alineaciones.
Diseño, Estilos CSS y Colores Se optimizo el espacio a utilizar y realizar
combinaciones de colores agradables al ojo
68
humano utilizando los colores propios de la
institución
Consultas SQL (Insert, Update, Delete) Una vez comprobada la conexión con la
base de datos, se verifico que las consultas
SQL lleguen a la base de datos, mediante
try y catch para informar del error
ocasionado, evitando que la aplicación se
detenga.
Validación de cajas de texto Se Comprobó que las validaciones en PHP
o java script, realicen la función deseada,
compilando la aplicación y verificando que
en cada caja de texto permita el ingreso de
solo letras o números según lo necesario.
Creación de Roles de Usuario en la Base
de Datos
A momento de crear los usuarios, se
verifico que dicho usuario conste en la base
de datos con los permisos necesarios
otorgados.
Sesiones Se Programó condiciones para que no
puedan ingresar al sistema evadiendo el
login principal, usando variables de sesión
Respaldos de la Base de Datos y Backup Se Comprobó que el backup funcione al
momento de importar esos datos en la Base
de Datos, para evitar problemas de pérdida
de la información
Cuadro N° 21, Cuadro de la Prueba de la Aplicación Web - Fuente: Autor.
3.3.6 Implementación
La aplicación web funciona bajo el subdominio http://www.redestel.ec/, para ello se ha
conseguido un Hosting con tecnología Linux, el mismo que soporta las herramientas con
las que se desarrolló el software. Las cuales son PHP, Apache, MySql, Ajax y Javascript.
Para la subida de los archivos se utiliza una conexión FTP provista por el administrador del
Hosting. En cuanto a los requerimientos de hardware para navegar tenemos: computadores
69
con microprocesador P4 de 3.0 Mhz o superior, Teclado estándar, Mouse estándar,
Monitor, Disco Duro (espacio de 500 GB), Memoria RAM 4GB
3.3.7 Validación de la propuesta
Luego de la revisión de la aplicación web presentada por el estudiante Ortega Caipe
Alcides Hernando de la “UNIVERSIDAD REGIONAL AUTÓNOMA DE LOS ANDES
UNIANDES SEDE IBARRA”, a la empresa Nextel Cía. Ltda. Cuyo tema es
“APLICACIÓN WEB PARA LA GESTIÓN DE SOPORTE TÉCNICO DE LA
EMPRESA DE TELECOMUNICACIONES NEXTEL CIA. LTDA. DE LA CIUDAD DE
ATUNTAQUI” en modo prototipo, se entrega por parte del Ing. Marcelo Daniel Calderón,
Gerente y Propietario, un certificado de que la aplicación es viable para la empresa.
70
CONCLUSIONES
Las empresas de telecomunicaciones al utilizar estas tecnologías de comunicación para
la asignación de actividades laborales contribuyen al medio ambiente al ahorrar el uso
de recursos como el papel, tinta de impresoras, entre otros.
Una aplicación Web que permita administrar cada uno de los datos almacenados de
manera correcta, donde nos brindó la información requerida, solicitada para el
desarrollo de dicha aplicación.
La Empresa para la cual se ha propuesto la construcción de la aplicación, ha concedido
de manera muy gentil la apertura de la información en cuanto a cada uno de los
procesos que ha ido realizando en la gestión de soporte técnico, información acerca de
la empresa para el diseño de la página informativa, entre otras, aspectos que se ha
considerado de gran ayuda para el buen desarrollo de la aplicación web.
La Empresa ha concedido que se realice las pruebas necesarias para verificar el buen
funcionamiento de la aplicación y la solución a posibles errores encontrados durante el
proceso del mismo.
Se requirió varias herramientas tecnológicas las cuales se han estudiado y puesto en
práctica para el diseño, análisis y desarrollo de la aplicación web como el lenguaje
PHP, y el Framework PHP Runner, la versión de hojas de estilo en cascada CSS3, Se
utilizó la base de datos MySql por sus ventajas y compatibilidad con las otras
herramientas de desarrollo, la cual permitirá almacenar los datos y las actividades
diarias que se realizan en la Empresa.
Se concluye que la utilización del Framework PHP Runner el cual genera
automáticamente todo un repertorio de páginas web para insertar información en los
campos de la base de datos, nos ha permitido optimizar tiempo y recursos en el
transcurso del tiempo de construcción de la Aplicación web
71
la aplicación web permitirá agilizar los procesos que establecen día a día en la
Empresa con mayor rapidez y en la ejecución de todos sus procesos, así brindando un
servicio de calidad para el cliente, y la comodidad para el personal de las diferentes
áreas y administrativos.
Es importante hoy en día incluir la tecnología y el uso de las aplicaciones web en
diferentes empresas e instituciones financieras, comerciales y educativas ha dado lugar
a un óptimo y ágil desempeño en el avance y crecimiento a nivel empresarial
72
RECOMENDACIONES
Se recomienda a las empresas de telecomunicaciones ya sean grandes o pequeñas
adoptar este tipo de soluciones tecnológicas que les permitirá cumplir en forma
correcta con los servicios de soluciones informáticas y telecomunicaciones.
Realizar periódicamente un backup temporal para el mejor respaldo de la información
de la Empresa debido al riesgo de pérdida de información que se suele presentar, así
como también realizar las respectivas actualizaciones en la base de datos.
Se recomienda mantener la aplicación web en sistemas operativos con licencias por
seguridad, cuidar y proteger de los virus informáticos con software de buena calidad
en caso de ser en Windows
Alojar la aplicación en un equipo que se encuentre en una buena y acorde ubicación,
además se recomienda que el sistema eléctrico este en buenas condiciones y cumpla
con los parámetros requeridos para prevenir ciertos riesgos de destrucción.
Para el caso de actualizaciones y mantenimiento se recomienda permitir el acceso al
sistema como súper usuario solo a las personas que conozcan el perfecto manejo de la
aplicación web y la base de datos.
Se recomienda difundir la importancia del uso de los medios de comunicación por
internet y el uso de las herramientas tecnológicas, y de esa manera ir reduciendo el uso
de papel el cual contribuye con la protección del medio ambiente.
BIBLIOGRAFÍA
Álvarez, M. A. (09 de 05 de 2001). Desarrollo web. Recuperad el 30 de 05
de 2014, de Desarrollador Web :
http://www.desarrolloweb.com/articulos/392.php
Angulo, L. (2010). Diseños de Páginas Web. Lima-Perú: Macpro, primera
edición.
Alegsa, L. (10 de Agosto de 2010). Desarrollador Web. Recuperado el 5
de Diciembre de 2014, de Definición de Aplicación
Web:
http://www.alegsa.com.ar/Dic/aplicacion%20web.php#sthash.tioUcnqd.dpuf
Arias, M. (2015). Aprende Programación Web con PHP y MySQL. United
States: Createspace.
Benavidez, J., & eat. (2009). Introducción al Sql para usuarios y
programadores. Madrid-España: Editorial Paraninfo, Segunda Edición.
Caivano, R. M. (2009). Web 2.0. Villa María: Damián Truccone.
Cardador, A. L. (2014). Implantación de Aplicaciones Web en entornos
Internet, Intranet y Extranet. ANTEQUERA, Malaga: IC Editorial, Primera
Edición.
Cobo, Á., Gómez, P., Pérez, D., & Rocha, R. (2005). PHP y MySQL
Tecnologías para el desarrollo de aplicaciones Web. España: Díaz de Santos
Editorial.
Cuello, J., & Vittone, J. (2013). Diseñando apps para móviles. Las
Aplicaciones. Barcelona- España.
De La Cruz, J. E. (27 Agosto 2015). Definición Evolución Aplicaciones Web:
https://es.scribd.com/doc/276444908/Definicion-Evolucion-Aplicaciones-Web
Eric, C. (2010). PHP Profesional. Lima-Perú: Macpro,Primera Edición.
Firtman, M. (2010). Ajax web 2.0 con Query para profesionales. Buenos
Aires- Argentina: Alfaomega, segunda edición.
Froufe, A. (2008). Java 2 manual de usuario y tutorial. MéxicoDF-
México:Alfaomega Rama, segunda edición.
Gauchat, J. D. (2012). El gran libro de HTML5, CSS3 y Javascript. España:
Marcombo, S.A. Primera edición, España.
Addison, W. (2009). La Biblia MySql. España: Anaya Multimedia.
Gonzaléz, M., & Cordero, M. (2007). Diseño de Páginas web. España:
MC Graw Gill, primera edición.
González, J. (2015). Utilización de las bases de datos relacionales en el
sistema de gestión y almacenamiento de datos. España: Paraninfo, S.A.
Gauchat, J. D. (2012). El gran libro de HTML5, CSS3 y Javascript. Barcelona
- España: MARCOMBO, S.A. 1ª Edición.
Jacovo, P. (2009) Creacción de un portal con Php y MySql. Mexico:
Alfaomega Ra-ma, tercera edición.
Kendall, K., & Kendall, J. (2011). Análisis y Diseño de Sistemas. México:
Pearson, octava edición, México.
Mehdi, A. (Diciembre de 2009). Desarrollador Web. Recuperado el 5 de
Diciembre de 2014, de Que es Php? :
http://php.net/manual/es/intro-whatis.php
Ramos, A. & Ramos, J. (2011). Aplicaciones Web (Novedad 2011).Madrid,
España: Paraninfo. 1ª Edición.
Véronneau, M. (s.f.). Nmédia Solutions Inc. Recuperado el 13 de Agosto de
2015, de Historia del desarrollo de aplicaciones Web:
http://www.nmediasolutions.com/publications/conseils/histoire-
developpement-applications-web
Silberschatz, A., Korth., & Sudarshan. (2007). Fundamentos de diseño de
Bases de datos. España: Mcgraw-Hill. 5ª Edición.
Springer, A. (2012). El Gran Libro de Diseño Web. La guía definitiva para
crear páginas web increíbles. España: Axel Springer España, S.A.
Xlinesoft. (2015). PHPRunner 8.1 Manual. [S.N]. recuperado de
http://xlinesoft.com/phprunner/docs/phprunner.pdf
ANEXOS
ANEXO 1
Manual de Usuario
A continuación se presenta el manual de usuario el mismo que será una guía para el cliente
final el cual facilitara en el manejo de la aplicación web.
PAGINA PRINCIPAL DE LA APLICACIÓN WEB
Figura N°1, Captura Página Principal - Fuente: Autor.
FORMULARIO PARA EL INGRESO DE ADMINISTRACIÓN
Figura N°2, Ingreso al sistema para la administración - Fuente: Autor.
Por medio del presente formulario se podrá verificar el acceso de los usuarios al sistema
con respectivos menús y opciones para que desempeñen su función.
MENÚ DEL SISTEMA
Figura N°3, Captura menú del sistema- Fuente: Autor.
El presente menú es presentado por el sistema como primera presentación unas ves que el
usuario ingrese al sistema según sea su rol, en el caso del súper usuario se presentaran
todas las opciones que tiene disponible el sistema.
PANEL DE EMPLEADOS REGISTRADOS
Figura N°4, Panel de empleados- Fuente: Autor.
En este panel se presentan todos los empleados que han sido registrados en el sistema, el
mismo donde se puede añadir nuevos y con el botón
seleccionado en la casilla es posible realizar las operaciones básicas como
borrar, editar, ver, exportar e imprimir.
FORMULARIO DE REGISTRO DE EMPLEADOS
Figura N°5, Formulario de registro de empleados- Fuente: Autor.
Por medio de este formulario podemos registrar a los empleados de la empresa, llenando
cada uno de los campos requeridos.
PANEL DE PROVINCIAS Y CIUDADES REGISTRADAS
Figura N°6, Panel de provincias y ciudades registradas - Fuente: Autor.
En este panel se presenta todas las ciudades y provincias registradas según la provincia se
guardan las ciudades haciendo click en el botón añadir nuevo.
Con el botón seleccionando en cada ítem, tiene la opción de
editar, borrar, exportar, imprimir y con el botón “guardar todo” se actualizan todos los
campos afectados.
FORMULARIO DE INGRESO DE PROVINCIAS Y CIUDADES
Figura N°7, Formulario de ingreso de provincias y ciudades- Fuente: Autor.
Por medio de este formulario podemos ingresar la provincia y la ciudad de los lugares
donde tiene cobertura la empresa.
PANEL DE USUARIOS REGISTRADOS
Figura N°8, Panel de usuarios registrados- Fuente: Autor.
Por medio de este panel con el botón “añadir nuevo “el administrador podrá agregar
nuevos usuarios de la lista de empleados asignándoles el usuario y contraseña el cual
deberán utilizar como usuario el número de la cedula y la clave asignada por el
administrador.
PANEL DE ROL DE USUARIOS
Figura N°9, Panel de rol de usuarios- Fuente: Autor.
Por medio de este panel, el súper administrador puede asignar a los empleados el rol de
usuarios con sus respectivos privilegios.
En la parte derecha del panel el súper administrador deberá marcar la casilla del usuario
según le corresponda.
PANEL DE BODEGA
Figura N°10, Panel de bodega - Fuente: Autor.
En este panel se puede visualizar las categorías y equipos ingresados en el inventario de la
empresa.
Por medio de este panel se puede añadir nuevas categorías y nuevos equipos los mismos
que pueden ser modificados y actualizados por parte del administrador.
FORMULARIO DE RIGISTRO DE CATEGORÍAS DE EQUIPOS
Figura N°11, Formulario de registro de categorías de equipos - Fuente: Autor.
En el presente formulario se registran las categorías de los diferentes equipos y materiales
que adquiere la empresa, así como también cada uno de los equipos con su respectiva
descripción.
FORMULARIO DE REGISTRO DE EQUIPOS
Figura N°12, Formulario de registro de equipos - Fuente: Autor.
Por medio de este formulario podemos registrar los equipos adquiridos por la empresa,
llenando cada uno de los campos requeridos.
FORMULARIO DE REGISTRO DE SALIDA DE EQUIPOS
Figura N°13, Formulario de registro de salida de equipos - Fuente: Autor.
En el presente formulario el encargado de bodega es quien registra los equipos y materiales
que solicita el técnico, registrando los detalles de cada equipo y el lugar donde se va a
utilizar, si desea asignar más equipos hacemos clic en
FORMULARIO DE REGISTRO DE DETALLES DE SALIDA DE EQUIPOS
Figura N°14, Formulario de registro de detalles de salida de equipos - Fuente: Autor.
Por medio de este formulario podemos registrar la salida de un equipo de bodega,
registrando el lugar donde se lo va a utilizar y la descripción del equipo o material
PANEL DE CLIENTES REGISTRADOS
Figura N°15, Panel de bodega - Fuente: Autor.
En este panel se puede visualizar todos los clientes que han sido registrados el cual
también por el mismo se puede abrir el formulario de ingreso de nuevos clientes haciendo
click en el botón de la misma manera haciendo click en la pestaña
se podrá ingresar la solicitud de soporte.
FORMULARIO DE REGISTRO DE CLIENTE
Figura N°16, Formulario de registro de cliente - Fuente: Autor.
Por medio de este formulario podemos registrar la información necesaria del cliente,
llenando cada uno de los campos requeridos.
PANEL SOPORTES E INSTALACIONES ASIGNADAS
Figura N°17, Panel de bodega - Fuente: Autor.
En el presente panel se encuentran registrados los soportes e instalaciones asignadas a los
técnicos en el cual también se puede visualizar el detalle soporte, observaciones del soporte
y la salida de equipos el cual ha sido asignado al técnico responsable de cada soporte o
instalación hacia el cliente.
FORMULARIO DE REGISTRO DE SOLICITUD DE SERVICIOS
Figura N°18, Formulario de registro de solicitud de servicios - Fuente: Autor.
En el presente formulario se registra la solicitud de servicio que solicita el cliente,
registrando la descripción de la solicitud, si desea asignar más solicitudes de servicios
hacemos clic en .
PANEL DE DETALLES DE SOPORTES
Figura N°19, Panel de bodega - Fuente: Autor.
En este panel se muestra los detalles de cada soporte realizado por parte del técnico en el
cual el administrador puede dar de baja el soporte en cuanto se haya culminado con éxito
dicho soporte.
En el cuadro son los datos del enlace del el soporte o instalación
realizado por parte del técnico en la red de la empresa.
De la misma manera como en los paneles anteriores, con los botones “añadir nuevo” se
podrá ingresar un nuevo detalle y con el botón se podrá realizar
las operaciones básicas como borrar, editar, exportar o imprimir.
FORMULARIO DE REGISTRO DE DETALLE DE SOLICITUD
Figura N°20, Formulario de registro de detalle de solicitud de servicios - Fuente: Autor.
En el presente formulario se registra el detalle de solicitud de servicio que pide el cliente,
registrando la descripción de la solicitud.
FORMULARIO DE ASIGNACIÓN DE SOPORTE
Figura N°21, Formulario de asignación de soporte - Fuente: Autor.
En el presente formulario se asigna el soporte a los técnicos, en el cual se describe el
nombre del cliente, la fecha, la situación y estado del soporte.
PANEL DETALLES SOPORTE
Figura N°22, Panel detalle de soporte - Fuente: Autor.
En este panel se muestra los detalles de cada soporte realizado por parte del técnico en el
cual el administrador puede dar de baja el soporte en cuanto se haya culminado con éxito
dicho soporte.
En el cuadro son los datos del enlace del el soporte o instalación realizado por parte del
técnico en la red de la empresa.
De la misma manera como en los paneles anteriores, con los botones “añadir nuevo” se
podrá ingresar un nuevo detalle y con el botón se podrá realizar
las operaciones básicas como borrar, editar, exportar o imprimir.
PANEL DE OBSERBACIONES DE SOPORTES O INSTALACIONES
Figura N°23, Panel de bodega - Fuente: Autor.
En este panel se muestra las observaciones realizado por parte del jefe técnico, en el cual el
técnico puede visualizar dichas observaciones.
FORMULARIO DE REGISTRO DE OBSERVACIÓNES DE SOPORTE
Figura N°24, Formulario de registro de observaciones de soporte - Fuente: Autor.
En el presente formulario se registran las observaciones de soporte de los técnicos, en el
cual se describe el idsoporte, idsolicitud, la fecha, y descripción de observación del
soporte.
ANEXO 2
CARTA DE ACEPTACIÓN DE LA PROPUESTA
ANEXO 3
CERTIFICADO DE IMPLANTACIÓN
