Walter Juan Pairo Juan Esporrín...

50
Walter Juan Pairo Juan Esporrín Palacios

Transcript of Walter Juan Pairo Juan Esporrín...

Walter Juan Pairo

Juan Esporrín Palacios

Història

Introducció

Sistema Web

Metodologies de disseny Web

OOWS

Internet neix a principis dels 60 quan es comencen a utilitzar xarxes de commutació de paquets (enviar a diferents usuaris sense pèrdua de paquets).

Tot i que es va crear a Europa, 8 anys més tard l’agència de Defensa dels EEUU Advanced Research Projects Agency(ARPA) va començar a utilitzar aquestes xarxes

Neix el Network Control Protocol al 1969 i és reemplaçat al 1982 pel TCP / IP

Internet es crea, formada per un conjunt de computadores de l’exèrcit d’EEUU. D’aquesta manera, es pretenia evitar que el seu sistema de comunicació quedés inutilitzat en cas de un atac nuclear dels rusos (i poder contraatacar)

Arpanet (com es va coneixer aquesta xarxa) implementa per primer cop els E-mails.

Usenet – Es comencen a connectar totes les universitats d’estats units per a tal de poder compartir dades experimentals i recursos educatius.

1973 – Es connecta el primer ordinador fora dels E.E.U.U a la xarxa americana (University College of London, England)

Neix com a document amb referències creuades

Es crea molta informació i és difícil trobar-la, per tant s'idea una manera per a buscar la informació sense perdre temps cercant-la, al 1945

La WWW inventada al 1989 per TIM Berners-Lee, informàtic del CERN (Centre d'investigació Nuclear Europeu), basat en hipertexte (model de connexió de documents electrònics), per a tal d'agilitzar la comunicació entre els científics del centre.

Es dissenya el llenguatge d'intercanvi HTML i el protocol de xarxa HTTP per a que puguin ser llegit per tot tipus de computadora.

Els sistemes web són relativament nous en el mon de la computació

Les aplicacions web cada cop són més complexes

Inicialment no es modelava, aviat però van sorgir metodologies per solucionar-ho

Entorn de requisits molt canviants

Gran número d’usuaris (mundial)

L’equip de desenvolupadors sol ser reduït

Classificació de Sistemes Web◦ Estàtics

◦ Estàtics amb formularis d’entrada

◦ Amb accés dinàmic a dades

◦ Construïts dinàmicament

◦ Aplicacions Software per la Web

Comerç electrònic, hipermèdia, aplicacions clàssiques,...

El servidor web ofereix pàgines web i recursos (imatges, text, flash, css,....)

Els recursos s’identifiquen d’una forma única mitjançant URL o URI

Client (Navegador Web)

Servidor web

Sistema de Fitxers/Base de dades

Petició

Document/Recurs

Aplicacions Web

Web 1.0 i Web 2.0

Capturar la navegació ...

... especificar cerques...

... i l’execució de serveis... Tractar la visualització de la informació...

Per la comunicació entre el client i el servidor s’utilitza el protocol HTTP. No es mante la connexió desprès d’una petició

Això genera, que sigui necessari recorre a les cookies per saber l’estat del client (sessions)

Una aplicació web genera una pagina web per un client en funció de N variables. Cal diferencia pagina d'aplicació

Una aplicació web es un sistema Web que ens ofereix una lògica de negoci. Fa de frontend (interfícies, formularis,...)

Aquestes aplicacions necessiten gestionar essencialment:◦ Requisits de Navegació dins de l’aplicació

◦ Presentació de l'informació

◦ Gestió de l’informació (filtrats, cerques,...)

◦ Tractament d’usuaris

Gran quantitat de tipus d’usuaris

Adaptació / Personalització

◦ Requisits de les aplicacions “clàssiques”

Per construir entorns de desenvolupament Web es necessari....◦ Definir un procés sistemàtic i estructures de

producció de software

◦ Facilitar la especificació dels sistemes fent servir tècniques basades en el modelatge conceptual

◦ Permetre la rapida prototipació

Enginyeria Web!!!

En els últims anys han aparegut gran quantitat d’aproximacions metodològiques per facilitar la construcció de solucions web

Actualment no existeix cap mètode totalment establert

Hi ha dos tendències clares

Orientades al disseny hipermèdia (navegació)◦ Dotar de dinamisme als sistemes

◦ Construir aplicacions hipermèdies on s’uneixi el concepte de navegació amb la multimèdia en sistemes estàtics

◦ Metodologies: OOHDM, WebML, ADM, AutoWeb, RMM, HDM...

Orientades a aplicacions dinàmiques (funcionalitat)◦ Bàsicament intenta introduir les característiques de

navegació al model OO.

◦ Metodologies : UWE, WSDM, EORM, OOH, OO-Method,...

Ens centrem amb el OOWS

Es bastant adequada per aplicacions web basades en Serveis Web (SW) XML

En aplicacions les quals cobra importància la presentació, informació, navegabilitat i usabilitat de l’aplicació Web

OOWS (Object Oriented Web Solution)◦ Introdueix nous conceptes OO per donar la noció

de semàntica navegacional i de presentació

◦ Defineix un procés de producció sistemàtic adaptat a la web

◦ Fa ús d’una estratègia de generació de codi basada en models (patrons de software)

◦ Extensió adequada de OO-Method (un mètode OO de disseny de software) utilitzant l’anotació UML

Que és la navegació?◦ La navegació és el salt d’una pagina web a una

altre, provat per la selecció d’un enllaç, en el que es canvia de contingut (informació i/o funcionalitat)

Especifica les característiques navegacionals de les aplicacions web (accés a informació i execució de serveis)

Es construeix mitjançant primitives (gràfiques) d’abstracció navegacional

Defineix una estructura d’accés al sistema pels diferents tipus d’usuaris◦ Gestió d’usuaris

Diagrames d’usuaris

◦ Definir una estructura navegacional

Mapes navegacionals

Detecció de tipus d’usuaris

Especificació d’inter-relacions entre usuaris

Definició de visibilitat d’atributs i operacions per cada tipus d’usuari

Anonymous

Member Guest

Administrator

+create()

+modif y ()+destroy ()

+promote2Admin()

-personalId

-name

-surname-userId

-email

-isDoctor

-isPhDStudent

-hasGone-web

-photo

-initialYear

-initialMonth

Member

Anony mous

Tipus d’usuaris(categorització)

Visibilitat d’atributs/operacions

Proporciona una vista global del sistema per cada usuari (authoring-in-the-large)

És un graf navegacional composat per:◦ Contexts Navegacionals

◦ Enllaços Navegacionals

Defineix l’estructura del Sistema Web

◦ Contexts Navegacionals

◦ Enllaços Navegacionals

Defineix una relació

Dos tipus d’enllaços◦ De seqüència, definits implícitament per les

relacions navegacionals del context

◦ D’exploració, definits implícitament per contexts d’exploració

◦ seqüència, exploració

Dos tipus de context◦ Exploració, sempre accessibles (un pot ser el Home)

◦ Seqüència, accessibles mitjançant un camí

Representa una vista parcial del sistema◦ Especifica accés a un conjunt d’atributs i operacions

Gràficament composat per paquets UML

Composat per ◦ Classes

◦ Relacions

◦ Exploració, Seqüència

Paquets UML

Es poden especificar filtres

Dos tipus de classes◦ Directora

Classe principal

Tota l’exploració de

l' informació prové

d’ella

Només una per context

◦ Complementaries

Complementen

d’informació

Poden ser varies

<< context >>

Members

+modify()

-name

-surname

-personalID

-email

-isDoctor

-isPhDStudent

-web

-photo

Member

-phones

-status

WorkOn

-name

-address

-web

-city

-state

-country

Entity

-name

-acronym

-web

RGroup/ Leader /RGroup.name

[ RGroup ]

not hasGone

ATTRIBUTE ACCESS STRUCTURE Members

ATTRIBUTES name, email, isPhD, WorkOn.status

LINK ATTRIBUTES name

E

ATTRIBUTE FILTER ByName

ATTRIBUTES name

TYPE APPROXIMATE

«view»Member

«view»WorkOn

«view»Entity

Relació binaria unidireccional entre dos classes

Representa un requisit per recuperar informació complementaria relacionada

Dos tipus◦ Relacions de dependència contextual

No defineixen navegació

◦ Relacions de context

Defineixen navegació a un context destí

◦ Diagrames d’usuaris

◦ Mapa Navegacional

Context Navegacional

Classe Navegacional

Relació Navegacional (dos tipus)

Enllaç navegacional

Aquest model captura els requisits abstractes de presentació d’informació

Es basa en el model de presentació associat a cada node (context) del model de navegació

Associa patrons de presentació als elements que constitueixen navegacionals (classes, relacions, índex,...)

Els patrons de presentació són:◦ Disposició de l' informació (Layout) [registre, tabulat, arbre, mestre-detall]

◦ Criteris d’ordenació d’informació per part dels atributs

[ASCendent, DESCendent]

◦ Paginació de l' informació

Cardinalitat de conjunts (numero d’elements)

[estàtica, dinàmica]

Mode d’accés als conjunts

[seqüencial, aleatori]

Disposició (“layout pattern”)[registre, tabulat, arbre, mestre-detall]S’aplica a: relacions navegacionals, classe directora

Paginació d’informacióCardinalitat de bloc

[estàtica, dinàmica] Mode d’accés

[seqüencial, aleatori]S’acplia a: contexts, relacions navegacionals, índex i filtres

Ordenació[ASCendent, DESCendent]S’aplica a: classes navegacionals(atributs), índex i filtres

S’aplica als patrons de presentació, als elements que componen un Context de Navegació

OOWS és una extenció a l’estretegia de generació de codi de OO-Method◦ Introdueix la interefície web

◦ Reusa la lògica de negoci i la persistència

Compilació dels esquemes conceptuals (model de nevagació i presentació)◦ Aplica patrons de traducció

Mapa Navegacional: defineix l'estructura de pagines web enllaçades

Context Navegacional: pagina web

Context d’exploració: pagines web accessibles

Context Home: si no es defineix es crea automàticament

Estratègia bàsica◦ 1 context navegacional -> 1 pàgina Web

Cada pàgina Web esta estructurada en zones o àrees

Les àrees bàsiques◦ Area de Navegació

◦ Area d’Informació

El contingut i la presentació de cada pàgina s'obté de la especificació d’un context de navegació

Es genera la meta-informació de la navegació

Possible existència d’altres àrees

Analista, dissenyador, maquetador, programador.

Analista: s'encarrega d'esberinar les necessitats de l'empresa i les funcionalitats

Dissenyador: Un cop es té tot el que es necessita, es fa el disseny

Maquetador: Un cop fet el disseny, es passa a programar l'estructura (CSS p.ex)

Programador: Sobre l'estructura feta, es programen totes les funcions de la web

<div id="banner"><img src="static/banner_top.gif" />

<div id="sig_ban"><div id="letrasbanner"><a href="">ESP</a> <div style="position:absolute; left:22px; top:0px"><img

src="static/separador_banner.gif" /></div> <a href="">&nbsp;ENG</a></div><div id="barrabanner“><img src="static/linea_contactar.gif" /></div><div id="barrabanner2“><img src="static/barra_head.gif" /></div>

Protocols i estàndars per intercanviar dades entre aplicacions.

Compatibles amb tots els sistemes degut a que usen protocols “oberts”

Aquest conjunt de protocols es coneix com Web Services Protocol Stack

XML: És el format estàndard que s’usa per a representar les dades que s’han de transmetre.

SOAP i XML-RPC: Principals protocols per a establir la comunicació entre les diferents parts.

WSDL: Llenguatge per a definir la interficiepublica del servei. Defineix els aspectes necessaris per establir la connexió amb un web service concret (XML).

UDDI: Protocol per publicar la informació dels serveis webs que estan disponibles. Permet a les aplicacions localitzar els serveis disponibles.

Avantatges:◦ Permeten operar entre aplicacions, plataformes i

llenguatges diversos

◦ Fomenten l’ús dels estàndards i protocols basats en text (permet accedir al seu contingut de manera més intuïtiva i fàcil)

Inconvenients:◦ Rendiment baix comparat amb altres models de

computació distribuïda.