Introducción a las aplicaciones web

1. SS400
INTRODUCCIÓN A LAS
APLICACIONES WEB
WILMAN JOSÉ VEGA
UNIVERSIDAD POPULAR DEL CESAR
AGOSTO 2012
https://sites.google.com/site/wvcclasses/home/cursos/programacion-bajo-web

2. INTRODUCCIÓN A LAS APLICACIONES WEB
APLICACIÓN WEB
• Mucho más que un Sitio Web
• Aplicación Cliente / Servidor
• Usa un Navegador Web
• Ejecuta un servicio interactivo conectando con
servidores a través de Internet (o Intranet)
WILMAN JOSE VEGA CASTILLA. AGOSTO 2012

3. INTRODUCCIÓN A LAS APLICACIONES WEB
PROTOCOLOS DE INTERNET
WILMAN JOSE VEGA CASTILLA. AGOSTO 2012

4. INTRODUCCIÓN A LAS APLICACIONES WEB
PROTOCOLOS DE INTERNET (TCP/IP)
WILMAN JOSE VEGA CASTILLA. AGOSTO 2012

5. INTRODUCCIÓN A LAS APLICACIONES WEB
ARPANET TCP/IP
TCP: Transmission Control Protocol
IP: Internet Protocol
Network Interface Lowest level of data transmission facilitating
communication with the underlying physical network
Internet layer Provides the mechanisms for intersystem communications,
controlling message routing, validity checking, and
message header composition/decomposition
LAYERS
Transport layer Provides message transport services between applications
running on remote systems
Application layer highest level within the TCP/IP protocol stack. It is within
this layer that most of the services we associate with ‘the
Internet’ operate
WILMAN JOSE VEGA CASTILLA. AGOSTO 2012

6. INTRODUCCIÓN A LAS APLICACIONES WEB
ESTRUCTURA DE LAS APLICACIONES WEB
HTTP
Datos
HTML/XML, CSS, JavaScript, PHP, JSP, Servlet, JavaBeans,
Applet CGI
LADO DEL CLIENTE LADO DEL SERVIDOR
WILMAN JOSE VEGA CASTILLA. AGOSTO 2012

7. INTRODUCCIÓN A LAS APLICACIONES WEB
TCP/IP: EL PARADIGMA CLIENTE / SERVIDOR
Clientes (Web Browser)
Servidor Web O
Servidor HTTP
WILMAN JOSE VEGA CASTILLA. AGOSTO 2012

8. INTRODUCCIÓN A LAS APLICACIONES WEB
ORIGENES DE LA WEB
AÑO
1980 Tim Berners-Lee. Propuesta de nuevo sistema de hipertexto para
compartir documentos
1991 El primer documento formal con la descripción de HTML
1995 El IETF presenta el Estándar HTML 2.0
1996 La W3C publica HTML 3.2. Texto con imágenes y applets
1998 Se publica el HTML 4.0
1999 Se publica la última especificación oficial de HTML 4.01
2000 XHTML 1.0
… HTML 5
WILMAN JOSE VEGA CASTILLA. AGOSTO 2012

9. INTRODUCCIÓN A LAS APLICACIONES WEB
BASES DE LA WEB
• Lenguaje de Marcado para formatear documentos Hipertexto
(HTML)
• Un esquema de notación uniforme para direccionar los
recursos accesibles en la red (URI)
• Un protocolo para transportar mensajes en la red (HTTP)
WILMAN JOSE VEGA CASTILLA. AGOSTO 2012

10. INTRODUCCIÓN A LAS APLICACIONES WEB
Uniform Resource Identifier
scheme://host[:port#]/path/.../[;url-params][?query-string][#anchor]
Scheme — this portion of the URL designates the underlying protocol to be used (e.g.
‘http’ or ‘ftp’).
host — this is either the name of the IP address for the web server being accessed.
Port — this is an optional portion of the URL designating the port number that the
target web server listens to.
Path — logically speaking, this is the file system path from the ‘root’ directory of the
server to the desired document.
url-params — this once rarely used portion of the URL includes optional ‘URL
parameters’.
query-string — this optional portion of the URL contains other dynamic parameters
associated with the request.
Anchor — this optional portion of the URL is a reference to a positional marker within
the requested document, like a bookmark
WILMAN JOSE VEGA CASTILLA. AGOSTO 2012

11. INTRODUCCIÓN A LAS APLICACIONES WEB

12. INTRODUCCIÓN A LAS APLICACIONES WEB
FUNDAMENTOS DE HTTP
• Protocolo base de la WWW
• Protocolo de nivel de aplicación
• Usa el paradigma Petición / Respuesta (Request /Response)
• HTTP es un protocolo estático.
WILMAN JOSE VEGA CASTILLA. AGOSTO 2012

13. INTRODUCCIÓN A LAS APLICACIONES WEB
HTTP servers, browsers, and proxies
• Web servers and browsers exchange information using HTTP,
which is why Web servers are often called HTTP servers
• Web browsers are sometimes referred to as HTTP clients, but
their functionality is not limited to HTTP support
• HTTP proxies are programs that act as both servers and clients,
making requests to web servers on behalf of other clients.
Proxies enable HTTP transfers across firewalls.
WILMAN JOSE VEGA CASTILLA. AGOSTO 2012

14. INTRODUCCIÓN A LAS APLICACIONES WEB
Paradigma Request / Response

15. INTRODUCCIÓN A LAS APLICACIONES WEB
ESTRUCTURA DE LOS MENSAJES HTTP
REQUEST MESSAGE RESPONSE MESSAGE

16. INTRODUCCIÓN A LAS APLICACIONES WEB
HTML (HIPERTEXT MARKUP LANGUAGE)
• LENGUAJE PARA LAS PAGINAS WEB
• ESTÁNDAR (W3C)
WILMAN JOSE VEGA CASTILLA. AGOSTO 2012

17. INTRODUCCIÓN A LAS APLICACIONES WEB
XHTML Y HTML
• HTML Bien formado
• Respetar las reglas de
Marcado
WILMAN JOSE VEGA CASTILLA. AGOSTO 2012

18. INTRODUCCIÓN A LAS APLICACIONES WEB
ETIQUETAS
Marcar (Markup): indicar partes que componen el documento
(contenido e información sobre ese contenido)
WILMAN JOSE VEGA CASTILLA. AGOSTO 2012

19. INTRODUCCIÓN A LAS APLICACIONES WEB
ESTRUCTURA DE UN DOCUMENTO HTML
TALLER 1. PROBEMOS ESTE EJEMPLO!
WILMAN JOSE VEGA CASTILLA. AGOSTO 2012

20. INTRODUCCIÓN A LAS APLICACIONES WEB
HTML NO TIENE UN IDE ESPECIFICO!
Para programar en HTML sólo necesitamos un editor de
textos (P.E.: Notepad++) y un navegador
WILMAN JOSE VEGA CASTILLA. AGOSTO 2012

21. INTRODUCCIÓN A LAS APLICACIONES WEB
EJERCICIOS
• Hacer una lista con las etiquetas HTML existentes
• Modifiquemos el ejemplo anterior para utilizar por lo menos 5
de estas etiquetas.
WILMAN JOSE VEGA CASTILLA. AGOSTO 2012