INGENIERÍA WEB Dr. Mario Rossainz López Fac. de Cs. de la Computación Benemérita Universidad Autónoma de Puebla Otoño de 2017
INTRODUCCIÓN: Aspectos importantes en las aplicaciones WEB Modelo de Dominio Interfaz de usuario
INTRODUCCIÓN: Mezclan Aspectos Conceptuales Requerimientos Disjuntos Tecnologías No Basadas en objetos Aspectos de Presentación Separan Tecnologías Basadas en objetos
INTRODUCCIÓN: CARACTERÍSTICAS: Acortar el tiempo de desarrollo de la aplicación Mantenimiento más simple de la aplicación Tecnologías Basadas en objetos Desarrollo de la aplicación por capas
Desarrollo en Capas de Aplicaciones WEB: 1. Dominios de aplicación (Conceptual) 2. Navegación 3. Interfaz 4. Implementación
1. Diseño Conceptual: a) Se construye representado por los objetos del dominio, las relaciones y colaboraciones entre ellos. b) Se constituye de clases, sus relaciones y subsistemas c) Se utiliza UML-Extendido y Tarjetas CRC
1. Diseño Conceptual:
2. Diseño Navegacional: a) Es una vista sobre el diseño conceptual b) Se construyen modelos diferentes respecto de usuarios diferentes c) Se utilizan clases y contextos navegacionales para el diseño d) Las clases navegacionales contienen nodos, enlaces y estructuras e) Los contextos navegacionales son conjuntos de nodos, enlaces y clases
2. Diseño Navegacional:
3. Diseño de la Interfaz Abstracta a) Construcción de diferentes interfaces para el mismo modelo navegacional b) Se utiliza un diseño de interfaz abstracta que especifica la organización y comportamiento de la interfaz c) La apariencia física y disposición de las propiedades de la interfaz abstracta en la pantalla real se lleva a cabo en la fase de implementación.
3. Diseño de la Interfaz Abstracta
4. Implementación a) Implementación del diseño b) En esta fase se tiene en cuenta el entorno donde correrá la aplicación c) Se definen los items de información del dominio del problema
4. Implementación
Comparativo de metodologías para el desarrollo de Aplicaciones WEB
1. Metodología Iterativa e Incremental OO basada en UML y PUDS 2. Centrada en actividades de modelado que incluye: 1. Análisis de Requerimientos 2. Diseño Conceptual 3. Diseño de Navegación 4. Modelado de Presentación 5. Modelado de tareas y Visualización de escenarios 3. ArgoUML es una herramienta CASE que soporta el modelado en UWE y generación semi-automática de código
Modelado de Casos de Uso en UWE 1. Los requerimientos para una aplicación WEB son especificados mediante un modelo de casos de uso 2. Elementos Principales: Actores, Casos de uso, relaciones (asociaciones) actor-actor, actor-caso de uso, caso_de_usocaso_de_uso 3. Uso de dependencias: <<include>>, <<extends>> 4. Diagramas de casos de uso 5. Descripción textual del funcionamiento de los casos de uso o bien uso de diagramas de actividades para especificar la secuencia de acciones realizadas por los actores sobre los casos de uso
Modelado de Casos de Uso en UWE (captura de requerimientos)
Diseño Conceptual (Modelado de clases): 1. Se construye una vista estática del sistema en el dominio de la aplicación 2. Ignora aspectos de navegación, presentación e interacción 3. Se utilizan clases con características adicionales: 1. Asociaciones (agregación, herencia y composición) 2. Roles 3. Multiplicidades 4. En base a los casos de uso y a sus descripciones se construye el modelo conceptual
Diseño Conceptual (Modelado de clases):
Diseño de Navegación (clases estereotipadas): 1. Comprende la construcción de dos modelos: Modelo del espacio de navegación Modelo de la estructura de navegación 2. Los modelos de navegación son representados mediante clases estereotipadas Para entidades:<<navigation-class>>, <<index>>,<<guidedtour>>, <<query>>, <<menu>>,<<server Page>>, <<Client Page>>, <<Form>> Para relaciones: <<build>>,<<link>>,<<submit>> Otros: <<Javascript>>,<<Applet>>, <<Flash>>
Diseño de Navegación. Modelo del Espacio de Navegación 1. Incluye las clases de aquellos objetos que pueden ser visitados por la navegación sobre la aplicación WEB 2. Los elementos principales son las clases estereotipadas y la navegabilidad dirigida (asociación estereotipada) 3. Se toman sólo aquellas clases del modelo conceptual reelevantes para la navegación 4. La información de las clases omitidas pueden ser atributos de algunas de las clases de navegación
Diseño de Navegación. Modelo del Espacio de Navegación
Diseño de Navegación. Modelo de la Estructura de la Navegación 1. Se construye sobre la base del modelo del espacio de navegación 2. Es un refinamiento en la fase de diseño de la aplicación 3. El refinamiento consiste en incluir índices, líneas dirigidas, consultas y menús
Diseño de Navegación. Modelo de la Estructura de la Navegación
Diseño o Modelo de Presentación 1. Se representa por un diagrama de clases que tiene una forma particular utilizando la notación de composición para clases 2. Es un diagrama anidado para modelar interfaces gráficas y ordenamiento espacial de la información 3. Describe donde y como los objetos de navegación y las primitivas de acceso son presentadas al usuario 4. Muestra la localización estática de los objetos visibles al usuario 5. Se utilizan los siguientes estereotipos para describir el modelo de presentación <<text>>, <<form>>, <<button>>, <<image>>, <<audio>>, <<collection>>, <<anchor>>, <<anchor-collection>>
Diseño o Modelo de Presentación
Diseño o Modelo de Presentación
Diseño de Escenarios WEB (diagramas de interacción y estados) 1. Se utilizan los diagramas de trancisión de estados para visualizar escenarios de navegación. 2. Los detalles del modelo de la estructura de navegación especifican los eventos que provocan las transiciones, haciendo explícitas las acciones a realizarse 3. Se pueden utilizar diagramas de secuencia para mostrar la interacción de los objetos en orden temporal
Diseño de Escenarios WEB (diagramas de interacción y estados)
Modelado de Tareas (diagramas de actividades) 1. Se modelan las tareas realizadas por el usuario o por el sistema que se han propuesto en diferentes notaciones de UML: clases estereotipadas, casos de uso, diagramas de actividades, de transición de estados, etc., mediante los diagramas de actividades 2. Los diagramas de actividades son considerados mapas de caminos del comportamiento funcional de un sistema
Modelado de Tareas (diagramas de actividades)
Modelado de Componentes (diagramas de componentes) 1. UWE utiliza los diagramas de componentes de UML para documentar la distribuicón de los componentes de una aplicación WEB 2. Los elementos principales son los nodos (cubos) y dentro de ellos objetos y componentes que residen dentro de una fuente computacional 3. Un componente es una parte física de un sistema modelado en UML como un rectángulo con 2 rectángulos más pequeños superpuestos
Modelado de Componentes (diagramas de componentes)