Universidad Central de Venezuela

Facultad de Ciencias
Escuela de Computacin

Lecturas en Ciencias de la Computacin
ISSN 1316-6239




Aplicaciones en Internet

Jossie Zambrano
Eugenio Scalise

ND 2012-02























Centro de Ingeniera de Software y Sistemas (ISYS)
Caracas, marzo 2012

Universidad Central de Venezuela
Facultad de Ciencias
Escuela de Computacin







Aplicaciones en Internet











Prof. Jossie Zambrano
jossie.zambrano@ciens.ucv.ve
Prof. Eugenio Scalise
eugenio.scalise@ciens.ucv.ve

Centro de Investigacin de Ingeniera de Software y Sistemas (ISYS)
Caracas, Marzo 2012
2

Contenido
1. Ingeniera Web ...................................................................................................................................... 3
1.1 Atributos de las Aplicaciones Web ................................................................................................. 3
1.2 Proceso de Desarrollo de Aplicaciones Web .................................................................................. 4
1.2.1 UWE UML ................................................................................................................................. 6
1.2.3 WSDM ...................................................................................................................................... 6
1.2.4 WebML ..................................................................................................................................... 7
1.2.5 WebSA ...................................................................................................................................... 7
2. Aplicaciones Web .................................................................................................................................. 8
2.1 Arquitectura de Aplicaciones Web ................................................................................................. 9
2.2 Arquitecturas de Software para Aplicaciones Empresariales ....................................................... 11
2.3 Patrones ........................................................................................................................................ 12
2.3.1 Patrn de Diseo Arquitectnico Modelo Vista Controlador ................................................ 12
2.3.2 Patrn de Diseo Arquitectnico Active Record ................................................................... 13
2.3.3 Patrn de Diseo Arquitectnico Table Data Gateway (TDG) ............................................... 14
2.3.4 Patrn de Diseo Arquitectnico Data Mapper .................................................................... 14
2.3.5 Patrn Data Access Object (DAO) .......................................................................................... 14
2.3.6 Patrn Domain Store ............................................................................................................. 15
3. Tecnologas Web ................................................................................................................................. 15
3.1 Tecnologas del lado del Cliente ................................................................................................... 15
3.1.1 Lenguajes de Marcado ........................................................................................................... 15
3.1.2 CSS.......................................................................................................................................... 18
3.1.3 Lenguajes de Scripting ........................................................................................................... 19
3.1.4 Aplicaciones de Internet Enriquecidas .................................................................................. 21
3.2 Tecnologas del lado del Servidor ................................................................................................. 23
3.2.1 Taxonoma de Aplicaciones Web segn Enfoque Tecnolgico. ............................................. 24
3.2 Servicios Web ................................................................................................................................ 29
Referencias ............................................................................................................................................. 31


3

La evolucin de las Tecnologas de Informacin y Comunicacin ha otorgado a la red Internet y al World
Wide Web un papel predominante en el mundo tecnolgico, social, educativo y econmico. Las
Aplicaciones en Internet han modificado la forma cotidiana de obtener informacin, realizar negocios e
intercambios comerciales, recibir instruccin y comunicarse. La red Internet es un importante medio
para organizaciones e individuos, quienes interactan empleando aplicaciones desarrolladas con
tecnologa Internet, las cuales se han vuelto muy populares ya que poseen ventajas significativas sobre
las aplicaciones tradicionales en una variedad de escenarios. Es por ello que esta nota docente presenta
un compendio relacionados a Aplicaciones en Internet, cuyo propsito es proveer al estudiante un
panorama de los conceptos y fundamentos tecnolgicos de la red Internet y el World Wide Web, as
como los mtodos y tcnicas en el desarrollo de estas aplicaciones.
1. Ingeniera Web
Los cambios rpidos en la tecnologa e inclusive en los requerimientos traen como consecuencia que
prcticas y procesos tradicionales de la ingeniera de software no sean totalmente adecuados para el
desarrollo de aplicaciones web. Actualmente tiene gran auge la ingeniera web (IWeb) como una
disciplina de la ingeniera de software que estudia procesos, mtodos, tcnicas y herramientas para la
especificacin, implementacin, operacin y mantenimiento de aplicaciones web. Segn [14] la
ingeniera web puede ser considerada una rama independiente de la ingeniera de software que consiste
en la aplicacin de enfoques sistemticos y cuantitativos para el anlisis de requerimientos, diseo,
implementacin, prueba, operacin y mantenimiento de aplicaciones web de manera rentable.
Los sistemas y aplicaciones basados en tecnologas web, ofrecen un complejo arreglo de contenido y
funcionalidad a una amplia poblacin de usuarios finales. La ingeniera web es el proceso con el que se
crean aplicaciones web de alta calidad. La IWeb no es un clon perfecto de la IS, pero toma en cuenta
muchos conceptos y principios fundamentales de ella. Adems, el proceso de IWeb acenta actividades
tcnicas y administrativas similares. Existen sutiles diferencias en la manera como se dirigen dichas
actividades, pero el mtodo primordial dicta un enfoque disciplinado para el desarrollo de un sistema
computacional.
La IWeb es de vital importancia ya que se integran cada vez ms en las estrategias de negocio para
pequeas y grandes empresas (por ejemplo el comercio electrnico), crece en importancia la necesidad
de construir sistemas confiables, prcticos y adaptables. Por tanto es necesario un enfoque disciplinado
en cuanto el desarrollo de aplicaciones web.
Al igual que cualquier disciplina de ingeniera, la IWeb aplica un enfoque genrico que se suaviza
mediante estrategias, tcticas y mtodos especializados. El proceso IWeb comienza con una formulacin
del problema que se resolver con la aplicacin. Se planea el proyecto IWeb y se modelan los
requerimientos y el diseo de la aplicacin. El sistema se construye con herramientas especializadas
asociadas con la web para entregar a los usuarios finales y as evalar mediante criterios tanto tcnicos
como empresariales. Dado que las aplicaciones evolucionan continuamente, se deben establecer
mecanismos para el control de configuraciones, el aseguramiento de la calidad y el soporte continuo. En
ocasiones es difcil asegurar la calidad de la aplicacin web; sin embargo, se aplican prcticas que
aseguran la calidad de software para valorarla en los modelos IWeb, el contenido y la funcin global del
sistema, la facilidad de uso, el desempeo y la seguridad.
1.1 Atributos de las Aplicaciones Web
Segn [12] en la mayora de las aplicaciones web se encuentran los siguientes atributos:
4

Intensidad de Red: Una aplicacin web reside en una red y debe satisfacer las necesidades de una
variada comunidad de clientes. Una aplicacin web puede residir en la Internet, Extranet o Intranet.
Concurrencia: Un gran nmero de usuarios puede tener acceso a la aplicacin web al mismo
tiempo. En muchos casos, los patrones de uso entre los usuarios finales variarn enormemente.
Carga impredecible: El nmero de usuarios de la aplicacin web puede variar en rdenes de
magnitud diariamente.
Desempeo: Si un usuario de aplicaciones web debe esperar demasiado puede decidir irse a
cualquier otra parte.
Disponibilidad: Los usuarios de aplicaciones web populares frecuentemente demandan acceso 24
horas, 7 das de la semana, los 365 das del ao.
Gobernada por los datos: La funcin primordial de muchas aplicaciones es usar hipermedia para
presentar contenido de texto, grfico, audio y video al usuario final, adems, por lo general, las
aplicaciones web se utilizan para tener acceso a la informacin que existe en la BD que
originalmente no eran parte integral del ambiente basado en web. (ej: comercio electrnico,
aplicaciones financieras).
Sensibilidad al contenido: La calidad y naturaleza esttica del contenido sigue siendo un importante
determinante de la calidad de una aplicacin web.
Evolucin continua: A diferencia del software de aplicacin convencional, que evoluciona a lo largo
de una seri( )-45(lte)-3( d)12(e )-3(la c)10(ali)4(d)3(ad)4( de )-2(u)3(n)3(a apl)4(icaci)13()-5(n)3( )] TJETBT1 0 0 1 298.85 491.83 Tm[(w)] TJETBT1 0 0 1 306.65 491.83 Tm 0.0221 Tc[(eb)] TJETBT1 0 0 1 317.95 491.83 Tm 0 Tc[(.)] TJETBT/F1 11.04 Tf1 0 0 1 320.71 491.83 Tm[( )] TJET EMC /P <</MCID 7/Lang (es-VE)>> BDC BT/F5 11.04 Tf1 0 0 1 78.024 477.79 Tm[<0078>] TJETBT/F6 11.04 Tf1 0 0 1 83.064 477.79 Tm[( )] TJETBT/F1 11.04 Tf1 0 0 1 96.024 477.79 Tm[(Ev)-5(o)5(l)-3(u)15(c)-5(i)-3()5(n)4( )-34(c)-5(o)5(n)4(ti)-4(n)4(u)4(a)5(:)4( )] TJETBT/F3 11.04 Tf1 0 0 1 189.41 477.79 Tm[(A )-42(d)3(ife)11(renci)] TJETBT1 0 0 1 238.13 477.79 Tm[(a )-44(d)3(el)11( )-45(so)-5(f)12(tw)-3(ar)13(e )-47(d)3(e)9( )-45(ap)4(li)14(caci)-4(n)3( )-34(co)-6(n)14(v)-4(enci)13(o)-5(n)3(al, )-42(q)3(u)3(e)9( )-45(e)9(v)-4(o)-5(lu)5(ci)12(o)-5(n)3(a )-44(a)12( )-45(lo)7( )-45(lar)4(g)4(o)5( )] TJETBT1 0 0 1 96.024 464.35 Tm[(d)3(e )-340(u)3(n)3(a )-337(seri( )-45(lte)-3( d)12(e )-3(la c)10(ali)4(d)3(ad)4( de )-2(u)3(n)3(a apl)4(icaci)13()-5(n)3( )] TJETBT1 0 0 1 298.85 491.83 Tm[(w)] TJETBT1 0 0 1 306.65 491.83 Tm 0.0221 Tc[(eb)] TJETBT1 0 0 1 317.95 491.83 Tm 0 Tc[(.)] TJETBT/F1 11.04 Tf1 0 0 1 320.71 491.83 Tm[( )] TJET EMC /P <</MCID 7/Lang (es-VE)>> BDC BT/F5 11.04 Tf1 0 0 1 78.024 477.79 Tm[<0078>] TJETBT/F6 11.04 Tf1 0 0 1 83.064 477.79 Tm[( )] TJETBT/F1 11.04 Tf1 0 0 1 96.024 477.79 Tm[(Ev)-5(o)5(l)-3(u)15(c)-5(i)-3()5(n)4( )-34(c)-5(o)5(n)4(ti)-4(n)4(u)4(a)5(:)4( )] TJETBT/F3 11.04 Tf1 0 0 1 189.41 477.79 Tm[(A )-42(d)3(ife)11(renci)] TJETBT1 0 0 1 238.13 477.79 Tm[(a )-44(d)3(el)11( )-45(so)-5(f)12(tw)-3(ar)13(e )-47(d)3(e)9( )-45(ap)4(li)14(caci)-4(n)3( )-34(co)-6(n)14(v)-4(enci)13(o)-5(n)3(al, )-42(q)3(u)3(e)9( )-45(e)9(v)-4(o)-5(lu)5(ci)12(o)-5(n)3(a )-44(a)12( )-45(lo)7( )-45(lar)4(g)4(o)5( )] TJETBT1 0 0 1 96.024 464.35 Tm[(d)3(e )-340(u)3(n)3(a )-337(seri( )-45(lte)-3( d)12(e )-3(la c)10(ali)4(d)3(ad)4( de )-2(u)3(n)3(a apl)4(icaci)13()-5(n)3( )] TJETBT1 0 0 1 298.85 491.83 Tm[(w)] TJETBT1 0 0 1 306.65 491.83 Tm 0.0221 Tc[(eb)] TJETBT1 0 0 1 317.95 491.83 Tm 0 Tc[(.)] TJETBT/F1 11.04 Tf1 0 0 1 320.71 491.83 Tm[( )] TJET EMC /P <</MCID 7/Lang (es-VE)>> BDC BT/F5 11.04 Tf1 0 0 1 78.024 477.79 Tm[<0078>] TJETBT/F6 11.04 Tf1 0 0 1 83.064 477.79 Tm[( )] TJETBT/F1 11.04 Tf1 0 0 1 96.024 477.79 Tm[(Ev)-5(o)5(l)-3(u)15(c)-5(i)-3()5(n)4( )-34(c)-5(o)5(n)4(ti)-4(n)4(u)4(a)5(:)4( )] TJETBT/F3 11.04 Tf1 0 0 1 189.41 477.79 Tm[(A )-42(d)3(ife)11(renci)] TJETBT1 0 0 1 238.13 477.79 Tm[(a )-44(d)3(el)11( )-45(so)-5(f)12(tw)-3(ar)13(e )-47(d)3(e)9( )-45(ap)4(li)14(caci)-4(n)3( )-34(co)-6(n)14(v)-4(enci)13(o)-5(n)3(al, )-42(q)3(u)3(e)9( )-45(e)9(v)-4(o)-5(lu)5(ci)12(o)-5(n)3(a )-44(a)12( )-45(lo)7( )-45(lar)4(g)4(o)5( )] TJETBT1 0 0 1 96.024 464.35 Tm[(d)3(e )-340(u)3(n)3(a )-337(seri( (u).ara)2)-340(u )] a )-382(4)-44(d)382.182.78 Tm[(eb )] TJETBT1 0 0 1 502.9 682.78 T3BT1382.1is)12(m)6(o)5( )] TJET4212(e382.1(eran)3( )-273(p)3(a)12(rte )-276(in)154.22e382.1(e( )] T(p)3(a)12(rte )-276(in)156.98 382.1T1 0 0 1 502.9 682.78 Tm9(n)382.1renc-34(c-4(ou)15(tTm[(a )-44(d)3(el)11( )[69)382.124 491.EThas)13( )cBT1 0 0 1d)3(ad pr1 30/F1 11)10(o))12(e T/F3 1024 477.79 Tm[<0078>] TJ(n)382.1Tf1 0 0 1 320.71 491.83 Tm3(a)5( )-240(i)-3(mp)13(r)-47)382.1noa seri( )-45(l5(c18 382.1T1 0 0 1 502.9 682.78 442(q8 382.1T1 0 0 1 50 1 83.064 477.79 )-44(d)361.5(e )-3(l ao)] TJ )-ef)10(o-VE<</M)] Tng (es-VE)>5(o)5(nb)] TJET47580003>56(o)5(n)4(ti)-4(n)4(5)5(nb)] TJET5plinsb

5

Antes de definir un marco de trabajo de proceso para la IWeb se debe reconocer que las aplicaciones
web con frecuencia se entregan de manera incremental, los cambios ocurren frecuentemente y los
plazos son cortos.
El ciclo de desarrollo de aplicaciones web propuesto por [14] consta de las siguientes etapas:
Comunicacin con el cliente: La comunicacin con el cliente es vital para el desarrollo de las
aplicaciones web. La formulacin es una actividad de recopilacin de requisitos que involucran a
todos los participantes.
Planeacin: Se crea el plan del proyecto para el incremento de la aplicacin web. El plan consiste de
una definicin de tareas y un calendario de plazos respecto al perodo establecido para el desarrollo
del proyecto.
Modelado: Las labores convencionales de anlisis diseo de la ingeniera del software se adaptan al
desarrollo de las aplicaciones web, se mezclan y luego se funden en una actividad de modelado de la
IWeb. El intento es desarrollar anlisis rpido y modelos de diseo que definan requisitos y al mismo
tiempo representen una aplicacin web que los satisfaga.
Construccin: Las herramientas y la tecnologa IWeb se aplican para construir la aplicacin web que
se ha modelado. Una vez que se construye el incremento se dirige a una serie de pruebas rpidas
para asegurar que se descubran los errores en el diseo.
Entrega y Retroalimentacin: Las aplicaciones web se configuran para su ambiente operativo, se
entrega a los usuarios finales y luego comienza un perodo de evaluacin. La retroalimentacin
acerca de la evaluacin para realizar los procesos respectivos.
Las etapas descritas anteriormente se representan en la Figura 1 que se encuentran a continuacin.

Figura 1: Ciclo de desarrollo IWeb [14]

Los mtodos de la IWeb abarcan un conjunto de labores tcnicas que permiten al Ingeniero web
comprender, caracterizar y luego construir una aplicacin Web de alta calidad.
En los ltimos aos se han ido produciendo metodologas para a ser incluidos en el modelo de desarrollo
de aplicaciones web, quedando stas principalmente centradas en las etapas de anlisis y diseo, as
como en la implementacin.
En la Figura 2, se presentan algunas de las metodologas desarrolladas en el tiempo para apoyar el
desarrollo de aplicaciones web, tomando en cuenta las diferentes etapas del proceso de desarrollo de
software.
6

De estos mtodos se describirn algunos, con el propsito de presentar una nocin de las caractersticas
de estos, tomando en cuenta la descripcin de ellos en las etapas de Anlisis, Diseo e Implementacin
del proceso de desarrollo de software.














Figura 2: Mtodos para la ingeniera Web [12]
1.2.1 UWE UML
UML-Based Web Engineering [5] es una herramienta para modelar aplicaciones web, utilizada en la
ingeniera web, prestando especial atencin en sistematizacin y personalizacin (sistemas adaptativos).
UWE es una propuesta basada en el proceso unificado y UML (Unified Modeling Language) pero
adaptado a la web. En requisitos separa las fases de captura, definicin y validacin. Hace adems una
clasificacin y un tratamiento especial dependiendo del carcter de cada requisito. Consiste en una
notacin que se basa en UML para aplicaciones web en general y adaptativas en particular. El mtodo
consta de seis modelos:
1. Modelo de casos de uso para capturar los requisitos del sistema
2. Modelo conceptual para el contenido (modelo del dominio)
3. Modelo de usuario: modelo de navegacin que incluye modelos estticos y dinmicos
4. Modelo de estructura de presentacin, modelo de flujo de presentacin
5. Modelo abstracto de interfaz de usuario y modelo de ciclo de vida del objeto
6. Modelo de adaptacin
1.2.3 WSDM
Web Site Design Modeling centra la generacin del diseo en el usuario ms que en los datos. Para esto
trata de definir las clases de usuarios que visitarn el sitio. Segn estas futuras visitas, y la forma en
que estos usuarios recorrern el sitio, se establecen los parmetros de diseo. El mtodo est
compuesto por cuatro fases: modelado de los usuarios, diseo conceptual, diseo de implementacin, e
implementacin. En la primera fase se define el tipo de informacin que buscarn los usuarios cuando
ingresen al sitio. En el diseo conceptual se modela la informacin requerida y se detallan las clases de
7

usuarios. Tambin se crea el diseo de navegacin. En el diseo de la implementacin se especifican los
requisitos y restricciones del diseo grfico del sitio, segn lo definido en el diseo conceptual.
Finalmente, en la implementacin se selecciona el ambiente de desarrollo y se implementa el sitio [9].
1.2.4 WebML
Web Modeling Language es el Lenguaje de Modelado Web que consiste en conceptos visuales simples
para expresar el hipertexto como un conjunto de pginas enlazadas que contienen unidades y
operaciones acerca de los datos que esta presenta, cada concepto tiene una representacin grfica y
diagramas para hacer las especificaciones [16].
WebML describe las aplicaciones web en tres niveles: El contenedor de Objetos, la organizacin de la
presentacin al usuario, y la visualizacin de la informacin (look and feel). El contenedor de objetos es
especificado a travs del modelo de datos Entidad-Relacin o alguno equivalente como los diagramas de
clases de UML. La presentacin a los usuarios utiliza el modelo del hipertexto, el cual tiene una
organizacin jerrquica
WebML provee primitivas para realizar los modelados del hipertexto, adoptando la idea del modelo de
Entidad-Relacin de usar conceptos para hacer especificaciones simples y expresivas, soportados por
una representacin grfica intuitiva. Por lo tanto este debe ser percibido por el desarrollador como una
extensin natural del modelo de Entidad-Relacin, lo que le permitir ampliar el esquema de los datos
de la aplicacin con la especificacin del hipertexto usado para publicar y manipular los datos.
Los conceptos claves del WebML son las pginas, unidades y enlaces organizados en mdulos llamados
reas y vistas.
Las unidades son piezas atmicas de contenido publicable. Estas son bloques de construccin de las
pginas, que sern presentados al usuario como elementos de la interfaz.
Las pginas son normalmente construidas por un conjunto de unidades de varios tipos.
Los enlaces representan la posibilidad de navegacin de un punto a otro en el hipertexto, y el pase
de parmetros de una unidad a otra.
Las vistas son agrupaciones de pginas que representan un conjunto coherente de requerimientos,
datos y necesidades especficas para un grupo de usuarios.
Las reas son agrupaciones de vistas dispuestas jerrquicamente, con un propsito comn.
1.2.5 WebSA
Web Software Architecture propone la inclusin de modelos de arquitectura de software para
complementar la especificacin de las aplicaciones web, y el uso del estndar MDA (Model-Driven
Architecture) para formalizar y describir los modelos [17].
WebSA se basa en la separacin de la descripcin de la arquitectura web en varias vistas simultneas.
Estas vistas estn basadas en el estndar MDA.
El modelo de vistas muestra los enlaces entre las diferentes vistas (consideradas como un conjunto de
artefactos creados durante el proceso de desarrollo del software) que conforman la arquitectura de
software de la aplicacin web.
En WebSA el modelo de la aplicacin web est formado por ocho (8) vistas agrupadas en puntos de
vistas.
8

El punto de vista de requerimientos tiene la informacin necesaria para especificar el sistema, consta
de:
1. Requerimientos funcionales y,
2. Requerimientos no funcionales.
El Punto de vista funcional define las funcionalidades de la aplicacin web, consta de las vistas de:
3. Conceptos, las cuales capturan la estructura de la informacin del sistema,
4. Procesos que tienen lo correspondiente a las actividades y flujos de los procesos,
5. Presentacin, refleja todo lo concerniente a la apariencia de la aplicacin y,
6. Navegacin, que especifica qu puede hacer el usuario y los pasos que debe seguir para hacerlo
en los diferentes escenarios de la aplicacin.
El punto de vista de la arquitectura a travs de las vistas de:
7. Arquitecturas Lgicas que agrupan los componentes lgicos del sistema (mdulos y
componentes de software) y sus relaciones y,
8. Arquitecturas Fsicas que agrupan los componentes fsicos que integran la representacin final
(clientes, servidores, redes, etc.).
2. Aplicaciones Web
En la ingeniera software se denomina aplicaciones web a aquellas que los usuarios usan accediendo a
un servidor web a travs de Internet o de una Intranet mediante un navegador web.
Las aplicaciones web son populares debido a lo prctico del navegador web como cliente ligero, as
como a la facilidad para actualizar y mantener sin distribuir e instalar software a miles de usuarios
potenciales. Existen aplicaciones web para comercio electrnico, enciclopedias, comunidades virtuales,
y un sinfn de servicios que se ofrecen en Internet.
Existen diversas clasificaciones de las aplicaciones web propuestas [7] por diversos autores, entre ellas
destaca la propuesta en la que se tipifican las aplicaciones web en base a dos dimensiones o criterios: la
complejidad y el momento de su aparicin tal como se puede apreciar en la Figura 3. Bajo esta
clasificacin se observa que existe una relacin proporcional entre la complejidad de un tipo de
aplicacin web y su ubicacin en el tiempo; es decir, en la medida que las tecnologas y el desarrollo de
aplicaciones web evolucionan, los requerimientos tambin. Entre los tipos de aplicaciones se destacan
las orientadas a documentos, las interactivas, las transaccionales, las basadas en un flujo de trabajo, las
orientadas a portales, las colaborativas, las orientadas hacia una red social, las ubicuas y las que
implementan tcnicas de la web semntica.

Figura 3: Clasificacin de Aplicaciones Web [14]
23


Figura 9: Ejemplo CoffeeScript (Lado izquierdo CoffeeScript; Lado derecho Javascript generado) [1]
3.2 Tecnologas del lado del Servidor
Una pgina Web, es un documento adaptado para la Web y normalmente forma parte de una aplicacin
Web. Su principal caracterstica son los hiperenlaces a otras pginas, siendo esto el fundamento de la
WWW. Una pgina Web est compuesta por informacin texto o multimedia e hiperenlaces; adems
puede contener o asociar datos de estilo para especificar cmo debe visualizarse, o aplicaciones
embebidas para hacerla interactiva.
El contenido de la pgina puede ser predeterminado "pgina web esttica" (ver Figura 10), en cuyo caso
se refiere a la solicitud de un recurso y ste es devuelto por el servidor HTTP. El recurso puede ser un
documento HTML, CSS, JS, imagen o cualquier otro que el usuario requiera y pueda obtener a travs del
cliente.

Figura 10: Pgina Esttica
24

Tambin el contenido puede ser generado al momento de solicitar a un servidor web lo cual se conoce
como "pgina web dinmica"(ver Figura 11), es indica que es dinmica si el contenido HTML, JS, CSS es
generado en tiempo de ejecucin, y por lo general es personalizado para ese usuario. Ejemplo de ello es
el cliente web de correo (Webmail), en el cual el usuario ve los correos que le pertenecen. Para que una
pgina pueda ser dinmica se necesita de algunas de las tecnologas del lado del servidor.

Figura 11: Pgina Dinmica
3.2.1 Taxonoma de Aplicaciones Web segn Enfoque Tecnolgico.
No es ni conveniente ni prctico para disear y desarrollar cada nueva aplicacin web comenzar desde
cero. Se tendra que seguir construyendo las mismos componentes funcionales que acepten e
interpreten los datos, autentiquen y autoricen a los usuarios, accedan y transformen los datos y
construyan y transmitan las respuestas finales. Muchos de estos componentes sern idnticos en
diferentes aplicaciones. Los servidores web ofrecen a los desarrolladores de aplicaciones
funcionalidades bien definidas para aceptar las peticiones y la transmisin de las respuestas. Algunos
servidores ofrecen las bases para la construccin y desarrollo de aplicaciones web. En la prctica estas
bases son muy bsicas para facilitar el desarrollo e implementacin de aplicaciones sofisticadas.
En esta seccin se clasifican y analizan varias estrategias para la construccin de aplicaciones web,
distinguiendo entre enfoques y frameworks [11]. Un enfoque (approach) se define como una librera de
componentes funcionales (funcionalidades) que toman las bondades de los servidores web que pueden
ser reutilizadas en mltiples y diferentes aplicaciones; stas normalmente estn ntimamente ligadas a
los lenguajes de programacin, con APIs complementarias y paquetes que proveen las funcionalidades
necesarias de las aplicaciones web.
Los frameworks van ms all de los enfoques en el desarrollo de aplicaciones web. Ellos proveen una
infraestructura consistente que incluye un conjunto de servicios, eliminando la necesidad de escribir
cdigo redundante para funciones comunes de las aplicaciones. Normalmente incluye soporte integrado
para acceder a Bases de Datos, autenticacin, manejo de estados y sesiones. Y ms importante an, los
frameworks promueven y facilitan la separacin del contenido de la presentacin, lo cual es un objetivo
de las buenas prcticas en el desarrollo de aplicaciones web. Se propone lograr este objetivo al hacer
responsable a los programadores por la lgica de negocio y el acceso al contenido, mientras el diseador
trabaja en la presentacin de la informacin y el formato de las pginas. El mejor framework es aquel
que permite al desarrollador y al diseador trabajar en mdulos separados, tal que el trabajo de ellos no
interfiriera con el trabajo del otro. Las soluciones de desarrollo de aplicaciones web se dividen en cuatro
grandes categoras:
25

Enfoques en programacin o scripting
Enfoques en plantillas
Enfoques hbridos
Frameworks
3.2.1.1 Enfoques en programacin o scripting
En este enfoque, el cdigo asociado a las pginas consiste principalmente de cdigo escrito en lenguajes
de script tales como Perl, Python, etc. o en lenguajes de propsito general como Java. El cdigo puede
ser intercalado con las definiciones del formato del contenido y de la presentacin. Naturalmente este
enfoque est dirigido hacia los programadores. La mayora del cdigo de la pgina implementa la lgica
de la aplicacin, mientras que el formato del contenido y de la presentacin es normalmente generado
por las instrucciones de salida de datos del lenguaje de programacin. Entre los enfoques que entran en
esta categora estn los CGI y los Servlets.
El mayor de los temas en el enfoque de programacin para el desarrollo de aplicaciones web est en su
naturaleza de cdigo centralizado. HTML y otros mtodos de presentacin de contenidos y datos estn
embebidos con la lgica del programa. Esto limita la creatividad que el diseador grfico pueda tener en
la construccin de la pgina. El diseador grfico puede generar una maqueta, pero el programador
debe traducir esta al lenguaje correspondiente e integrarlo con el cdigo de la lgica del programa. La
intervencin del programador es necesaria para hacer casi cualquier modificacin del aspecto de la
pgina, o de la lgica del programa. A continuacin se define brevemente algunas tecnologas que
ejemplifican este enfoque.
A. CGI
Common Gateway Interface (CGI) especfica segn la W3C [2] un estndar para transferir datos entre el
cliente y un programa que est en el servidor. Es un mecanismo de comunicacin entre el servidor web
y una aplicacin externa cuyo resultado final de la ejecucin son objetos MIME (Multipurpose Internet
Mail Extensions
1
). Las aplicaciones que se ejecutan en el servidor reciben el nombre de CGIs.
Las aplicaciones CGI fueron una de las primeras maneras prcticas de crear contenido dinmico para las
pginas web. En una aplicacin CGI, el servidor web pasa las solicitudes del cliente a un programa
externo. Este programa puede estar escrito en cualquier lenguaje que soporte el servidor, aunque por
razones de portabilidad se suelen usar lenguajes de script. La salida de estos programas es enviada al
cliente en lugar del archivo esttico tradicional.
CGI es un tipo de tecnologa donde se establece un mecanismo de llamada a travs del servidor web que
invoca a programas o scripts hechos en Perl, C++, entre otros. A continuacin se presenta un ejemplo
usando Perl:
#!/usr/local/bin/perl
print "Content-type: text/html\n\n";
print "<HTML>";
print "<HEAD>";
print "<TITLE> Hola Mundo en CGI </TITLE>";
print "</HEAD>";
print "<BODY>";
print "Hola Mundo";
print "</BODY>";
print "</HTML>";

1
Consiste en una serie de convenciones o especificaciones dirigidas a que se puedan intercambiar a travs de Internet todo
tipo de archivos (texto, audio, vdeo, etc.) de forma transparente para el usuario.
26

B. Servlets
Un servlet [10] es un objeto que se ejecuta en un servidor o contenedor JEE (Java Enterprise Edition),
especialmente diseado para ofrecer contenido dinmico desde un servidor web, generalmente HTML.
Un servlet implementa la interfaz javax.servlet.Servlet o hereda alguna de las clases ms
convenientes para un protocolo especfico (ej: javax.servlet.HttpServlet). Al implementar
esta interfaz el servlet es capaz de interpretar los objetos de tipo HttpServletRequest y
HttpServletResponse quienes contienen la informacin de la pgina que invoc al servlet. Entre
el servidor de aplicaciones y el servlet existe un estndar que determina cmo han de interactuar segn
su ciclo de vida. El ciclo de vida del Servlet se divide en los siguientes puntos:
1. El cliente solicita una peticin a un servidor va URL.
2. El servidor recibe la peticin.
1. Si es la primera, se utiliza el motor de Servlets para cargarlo y se llama al mtodo init().
2. Si ya est iniciado, cualquier peticin se convierte en un nuevo hilo. Un Servlet puede
manejar mltiples peticiones de clientes.
3. Se llama al mtodo service() para procesar la peticin devolviendo el resultado al cliente.
4. Cuando se detiene el motor de un Servlet se llama al mtodo destroy(), que lo destruye y libera
los recursos abiertos.
A continuacin un ejemplo de servlet que genera una pgina web dinmica Hola Mundo
import java.io.*;
import javax.servlet.http.*;
import javax.servlet.*;
public class HelloServlet extends HttpServlet {
public void doGet (HttpServletRequest req,
HttpServletResponse res)
throws ServletException, IOException
{
PrintWriter out = res.getWriter();
out.println("<HTML>");
out.println("<HEAD>");
out.println("<TITLE> Hola Mundo en Servlet </TITLE>");
out.println("</HEAD>");
out.println("<BODY>");
out.println("Hola Mundo");
out.println("</BODY>");
out.println("</HTML>");
out.close();
}
}
En estas tecnologas tanto CGI como Servlet se mezclan la lgica de control con la de presentacin, por
lo que su uso se ha reducido a la aplicacin en problemas muy puntuales y se combinan con otras
tecnologas.
Con los CGI el proceso de arranque de cada proceso domina el tiempo de ejecucin, en cambio con los
servlets el uso de hilos hace que el tiempo de ejecucin dependa directamente de la ejecucin del
proceso. Adicionalmente para los CGI N peticiones simultneas implican N cargas en memoria del CGI, lo
que no ocurre con los servlets.
27

Para los servlets es sencillo mantener datos entre peticiones simplificando el seguimiento de sesiones y
operaciones de cach, permitiendo adems compartir datos entre diferentes servlets, a diferencia de los
CGI que requieren de soluciones de programacin externas al propio CGI para realizar ests acciones.
3.2.1.2 Enfoques basados en plantillas
Este utiliza objetos de cdigo que consisten predominantemente en estructuras de presentacin de
contenido y datos, con un limitado conjunto de estructuras y cdigo que agregan la capacidad de
programacin. El objetivo de estos objetos de cdigo es la presentacin del contenido y de los datos y
no la lgica del programa. Este enfoque est dirigido a los diseadores grficos cuya experiencia est en
el rea de diagramacin de la pgina ms que en la programacin.
Este enfoque se centra en la estructura de la pgina, la presentacin del contenido y no en el cdigo.
Con esto en mente a este enfoque se le llama centrado en la pgina. Esto objetos de cdigos son las
plantillas, que consisten en HTML, acoplado con estructuras y cdigo que soportan el procesamiento
condicional y la presentacin iterativa de resultados.
Server-Site Include (SSI) es un mecanismo para agregar fcilmente plantillas a las pginas web. Entre las
plantillas mejor conocidas se encuentran el Cold Fusion y Velocity.
3.2.1.3 Enfoques hbridos
Este enfoque emplea objetos de cdigo que combinan las estructuras y cdigos de presentacin y de
lgica del programa. Se tiene mayor nfasis en la lgica de programacin que en las plantillas. Estas
tecnologas combinan en general cdigo del lado del cliente (HTML / JS / CSS) con trozos de cdigo
embebido que se ejecutan del lado del servidor. El objetivo es retornar un cdigo producto de la
combinacin y ejecucin de los trozos dinmicos con los estticos.
Existe un procesador o intrprete que analiza el cdigo combinado en el servidor, para ejecutar la
caracterstica dinmica de la pgina. La tecnologa establece delimitadores para indicar que se est
escribiendo cdigo a ejecutar del lado del servidor. A continuacin se describen brevemente algunas de
las tecnologas basadas en lenguaje de scripting embebido.
A. Hypertext Pre-Processor (PHP)
PHP [8] es un lenguaje interpretado de propsito general ampliamente usado, diseado especialmente
para desarrollo web y que puede ser incrustado dentro de cdigo HTML. Generalmente se ejecuta en un
servidor web, tomando el cdigo en PHP como su entrada y creando pginas web como salida. Adems
puede ser desplegado en la mayora de los servidores web y en casi todos los sistemas operativos y
plataformas.
B. Java Server Page (JSP)
JSP [10] utilizacin de cdigo Java mediante scripts. Adems, es posible utilizar algunas acciones JSP
predefinidas mediante etiquetas. stas pueden ser enriquecidas mediante la utilizacin de Bibliotecas
de Etiquetas externas e incluso personalizadas. El funcionamiento general de la tecnologa JSP es que el
Servidor de Aplicaciones interpreta el cdigo contenido en la pgina JSP para construir el cdigo Java del
servlet a generar. Este servlet ser el que genere el documento (tpicamente HTML) que se retorna al
navegador o cliente. En la Tabla 2 se puede observar un ejemplo de la codificacin de los lenguajes de
scripting embebidos.

28

PHP JSP
<HTML>
<HEAD>
<TITLE> Hola Mundo en PHP </TITLE>
</HEAD>
<BODY>
<?
print("Hola mundo");
?>
</BODY>
</HTML>
<HTML>
<HEAD>
<TITLE> Hola Mundo en JSP </TITLE>
</HEAD>
<BODY>
<%
out.println("Hola Mundo");
%>
</BODY>
</HTML>
Tabla 2: Lenguajes de Scripting Embebidos
Las ventajas que permiten este tipo de tecnologas es que de una forma simple y rpida se pueden crear
pginas dinmicas. Sin embargo estas tecnologas limitan el cdigo del lado del servidor pero no separan
estrictamente la lgica de negocio con la de presentacin, adems en aplicaciones con muchas
funcionalidades se dificulta su mantenimiento, como alternativa a esta problemtica se recomienda el
uso de frameworks web, los cuales se describen a continuacin.
3.2.1.4 Frameworks Web
Los frameworks web representan el prximo nivel de sofisticacin en el desarrollo de aplicaciones web.
En lugar de combinar la presentacin con la lgica de negocio en un solo mdulo, estos siguen el
principio de separar del contenido de la presentacin. Los mdulos responsables de la generacin del
contenido (el Modelo) son distintos de los mdulos que presentan el contenido en formato definido (las
Vistas).
Los frameworks permiten trabajar en una aplicacin web a partir de una estructura, ofreciendo un
conjunto de facilidades como libreras, funciones, clases, estructura de directorios y estndares
definidos alrededor de cmo implementar la funcionalidad en una aplicacin web.
En general los frameworks para desarrollo web estn basados en el patrn de diseo arquitectnico
MVC el cual fue descrito en la seccin 2.2. A continuacin se presenta la Figura 12 que ilustra el patrn
MVC en entornos web.

Figura 12: Framework Web MVC
29

Entre los frameworks ms conocidos se encuentra Ruby on Rails que se describe brevemente a
continuacin:
A. Ruby on Rails (RoR)
RoR es [15] un framework de aplicaciones web de cdigo abierto escrito en el lenguaje de programacin
Ruby, siguiendo el paradigma de la arquitectura Modelo-Vista-Controlador. Trata de combinar la
simplicidad con la posibilidad de desarrollar aplicaciones del mundo real escribiendo menos cdigo que
con otros frameworks y con un mnimo de configuracin. El lenguaje de programacin Ruby permite la
metaprogramacin, de la cual Rails hace uso, lo que resulta en una sintaxis que muchos de sus usuarios
encuentran muy legible. Rails se distribuye a travs de RubyGems, que es el formato oficial de paquete y
canal de distribucin de bibliotecas y aplicaciones Ruby.
La ventaja de trabajar en un framework es que las tareas comunes estn implementadas o se hacen con
menos esfuerzo y adems, propone un estndar de programacin lo que permite un mejor
mantenimiento y reusabilidad. Tambin poseen implementaciones de patrones, por ejemplo el patrn
Modelo-Vista-Controlador (MVC), y el patrn Active Record.
Los frameworks proveen una estructura bsica para los desarrollos, lineamientos que contribuyen en la
organizacin de los componentes del software. Algunos directorios que lo componen corresponden a
aplicacin, libreras, bitcoras, configuracin, complementos y pruebas los cuales varan segn el
producto.
3.2 Servicios Web
Un servicio web (Web Service) [4] es un conjunto de protocolos y estndares que sirven para
intercambiar datos entre aplicaciones. Distintas aplicaciones de software desarrolladas en lenguajes de
programacin diferentes, y ejecutadas sobre cualquier plataforma, pueden utilizar los servicios web
para intercambiar datos en redes de computadores como Internet. La interoperabilidad se consigue
mediante la adopcin de estndares abiertos. Las organizaciones OASIS y W3C son los comits
responsables de la arquitectura y reglamentacin de los servicios web. Para mejorar la interoperabilidad
entre distintas implementaciones de servicios web se ha creado el organismo WS-I (Web Services
Interoperability Organization), encargado de desarrollar diversos perfiles para definir de manera ms
exhaustiva estos estndares. Entre los ms utilizados se encuentran los que se describen a continuacin:
a) REST (Representational State Transfer): estilo de arquitectura de software para sistemas hipermedias
distribuidos tales como la World Wide Web. En resumen, es un conjunto de principios para el diseo de
redes, que es utilizado comnmente para definir una interfaz de transmisin sobre HTTP de manera
anloga a como lo hace SOAP. Aunque REST como tal no es un estndar, posee un conjunto de
estndares tales como HTML, URL, XML, GIF, JPG y tipos MIME. Los principios de REST son:
Escalabilidad de la interoperabilidad con los componentes.
Generalidad de Interfaces.
Puesta en funcionamiento independiente.
Compatibilidad con componentes intermedios.
b) RPC (Remote Procedure Calls): Es una tecnologa de software que permite ejecutar una rutina en un
equipo o segmento de red de manera remota. Es un paradigma popular para la implementacin de
sistemas distribuidos bajo arquitecturas cliente servidor.
30

c) XML-RPC: Es un protocolo de llamada remota que utiliza XML como lenguaje de codificacin y HTTP
como mecanismo de transporte. Es un protocolo sencillo ya que solo define algunos tipos de datos y
comandos. Existen implementaciones de XML-RPC especficas para ActionScript, Delphi, C++, .NET,
OClam, Common LISP, PHP y otros.
d) XML (eXtended Markup Language): XML es uno de los lenguajes ms utilizados para el intercambio de
datos sobre la web. Un documento XML es un objeto de datos que est bien formado, y se dice que lo
est cuando tomado en su conjunto coincide con la produccin del documento etiquetado, rene todas
las especificaciones de formato definidas y cada una de las entidades que se llaman directa o
indirectamente estn tambin bien definidas. El XML es un lenguaje etiquetado, caracterstica que le
permite definir objetos de datos estructurados en partes bien definidas llamadas elementos. Una
etiqueta es una seal realizada dentro del documento XML que delimita un segmento definido y con
sentido de este documento.
e) SOAP (Simple Object Access Protocol): es un protocolo de la capa de aplicacin para el intercambio de
mensajes basados en XML sobre redes de computadores. Bsicamente es una va de transmisin entre
un SOAP Sender y un SOAP Receiver, pero los mensajes SOAP deben interactuar con un conjunto de
aplicaciones para que se pueda generar un dilogo a travs de mensajes SOAP. Un mensaje SOAP es la
unidad fundamental de una comunicacin entre nodos SOAP. SOAP es bsicamente un paradigma de
una sola va pero con la ayuda de las aplicaciones se puede llegar a crear patrones ms complejos. SOAP
bsicamente est constituido por:
Un marco que describe el contenido del mensaje e instrucciones de proceso.
Un conjunto de reglas para representar los tipos de datos definidos.
Convenciones para representar llamadas a procedimientos remotos y respuestas.
Y algunos lineamientos entre SOAP y HTTP.
31

Referencias
[1] CoffeeScript. CoffeeScript. Octubre 2011. http://jashkenas.github.com/coffee-script/.
[2] Consortium W.W.W W3C. Mayo 2011. http://www.w3c.es/.
[3] D. Alur, J. Crupi, D. Malks. Core J2EE PAtterns. Best Practice and Design Strategies USA. Pretince
Hall PTR. Mayo 2003.
[4] D. Barry. Web Services and Service Oriented Architectures. Morgan Kaufmann Publishers.Abril 2003.
[5] E. Scalise Diseo de Aplicaciones Empresariales Multiformato utilizando Estndares y Tecnologa
Web. 2003.
[6] F. Miller, A.Vandome, J. McBrewster Markup Language: Annotation, Troff, LaTeX, XML, Presentation
Semantics, Hypertext, HTML, World Wide Web, Standard Generalized Markup Language, IBM
Generalized Markup Language, XHTML, Lightweight Markup Language. Alphascript Publishing. Junio
2010.
[7] G. Kappel. Web Engineering: The Discipline of Systematic Development of Web Applications. USA
John Wiley. Julio 2006.
[8] Group The PHP PHP.net . Octubre de 2011. http://www.php.net/.
[9] Guerrero L. A. Modelando Interfaces para Aplicaciones Web. Marzo 2007.
[10] JavaServer Technologies. Octubre de 2011 http://java.sun.com/developer/technicalArticles/.
[11] L. Shklar, R. Rosen Web Application Architecture: Principles, Protocols and Practices. Junio 2009.
[12] M. Escalona.Modelos y tcnicas para la especificacin y el anlisis de la navegacin en sistemas
software.Octubre 2004.
[13] M. Fowler, D. Rice, M. Foemmel, E. Hieatt, R. Mee, R. Stafford.Patterns of Enterprise Application
Architecture. Addison Wesley. Febrero 2002.
[14] R. Pressman. Ingeniera de Software Un enfoque Sistemtico. Mayo 2007.
[15] Ruby on Rails. Octubre de 2011. http:// www.rubyonrails.org.
[16] S. Ceri Applications Designing Data-Intensive Web. IET Software. Febrero 2007.
[17] S. Melia Using MDA in Web Software Architectures. Septiembre 2008.