Introducción al Desarrollo de Aplicaciones Web

1. Introducción al Desarrollo de Aplicaciones Web Miguel Ángel Niño Zambrano

2. Temas • Conceptos Básicos de la Web • Historia del Desarrollo de Aplicaciones Web • Historia de Internet y la Web. • Historia del diseño Web. • Historia de la programación Web. • El Internet • Protocolo TCP / IP. • Aplicaciones: DNS, FTP, SMTP, etc. • World Wide Web (HTTP, URLs, Unicode, HTML). • Servidores Web • Arquitectura Cliente / Servidor. • Páginas estáticas/dinámicas • Servidor de Aplicaciones • Servicios

3. Conceptos Básicos de la Web • Web*: El sistema de documentos interconectados por enlaces de hipertexto, que se ejecutan en Internet. • Internet*: Internet es un conjunto descentralizado de redes de comunicación interconectadas, que utilizan la familia de protocolos TCP/IP, garantizando que las redes físicas heterogéneas que la componen funcionen como una red lógica única, de alcance mundial. *http://es.wikipedia.org/wiki/Web

4. Historia de la Web Militar 1960: ARPANET 1972: 37 PC & Mail 1973: 1ª Conexión Internacional Leonard Kleinrock y el primer IMP. fuente:http://www.lk.cs.ucla.edu/personal_history.html 1983: TCP / IP Académica 1986: NSFNET 1989: 10.000 PC. & WWW 1990: 1er Servidor & Cliente Web . WWW 1994: W3C & CERN. Tim Berners-Lee. Fuente: http://www.zator.com/Internet/A5_1.htm

5. Historia de la Web Comercial 1996: 1ª Recomendación (PNG) 1.0 & CSS Nivel 1 1997: El HTML 4.0 1998: XML 1.0 Crisis .COM 2000: (SVG) 1.0 2001: El Esquema XML 2002: Servicios Web 2003: Patente Libre DA 2004: El RDF y el OWL Fuente: http://es.wikipedia.org/wiki/CERN Consejo Europeo para la Investigación Nuclear – CERN – W3C 2005: Modelo Único Caracteres C. Ubicua & Web Sem. 2005: Web Móvil

6. Historia Del Desarrollo de Diseño de Aplicaciones Web • David Siegel, Libro: “Creating Killer Web Sites: The Art of Third-Generacion Site Desing”, establece tres generaciones de Sitios Web. (1996). • Se puede añadir otras dos generaciones.

7. 1ª Generación de Sitios Web • Ancho de banda de Modem 2,4 Kbps. • Tiempo carga rápido (texto). • Navegación poco estructurada. • Texto escrito del ancho del monitor, saltos de línea, líneas horizontales, listas, etc. • Aparece al Final las páginas con Common Gateway Interface – CGI. 1992 - 1994

8. 2ª Generación de Sitios Web • Iconos que sustituyen las palabras y fondos. • Banners para encabezados y pies. • Listas con gráficos animados. • Tiempo de carga lento. • Uso de Tablas. • Navegación Jerárquica. • Aparecen multimedia que solicitan la instalación de un plug-in para su ejecución. • CGI acceso a datos. 1994 - 1995

9. 3ª Generación de Sitios Web • Tiempo de Carga rápido. • Uso de Cascading Style Sheets – CSS. • Se limitan a visualización en una sola página. • Diseño enfocado al usuario. • Pocos enlaces y desde una página principal. • Principios tipográficos y empleo de metáforas. • Principios de usabilidad y amigabilidad. • Identidad corporativa con uso adecuado de colores. • Consolidación de generación de páginas Web dinámicas. • CGI extendido, aparece IDC y luego ASP, ColdFusion,PHP, JSP. 1996 - 1998

10. 4ª Generación de Sitios Web • Empleo de recursos gráficos en exceso. • Páginas con mucha información al tiempo. • Aparece el DHTML haciendo las páginas más dinámicas. • Tecnologías multimedia como Macromedia Flash. • Principios de diseño de CDROM interactivos se aplican en la Web. • Empleo de equipo interdisciplinar (informático, experto en contenidos, diseñador gráfico, etc.) • Streaming de video y audio. • Gran parte de páginas acceden a BD. 1999 - 2005

11. 5ª Generación de Sitios Web • Páginas de Televisión, o TV IP. 2005 - 2008

12. Historia de la Programación Web SGML (Standard Generalized Markup Language) llamado HTML (HyperText Markup Language) Páginas Estáticas HTML 4.0.1 & XHTML 2.0 NAV Programación del Cliente DHTML : Scripts RUN Programación del Servidor CGI (Common Gateway Interface) DLL Páginas Dinámicas ISAPI (Information Server Application Program Interface) JSP, ColdFusion, PHP o JTHML, J2EE, JSF, ASP, ASPNET.

13. Internet

14. Protocolo TCP / IP • ¿Qué?: Se encarga de llevar a cabo la conmutación de paquetes • Transmission Control Protocol (TCP) • Internet Protocol (IP) • Protocolo: Es un conjunto de reglas para formatear, ordenar y comprimir mensajes, comprobar errores, etc. • Pueden implementarse en hardware o software

15. Capas del TCP / IP

16. Encaminamiento de Paquetes TCP / IP Direcciones IP: Estáticas & Dinámicas. Ej: 200.10.25.100 Versión Nueva: IPv6. DNS: Asocia un nombre a una IP Ej: http://atenea.unicauca.edu.co Se asocia a: 10.200.1.129

17. World Wide Web • Permite conectar y compartir información a cualquier PC conectado a Internet. • Arquitectura Cliente / Servidor.

18. Elementos Web • HTTP: (HyperText Transform Protocol) es el protocolo usado para transferir páginas Web. Protocolo sin estado. • Tipos de peticiones • GET, HEAD, POST, PUT, DELETE, … • Define códigos de respuestas • 200 – OK • 400 – Bad Request • 401 – Unauthorized • 403 – Forbidden • 404 – Not Found • Unicode: Consorcio de empresas que define restricciones sobre la implementación de ISO-10646 • ASCII: 7 bits Þ (0 – 127) (A)merican (S)tandard (C)ode for (I)nformation (I)nterchange. • ISO-8859-1 (iso-latin-1), ISO-8859-15 (iso-latin-9), ISO-10646 (31 bits), UTF-8, UTF-16, UTF-32. • URI: Uniform Resource Identifier • URL: Uniform Resource Locator • URN: Uniform Resource Name

19. Elementos Web • Protocolo: Un protocolo define el modo en que se comunican dos ordenadores para llevar a cabo alguna tarea Protocolo del Web. • FILE, FTP, HTTP, /, etc. • Puerto: Canales que se habilitan en la tarjeta de red para escuchar y enviar información. HTTP tiene defecto: 80.

20. Servidores Web • Un programa que atiende las peticiones HTTP llegadas a un puerto determinado de la máquina. También se denomina así, por extensión, a la máquina que cuenta con uno de tales programas. • Ejemplos de servidores Web: • Apache HTTP Server Project • Internet Information Server (IIS) • TomCat Server. • Tipos de páginas Web: • Estáticas (htm, html). • Dinámicas. (CGIs, ASP, JSP, Servlets, etc.) • En el siguiente capitulo se tratarán las plataformas de desarrollo de aplicaciones Web

21. Servidor de Aplicaciones ¿Qué es? • Es un programa que provee la infraestructura necesaria para las aplicaciones Web empresariales ¿Qué quiere decir esto? • Que los programadores van a poder dedicarse casi en exclusiva a implementar la lógica del dominio, ya que servicios de uso común, como transacciones, seguridad, persistencia, etc. ya son proporcionados por el servidor Web • Se ha convertido en una pieza de software clave para cualquier empresa dedicada al comercio electrónico • Es una capa intermedia (middleware) que se sitúa entre el servidor Web y las aplicaciones y bases de datos subyacentes

22. Esquema de Interacción con el Servidor de Aplicaciones • Clientes Pesados vs. Servidores. • Centralizan el acceso a los recursos del negocio. • Proveedores de Servicios.

23. Servicios Proporcionados por los Servidores de Aplicaciones • Gestión de la Sesión: El servidor debe mantener la información del usuario entre llamados http. • Gestión automática de la carga: El servidor se encarga de llamar a otros servidores si es necesario. • Gestión y Acceso a datos: Permite conexiones con diversas BD con la lógica de componentes. Permite acceso a otros tipos de datos como ERP, XML,etc. • Permiten la integración de sistemas heredados. • Manejo del Polling de Conexiones. • Gestión Transaccional: Indispensable para las aplicaciones comerciales. • Aprovechamiento de Plataformas Tecnológicas de punta: J2EE y .NET.

24. Bibliografía • http://html.rincondelvago.com/arpanet.html. • http://es.wikipedia.org/wiki/Historia_de_Internet. • http://www.w3c.es/consorcio/historia, consultado 25/08/2008. • Sergio Lujan Mora. Programación de Aplicaciones Web: historia, principios básicos y clientes Web. Octubre de 2002. • CiberAula. http://www.ciberaula.com/curso/aspnet/que_es/. • Carlos Alberto Cobos. Curso de Desarrollo de Cliente Inteligente. http://www.spar.unicauca.edu.co/ccobos/asignaturas/daci. • Curso de Java Script. http://www.webestilo.com/javascript/js07.phtml.