Índice. C01. Web 2.0. La nueva web. C02. Comenzando con AJAX

Transcripción

1 preliminares.qxd:project Ajax4.1.qxd 10/24/07 7:14 PM Página IX C01. Web 2.0. La nueva web La nueva web... 1 Qué es la Web Historia... 2 Qué no es la Web Web En ejemplos... 5 Rich Internet Applications... 6 Qué son... 6 Características... 8 Tipos de aplicación Ventajas Desventajas Capacidad de uso El botón Atrás del navegador da Guerra de los browsers Indexación de buscadores Favoritos o marcadores Manejo de errores Complejidad de desarrollo Plataformas disponibles AJAX Adobe Flash Adobe Flex OpenLaszlo Microsoft Silverlight Java Webstart El sentido de la web La Web semántica Microformats Web mashups Web services y API Red social Etiquetado Modelos Blogs y derivados Wikis Comunidades Interoperabilidad LinkBack Redes de favoritos Gadgets y Widgets Estándares El nuevo modelo de trabajo XHTML CSS JavaScript XML Separación en capas C02. Comenzando con AJAX Herramientas Entorno de trabajo Adobe Dreamweaver Microsoft Expression Web JSEclipse Visual Web Developer Navegadores y utilitarios Internet Explorer Firefox Opera Servidor Web Cassini Internet Information Server Apache HTTP Proxies El objeto XMLHttp Origen Modo de uso Instanciación En Internet Explorer IX

2 preliminares.qxd:project Ajax4.1.qxd 10/24/07 7:14 PM Página X Maximiliano R. Firtman En otros navegadores Patrón Factory Métodos más utilizados open send abort Propiedades readystate status statustext responsetext responsexml onreadystatechange Otros métodos setrequestheader getresponseheader getallresponseheaders Métodos y propiedades no estándar Primer Proyecto AJAX Hola AJAX Parámetros GET... 79?clave=valor&clave2=valor LeerArchivo.ASPX Parámetros POST clave=valor&clave2=valor LeerArchivoPost.aspx leerarchivopost.html Reemplazando contenido XHR.js reemplazandodiv.html C03. JavaScript avanzado Técnicas avanzadas Try-Catch Generando errores For in Manejo de funciones Parámetros opcionales Sobrecarga de parámetros por tipo Parámetros como variables Parámetros múltiples Programación orientada a objetos Objeto Object Recorriendo el objeto Creando clases Constructores Prototipado Herencia Buenas prácticas Nomenclatura Documentación JSON Qué es Sintaxis Ventajas JSON con funciones Usos Librerías para otros lenguajes PHP NET Java Prototype Qué es Instalación Utilitarios $ $$ $F $w Try.these Otros Agregados a objetos Strings Arrays Elementos DOM Event Form formulario.html formulario.js Objeto AJAX Ajax.Request(url, opciones) Ajax.Updater(elemento, url, opciones) Ajax.PeriodicalUpdater(elemento, url, opciones) Otros agregados Model View Controller Qué es Estructura Técnicas index.html (Vista) index.js (Controlador) X

3 preliminares.qxd:project Ajax4.1.qxd 10/24/07 7:14 PM Página XI modelo.js (Modelo) ajax.js (Modelo) C04. Document Object Model Qué es Estructura Objetos Métodos y propiedades Documento DOM Atributos de los nodos Métodos de los nodos Ejemplo Propiedades útiles en XHTML this disabled Estilos CSS Ejemplos Efecto rollover Creando una tabla dinámica Script.aculo.us Qué es Instalación Efectos visuales Efectos de núcleo Efectos combinados Toggle Ejemplos mostrarventana.html mostrarventana.css mostrarventana.js Builder C05. Creando una librería de trabajo Objetivo Características $Ajax Opciones Opción url (Obligatorio) Opción método Opción tiporespuesta Opción parámetros Opción cache Opción avisocargando Opción id Eventos Parámetros El código Usando la librería Sitio estático versión AJAX index.html estilos.css quienes.html clientes.html servicios.html contacto.html Aviso de cargando Aplicando efectos Lector RSS lector.html estilos.css lector.js tecnología.xml Actualizando periódicamente Proxy PHP proxyrss.php C06. Formulario de registro AJAX Objetivo Arquitectura Tablas Usuarios Creando el formulario XHTML formulario.html formulario.css Autocompletar Qué es Cuándo aplicarlo Autocompletar local Opcionales Autocompletar remoto BD.php Buscador de localidades Categorías con niveles en cascada Completar países Problemas con la codificación Completar provincias Controles ricos XI

4 preliminares.qxd:project Ajax4.1.qxd 10/24/07 7:14 PM Página XII Maximiliano R. Firtman Slider Script.aculo.us slider Atributos opcionales Implementando Nivel Educativo DatePicker Yahoo UI Calendar Funciones avanzadas NumericTextBox NumericUpDown SortableList Consultando los cursos RichTextBox Validación activa existeusuario.php Enviando el formulario Mostrando una alerta C07. Patrones de diseño para RIA Qué son Los patrones como ley Patrones GoF Su uso en AJAX Patrones generales Factory Abstract Factory Observer Command Memento Value Object Patrones exclusivos de RIA Guesstimate On-Demand JavaScript Código dinámico con JSON Código dinámico con XHTML home.js (Controlador ya cargado) corrector.js (módulo cargado con ulterioridad) Cargador de scripts Cross Domain Proxy Heartbeat Unique URLs Generar URL bajo demanda Generar URL en forma automática Periodic Refresh MultiStage Download Predictive Fetch Prefetch cliente Prefetch servidor Local Cache Submission Throttling Implementación Peticiones que se sobreescriben C08. Comercio electrónico con AJAX Introducción Estructura Lenguaje de servidor Base de datos Clases de conexión Diseño Web Comportamiento inicial Index.js Resultados de búsqueda categoria.aspx buscar.aspx (fig. 8-6) Detalle de producto Producto.aspx Agregando al canasto Mostrando el canasto Quitando del canasto Modificando cantidades Arrastrar y soltar Introducción Draggables Droppables Uso avanzado Aplicación Arrastrando al canasto Arrastrando a la basura Finalizando la compra Guardado automático Código completo index.html estilos.css index.js XII

5 preliminares.qxd:project Ajax4.1.qxd 10/24/07 7:14 PM Página XIII C09. AJAX avanzado Técnicas Historial Pasos a seguir Métodos Ejemplo Almacenando en el cliente Cambio de URL Datos a futuro Datos masivos No esperemos las imágenes Reproducir sonido Comprimiendo y ocultando el código Dojo ShrinkSafe Javascript Chaos Engine Compilar la lógica de negocios Comprimiendo el XHTML Pruebas unitarias xunit Conexión con Google Google Code Servicios disponibles Frameworks y formatos Google KLM Google Data Google Web Toolkit Google Gears Google Open Source API Key Google Maps API Objetos de la API mapa.js Conexión con Microsoft Live Windows Live Dev Conexión con Yahoo! Yahoo! Developer Network Conexión con Amazon AWS Aplicaciones desconectadas Adobe AIR Google Gears Ejemplo AJAX en el móvil Aplicaciones para iphone C10. Librerías y frameworks Librerías de cliente Adobe Spry Spry Widgets XML DataSets Efectos Spry Microsoft AJAX Library jquery Dojo Toolkit Dijit Módulos Otras librerías Moo.fx moofx.mad4milk.net OAT Framework oat.openlinksw.com Aflax aflax.org Rico openrico.org Number Formatting Library - xaprb.com Mochikit mochikit.com Librerías para PHP SAJAX XAJAX PAJAX Librerías para ASP.NET Ajax.NET Professional Microsoft ASP.NET AJAX Extensions Controles Control Toolkit Otros lenguajes Java ColdFusion NET Python PHP Ruby XIII