Professional Documents
Culture Documents
Ingeniería Web
© Copyright 2015 Edwin Valencia Castillo 1
• Ingeniería Web
– Identificación de Requerimientos
– Diseño
– Desarrollo
– Prueba
• Tecnologias Web
– HTML, JSF, AJAX, JAVA, Node.js, python, extent…
• Administracion de Proyectos
– Git, CVS/SVN, JUnit …
© Copyright 2015 Edwin Valencia Castillo 2
1
4/20/2016
© Copyright 2015 Edwin Valencia Castillo 3
Organización de la Asignatura
• Profesor :
– Edwin Valencia (evalencia@unc.edu.pe)
© Copyright 2015 Edwin Valencia Castillo 4
2
4/20/2016
Material de la Asignatura
• Libros
[1] Kappel, G., Proll, B. Reich, S. & Retschitzegger, W. (2006). Web Engineering, Wiley & Sons.
[2] Web Development and Design Foundations with XHTML: International Version 5th Edition, by
TerryFelke-Morris
[3] Programming the World Wide Web, Sixth Edition, by Robert W. Sebesta.
[4] Ed Burns, Chris Schalk, 2010, JavaServer Faces 2.0 – The Complete Guide, Editorial: Mc
Graw Hill, 2010.
[5] David Heffelfinger, A practical guide to install and configure the GlassFish 4 application server
and develop Java EE 7 applications to be deployed to this server, Packt Publishing, 2014,
http://it-ebooks.info/book/3356/
[6] Josh Juneau, JavaServer Faces: Introduction by Example, Packt Publishing, 2014, http://it-
ebooks.info/book/4526/
[7] Web Standards - Mastering HTML5, CSS3, and XML, Packt Publishing, 2014, http://it-
ebooks.info/book/4654/
[8] Vijay Joshi, Mastering jQuery UI Become an expert in creating real-world Rich Internet
Applications using the varied components of jQuery UI, Packt Publishing, 2015, http://it-
ebooks.info/book/4858/
[9] Sudheer Jonna, Learning PrimeFaces Extensions Development - Develop advanced frontend
applications using PrimeFaces Extensions components and plugins, Packt Publishing, 2014,
http://it-ebooks.info/book/3621/
[10] Oracle, Java Platform Enterprise Edition: The Java EE Tutorial, 2015,
https://docs.oracle.com/javaee/7/tutorial/
• Web site
– http://www.unc.edu.pe\~evalencia
© Copyright 2015 Edwin Valencia Castillo 5
Mini proyecto
• El proyecto sera anunciado la ultima semana de abril
– Plazo de entrega es en Julio
• Será un sistema basado en Web, el cual debe
ser construido de acuerdo con los métodos y
técnicas enseñadas en este curso
• Artefactos Entregables
– Software
– Documentos Asociados
• El proyecto es un esfuerzo personal
– La cooperacion excesiva resultara en 0 puntos para
todos.
– El contenido original es lo que cuenta.
© Copyright 2015 Edwin Valencia Castillo 6
3
4/20/2016
INTRODUCCION
© Copyright 2015 Edwin Valencia Castillo 7
Tendencias tecnológicas
Top 10 Strategic Technology Top 10 Strategic Technology Top 10 Strategic Technology
Areas for 2011 Areas for 2012 Areas for 2013
1. Cloud Computing 1. Cloud Computing 1. Mobile device battles
© Copyright 2015 Edwin Valencia Castillo 8
4
4/20/2016
Tendencias tecnológicas
Top 10 Strategic Technology Top 10 Strategic Technology Top 10 Strategic Technology
Areas for 2014 Areas for 2015 Areas for 2016
1. Mobile Device Diversity and 1. Computing Everywhere 1. The Device Mesh
Management
2. Mobile Apps and Applications 2. The Internet of Things 2. Ambient User Experience
© Copyright 2015 Edwin Valencia Castillo 9
Evolución de la web
© Copyright 2015 Edwin Valencia Castillo 10
5
4/20/2016
© Copyright 2015 Edwin Valencia Castillo 11
6
4/20/2016
• Tecnologia + interaccion.
– Sitios web sin componentes software?
– Web services?
© Copyright 2015 Edwin Valencia Castillo 13
© Copyright 2015 Edwin Valencia Castillo 14
7
4/20/2016
8
4/20/2016
© Copyright 2015 Edwin Valencia Castillo 17
Ubiquitous Semantic
Web
Social Web
Collaborative
Complexity
Workflow
Based Portal
Transactional
Oriented
Interactive
Doc-Centric
Development History
© Copyright 2015 Edwin Valencia Castillo 18
9
4/20/2016
© Copyright 2015 Edwin Valencia Castillo 19
© Copyright 2015 Edwin Valencia Castillo 20
10
4/20/2016
Aplicaciones basadas en
Workflow
• Diseñado para manejar procesos denegocio
entre departamentos, organizaciones y
empresas
• La logica del negocio define la estructura
• El rol de los servicios web
– Interoperabilidad
– Acoplamiento flexible
– Basado en estandares
• Ejemplos: B2B & e-Government
• Alta complejidad; entidades autonomas
© Copyright 2015 Edwin Valencia Castillo 21
11
4/20/2016
Orientado a Portales
• Portales Especializados
– Portales de negocios (e.g., intranet de empleados)
– Portales de Mercadeo (horizontal & vertical)
– Portales comunitarios (grupos especificos)
© Copyright 2015 Edwin Valencia Castillo 23
Ubicuo
12
4/20/2016
Web Semantica
© Copyright 2015 Edwin Valencia Castillo 25
Caracteristicas de las
Aplicaciones Web
• Como las aplicaciones web difieren de aplicaciones
tradicionales?
• O, de otra manera, que metodos y tecnicas de la
Ingeniería de Software puede ser adaptada a la
Ingeniería Web?
• 3 dimensiones del estandar ISO/IEC 9126-1
(Software engineering — Product quality)
– Producto
– Uso
– Desarrollo
• A esto hay que agregar una 4ta dimension peculiar a
la Web, la necesidad de una continua y rapida
evolucion!
© Copyright 2015 Edwin Valencia Castillo 26
13
4/20/2016
Caracteristicas de uso
14
4/20/2016
Caracteristicas de Desarrollo
• Equipo de desarrollo
– Multidisciplinario
– Comunidad (incluyendo Open Source)
• Infraestructura Tecnica
– Falta de control en el lado del cliente
– Inmadurez
• Proceso
– Flexibilidad
– Parallelismo
• Integracion
– Interna
– Externa
© Copyright 2015 Edwin Valencia Castillo 29
15
4/20/2016
Ingeniería de Sistemas de
Redes © 1997-2005 Dr. Martin Gaedke
Información
© Copyright 2015 Edwin Valencia Castillo 31
Standarización I
Propiedad
• Estandares De facto
Extensiones • Muchas veces apelando (cf
HTML PowerPoint, PDF)
PDF and Java? • Puede emerger como estandar
PNG
W3C
HTML
• Produce Z39.50
Recomendaciones W3C Java?
en protocolos web ISO
• Enfoque gestionado para • Produce ISO Standards
desarrollos • Puede ser de movimiento
• Protocolos iniciales lento y burocratico
desarrollados por • Produce estandares
miembros del W3C robustos
• Decisiones hechas por el IETF
W3C, son influenciados • Produce Borradores de Internet en protocolos
por revisiones publicas y de internet
de miembros • Enfoque descente para desarrollo
• Protocolos desarrollados por personas
PNG interesadas HTTP
HTML • “Consenso y codigo de trabajo" URN
HTTP
© Copyright 2015 Edwin Valencia Castillo 32
16
4/20/2016
Standarización II
• Los estandares son importantes, especialmente por
iniciativas nacionales y otros servicios a gran escala
– Mas facil de integrar diferentes proyectos si se adoptan
estandares
• Soluciones propietarias muchas veces son
tentadoras porque:
– Estan disponibles
– A menudo esta bien comercializado y con sufienciente
soporte
– Puede llegar a ser estandarizada
• Las soluciones basadas en estandares no pueden
ser debidamente soportados por las aplicaciones
Porque son necesarios los estandares
http://www.w3.org/community/webed/wiki/Es/Introducci%C3%B3n_al_curr%C3%ADculo_de_est%C3%A1ndares_web
© Copyright 2015 Edwin Valencia Castillo 33
QUE ES INTERNET????
© Copyright 2015 Edwin Valencia Castillo 34
17
4/20/2016
Protocolos de internet
• Protocolos
– Reglas que describen los métodos utilizados para
que clientes y servidores se comunican entre sí a
través de una red.
• No existe un protocolo único que hace que
Internet y la Web trabajen.
• Se necesita una serie de protocolos con
funciones específicas.
– Por ejemplo Protocolo de transferencia de
archivos (FTP)
© Copyright 2015 Edwin Valencia Castillo 35
TCP/IP
Tra nsm ission Control P rotocol/Internet P rotocol
© Copyright 2015 Edwin Valencia Castillo 36
18
4/20/2016
© Copyright 2015 Edwin Valencia Castillo 37
Nombres de dominio
© Copyright 2015 Edwin Valencia Castillo 38
19
4/20/2016
© Copyright 2015 Edwin Valencia Castillo 39
© Copyright 2015 Edwin Valencia Castillo 40
20
4/20/2016
© Copyright 2015 Edwin Valencia Castillo 41
21
4/20/2016
El Modelo Cliente/Servidor
© Copyright 2015 Edwin Valencia Castillo 43
Cliente web
© Copyright 2015 Edwin Valencia Castillo 44
22
4/20/2016
Servidor web
© Copyright 2015 Edwin Valencia Castillo 45
23
4/20/2016
© Copyright 2015 Edwin Valencia Castillo 47
URLs avanzadas
• ancla: salta a una determinada sección de una
página web
– http://www.textpad.com/download/index.html#downloads
• obtiene index.html luego salta a una parte de la
página etiquetada como downloads
• puerto: para servidores web en puertos que no sean
el predeterminado 80
– http://www.cs.washington.edu:8080/secret/money.txt
• cadena de consulta: un conjunto de parámetros que
se pasan a un programa web
– http://www.google.com/search?q=web+design&start=10
• parámetro q se establece en "web + design"
• parámetro start se establece en 10
© Copyright 2015 Edwin Valencia Castillo 48
24
4/20/2016
Tipos MIME
© Copyright 2015 Edwin Valencia Castillo 49
Tipos MIME
• Especificaciones tipo
– Form: type/subtype
• Tipos experimentales
• Subtipo empieza con x- e.g., video/x-msvideo
• Los tipos experimentales requieren que el servidor
envie una aplicación auxiliar o plug-in del navegador
© Copyright 2015 Edwin Valencia Castillo 50
25
4/20/2016
HTTP Response
Request
• Form
HTTP method domain part of URL HTTP version
Header fields
blank line
Message body
© Copyright 2015 Edwin Valencia Castillo 52
26
4/20/2016
Response
© Copyright 2015 Edwin Valencia Castillo 53
…….
© Copyright 2015 Edwin Valencia Castillo 54
27
4/20/2016
Bibliografía
• Lectura obligatoria
– Kappel, G., Proll, B. Reich, S. & Retschitzegger, W.
(2006). Web Engineering, Wiley & Sons. 1st
Chapter
© Copyright 2015 Edwin Valencia Castillo 56
28
4/20/2016
Preguntas?
© Copyright 2015 Edwin Valencia Castillo 57
29