DISEÑO DE LA ARQUITECTURA DEL SOFTWARE (DAS) filediagramas facilita la compresión de problemas...
Transcript of DISEÑO DE LA ARQUITECTURA DEL SOFTWARE (DAS) filediagramas facilita la compresión de problemas...
REPÚBLICA BOLIVARIANA DE VENEZUELA
MINISTERIO DEL PODER POPULAR PARA LA EDUCACIÓN
COLEGIO UNIVERSITARIO DE CARACAS
PROYECTO SOCIO TECNOLÓGICO
TRAYECTO 3 TRIMESTRE II
DISEÑO DE LA ARQUITECTURA DEL SOFTWARE (DAS)
Cedula Apellidos y Nombres Correo Electrónico
V-17207074 Silva R. Ángel A. [email protected]
V-16591329 González Edgar [email protected]
V-20303540 Jansasoy Yaribeth [email protected]
V-18009481 Prada R. Alejandro J. [email protected]
Profesor(es)
Marcos Gómez
Proyecto Socio Tecnológico - Trayecto 3 - Trimestre II
Sección: 1430232
Índice de contenidoINTRODUCCIÓN..................................................................................................................5
Propósito del Documento....................................................................................................6
Definiciones Siglas y Abreviaturas.....................................................................................7
I.DIAGRAMAS DE ESTRUCTURA.....................................................................................9
1.Diagrama de Clases..........................................................................................................9
1.2. Descripción de Diagrama de Clases ..........................................................................10
.........................................................................................................................................10
2.Diagrama de Objetos......................................................................................................11
2.1.Descripción de Diagrama de Objetos .........................................................................11
3.Diagrama de Paquetes....................................................................................................12
3.1.Descripción de Diagrama de Objetos .........................................................................12
4.Diagrama de Componentes............................................................................................13
4.1. Descripción del Diagramas de Componentes.............................................................14
5.Diagrama de Despliegue................................................................................................16
5.1.Descripción del Diagrama de Despliegues..................................................................17
I.DIAGRAMAS DE COMPORTAMIENTO.......................................................................18
1.Diagrama de Estado.......................................................................................................18
I.Descripción del Diagramas Estado.................................................................................18
II.DIAGRAMAS DE INTERACCIÓN................................................................................19
1.Diagrama de Secuencia..................................................................................................19
1.1.Descripción del Diagrama de Secuencia.....................................................................20
1- TDR y ERS Página 2
Proyecto Socio Tecnológico - Trayecto 3 - Trimestre II
III.MODELO VISTA CONTROLADOR.............................................................................21
1.Diagrama de MVC.........................................................................................................21
1.1.Descripción Modelo Vista Controlador......................................................................21
IV.INTERFAZ USUARIO...................................................................................................24
V.REPORTES.......................................................................................................................25
PDF de Generación de Tarjeta QR.........................................................................25
1- TDR y ERS Página 3
Proyecto Socio Tecnológico - Trayecto 3 - Trimestre II
INTRODUCCIÓN
El presente trabajo está diseñado de forma práctica y sencilla para comenzar a
conocer un poco más del diseño de arquitectura del sistema a implementar para la
comunidad del Colegio Universitario de Caracas (CUC), a través de una serie de diagramas
y su respectiva descripción representaremos la secuencia de las operaciones que se
realizarán para obtener la ejecución del proyecto propuesto. Aplicando el uso de los
diagramas facilita la compresión de problemas complicados y usualmente muy largos.
Para la realización de los diagramas se utilizó una herramienta para moldeamiento en
los estándares UML.
Brevemente facilitaremos una explicación del proyecto a ejecutarse, el Estudiante del
CUC necesitara obtener una Tarjeta de código de respuesta rápida (Quick Response, QR),
el cual se generara desde el portal web de la institución. Este diseñó para ser decodificado a
alta velocidad, a través del escaneo con un dispositivo móvil inteligente, así el estudiante
podrá tener fácil acceso a su información académica mediante un portal de consultas
intuitivo y adaptable a cualquier dispositivo, logrando de esta manera una automatización
del proceso de consultas académicas.
1- TDR y ERS Página 4
Proyecto Socio Tecnológico - Trayecto 3 - Trimestre II
Propósito del Documento
Siguiendo las mejores prácticas de un compendio de metodologías, los profesores y
Especialistas de área del Colegio Universitario de Caracas (CUC) coincidieron en solicitar
los diferentes diagramas que en este documento se realizaran, con el fin de mantener un
estándar de documentación, sin importar que ciertos criterios no apliquen para todos los
proyectos.
En cumplimiento con esta solicitud de la institución, que para nosotros también pasa
a ser la comunidad, se desarrollan todos los diagramas solicitados, a fin de cumplir con los
estándares.
1- TDR y ERS Página 5
Proyecto Socio Tecnológico - Trayecto 3 - Trimestre II
Definiciones Siglas y Abreviaturas
Código QR
(Quick Response Code, «Código de Respuesta Rápida») es un módulo paraalmacenar información en una matriz de puntos o en un código de barras bidimensional. Elobjetivo del código fue que su contenido se leyera a alta velocidad.
PHP
(Acrónimo recursivo de PHP: Hypertext Preprocessor) es un lenguaje de códigoabierto muy popular especialmente adecuado para el desarrollo web y que puede serincrustado en HTML.
MySql
Es un sistema de gestión de bases de datos relacionales (RDBMS) basado en SQL(Lenguaje de Consultas Estructuradas).
PDF (Portable Document Format,)
Formato de documento portátil, es un formato de almacenamiento para documentosdigitales independiente de plataformas de software o hardware. Este formato es de tipocompuesto (imagen vectorial, mapa de bits y texto).
HTML5 (HyperText Markup Language, version 5)
Es un estándar que sirve de referencia para la elaboración de páginas web en susdiferentes versiones, define una estructura básica y un código (denominado código HTML)para la definición de contenido de una página web, como texto, imágenes, videos, entreotros.
JQuery
Permite simplificar la manera de interactuar con los documentos HTML, manipularel árbol DOM, manejar eventos, desarrollar animaciones y agregar interacción con latécnica AJAX a páginas web.
CSS3 (cascading style sheets)
Hoja de estilo en cascada, es un lenguaje usado para definir y crear la presentaciónde un documento estructurado escrito en HTML o XML2 (y por extensión en XHTML).
1- TDR y ERS Página 6
Proyecto Socio Tecnológico - Trayecto 3 - Trimestre II
DATACUC
Es el departamento de desarrollo del Colegio Universitario de Caracas, se encargadel Diseño, Desarrollo y Mantenimiento de la plataforma tecnológica de esta comunidad ypertenece a la Coordinación de Desarrollo Tecnológico.
BOOTSTRAP
Es un framework o conjunto de herramientas de software libre para diseño de sitiosy aplicaciones web. Contiene plantillas de diseño con tipografía, formularios, botones,cuadros, menús de navegación y otros elementos de diseño basado en HTML y CSS, asícomo, extensiones de JavaScript opcionales adicionales.
1- TDR y ERS Página 7
Proyecto Socio Tecnológico - Trayecto 3 - Trimestre II
I. DIAGRAMAS DE ESTRUCTURA
1. Diagrama de Clases
1- TDR y ERS Página 8
Proyecto Socio Tecnológico - Trayecto 3 - Trimestre II
1.2. Descripción de Diagrama de Clases
En el recuadro principal se representan las clases pertenecientes al sistema DATACUC,
del cual se generararn varios de los repostes disponibles en el sistema QR, en la cual solo se
necesita el acceso a la Base de datos para obtener la informacion de los usuarios en sesion.
1- TDR y ERS Página 9
Proyecto Socio Tecnológico - Trayecto 3 - Trimestre II
2. Diagrama de Objetos
2.1.Descripción de Diagrama de Objetos
El estudiante representa el principal usuario del sistema, este debe crear un reporte
con el código QR desde el actual sistema que se encuentra en www.cuc.edu.ve. Este reporte
tendrá la información para ingresar al sistema de consulta de datos de una forma más
simple.
Las consulta realizadas por los estudiantes, se generaran en un archivo PDF, el cual
podrán guardar en sus dispositivos móviles o imprimir directamente.
1- TDR y ERS Página 10
Proyecto Socio Tecnológico - Trayecto 3 - Trimestre II
3. Diagrama de Paquetes
3.1.Descripción de Diagrama de Objetos
El paquete de interfaz de usuario (GUI), el cual contiene el código QR y el acceso al
sistema. Cada uno de los elementos pertenecientes al paquete Alumno, corresponde a las
consultas que este puede realizar desde el sistema.
1- TDR y ERS Página 11
Proyecto Socio Tecnológico - Trayecto 3 - Trimestre II
4. Diagrama de Componentes
4.1. Descripción del Diagramas de Componentes
Diagrama de Componentes del Sistema (Generar Código QR)
Para Generar el Código QR lo estudiantes deben acceder a la página
www.cuc.edu.ve, una vez que cargue la página debes iniciar sesión dando clic en el botón
donde indica Estudiante / Trabajador, en el recuadro siguiente se solicita datos de acceso
(Usuario y contraseña), al colocar los datos correctamente se ingresa a la página principal
del aplicativo (Homecuc.html), una vez allí se debe seleccionar la Opción GenerarQR, al
dar clic llamara a la clase GeneraReporteQR.php donde utilizara la librería FPDF.php para
generar el PDF y la ChartAPI para generar la imagen del Código QR con los Datos de la
sesión (La cedula del estudiante).
Diagrama de Componentes del Sistema (Consulta de Datos y generar PDF)
Para Ingresar se debe escanear el Código QR con un dispositivo Inteligente (Tener
Instalado un APP que escanee el Código QR), una vez es escaneado el Código QR
accederá a la página en Login.php donde se debe introducir la contraseña (la misma
1- TDR y ERS Página 12
Proyecto Socio Tecnológico - Trayecto 3 - Trimestre II
contraseña que se usa para acceder al portal desde la página web del CUC), allí dispara la
acción ValidaAcceso.php, donde consultara la contraseña en la Base de Datos, de ser
incorrecta la contraseña volverá a pedir la misma (entra en LoginError.php) hasta ser la
correcta, al Tercer Intento entra en Logut.php; de ser correcta la contraseña abrirá la página
Index.html donde mostrara las opciones segun el alcance definido.
Al seleccionar Inscripción Actual llamara a la acción Constancia de Inscripcion.php
donde retornara los datos de la Base de Datos (UPC) y generará el PDF con FPDF.
Al seleccionar Notas del Período llamara a la acción Constancia de Notas Simples.php
donde retornara los datos de la Base de Datos (UPC) y generará el PDF con el FPDF.
Al seleccionar Notas Definitivas por Trayecto llamara a la acción
ConstanciaNotasLapsoImpreso.php donde se retornara los datos de la Base de Datos (UPC)
y generará el PDF con el FPDF.
1- TDR y ERS Página 13
Proyecto Socio Tecnológico - Trayecto 3 - Trimestre II
5. Diagrama de Despliegue
5.1.Descripción del Diagrama de Despliegues
Diagrama de Despliegues del Sistema (Generar Código QR)
En el Servidor 01 Se encuentra el HTML y los PHP donde se comunicara con el
Servidor 02 donde se encuentra la Base de datos.
Diagrama de Despliegues del Sistema (Consulta de Datos y generar PDF)
En el Servidor 01 Se encuentra el HTML y los PHP donde se comunicara con el
Servidor 02 donde se encuentra la Base de datos.
1- TDR y ERS Página 14
Proyecto Socio Tecnológico - Trayecto 3 - Trimestre II
I. DIAGRAMAS DE COMPORTAMIENTO
1. Diagrama de Estado
I. Descripción del Diagramas Estado
Se identifica cada una de las fases de ejecución del proyecto, mediante un tiempo de
espera se obtendrán resultados de cada uno de los estados presentados en el diagrama de
estado.
Se presenta cuatro (4) estados definidos en: tiempo de Espera, Aceptado, Espera de
Respuesta y Creado para la ejecución y el fin de cada uno de los proceso del Proyecto.
1- TDR y ERS Página 15
Proyecto Socio Tecnológico - Trayecto 3 - Trimestre II
II. DIAGRAMAS DE INTERACCIÓN
1. Diagrama de Secuencia
1- TDR y ERS Página 16
Proyecto Socio Tecnológico - Trayecto 3 - Trimestre II
1.1.Descripción del Diagrama de Secuencia
En el Diagrama presentado observamos la ejecución del proceso en forma secuencial.
El Estudiante al obtener la Tarjeta QR y escanear el código accederá al sistema mediante
una validación. El sistema proporcionará la opción al estudiante de elegir la información
que desee obtener, que a su vez será de su elección imprimir o guardar el reporte generado.
III. MODELO VISTA CONTROLADOR
1. Diagrama de MVC
1- TDR y ERS Página 17
Proyecto Socio Tecnológico - Trayecto 3 - Trimestre II
1.1.Descripción Modelo Vista Controlador
Implementación Modelo Vista Controlador: Generación Tarjeta QR
Modelo: La base de datos es en Mysql, se trabajara bajo la estructura del esquema
UDTDATACUC suministrada por la comunidad, ya que la única función de la
aplicación es consultar información.
Vista: Codifica y mantiene la presentación final de la aplicación de cara al usuario,
la misma será elaborada código HTML5 con CSS3 y Jquery, Mantiene el home que
conserva la comunidad actualmente, y se agrega una nueva Opción que se denomina
"Generar Tarjeta QR”. Se utilizara Framework de Bootstrap para obtener un diseño
ajustable a cualquier resolución.
Controlador: Es la parte más importante del sistema, ya que es el enlace entre el
modelo y la vista. El sistema a implementar será elaborado y mostrado con un
Generar.PHP, generando un archivo PDF el cual tendrá anexa un código QR para el
escaneo del mismo. Esta es la parte lógica de la aplicación.
1- TDR y ERS Página 18
Proyecto Socio Tecnológico - Trayecto 3 - Trimestre II
Implementación Modelo Vista Controlador: Código QR
Modelo: La base de datos es en Mysql, se trabajará con la estructura del esquema
UDTDATACUC suministrada por la comunidad, ya que la única función de la
aplicación es consultar información.
Vista: Codifica y mantiene la presentación final de la aplicación de cara al usuario,
para esta el código es en HTML5 con CSS3 y Jquery, se utilizara Framework de
Bootstrap para obtener un diseño ajustable a cualquier resolución.
Controlador: Es la parte más importante, ya que es el enlace entre el modelo
y la vista. El sistema a implementar será elaborado con PHP. Mostrando una serie
de opciones con las que trabaja actualmente la comunidad.
1- TDR y ERS Página 19
Proyecto Socio Tecnológico - Trayecto 3 - Trimestre II
Entre los controladores se encuentra:
ValidaAcceso.php: Permite la validación y acceso del estudiante al sistema.
ConstanciaNotasLapsoImpreso.php: Genera un Archivo PDF con las notas de lapso,
el archivo puede ser impreso o guardado dependiente del complacencia del
estudiante
ConstanciadeInscripcion.php: Genera un Archivo PDF constando que el estudiante
está Inscrito en la Institución, el archivo puede ser impreso o guardado dependiente
del complacencia del estudiante
ConstanciadeNotassimpleInscripcion.php: Genera un Archivo PDF mostrando un
constancia simple de las notas del estudiante, el archivo puede ser impreso o
guardado dependiente del complacencia del estudiante.
1- TDR y ERS Página 20
Proyecto Socio Tecnológico - Trayecto 3 - Trimestre II
IV. INTERFAZ USUARIO
1- TDR y ERS Página 21
Proyecto Socio Tecnológico - Trayecto 3 - Trimestre II
V. REPORTES
PDF de Generación de Tarjeta QR
1- TDR y ERS Página 22
Proyecto Socio Tecnológico - Trayecto 3 - Trimestre II
1- TDR y ERS Página 23
Proyecto Socio Tecnológico - Trayecto 3 - Trimestre II
1- TDR y ERS Página 24