C01. Web 2.0. La nueva Web
La nueva Web .............................................................................. 1
Qu? es la Web 2.0 .............................................................. 1
Historia ................................................................................ 2
Qu? no es la Web 2.0 .......................................... 3
Web 1.0 .............................................................................. 3
En ejemplos.................................................................... 5
Rich Internet Applications.......................................... 6
Qu? son.......................................................................................... 6
Caracter¡sticas ...................................................................... 8
Tipos de aplicaci¢n ................................................ 10
Ventajas.......................................................................................... 12
Desventajas .............................................................................. 13
Capacidad de uso .................................................. 13
El bot¢n "Atr s" del navegador ................ 13
Segunda Guerra de los browsers............ 13
Indexaci¢n de buscadores ............................ 14
Favoritos o marcadores .................................... 14
Manejo de errores.................................................... 15
Complejidad de desarrollo ............................ 16
Plataformas disponibles.............................................. 16
AJAX ...................................................................................... 16
Adobe Flash .................................................................. 17
Adobe Flex ...................................................................... 18
OpenLaszlo .................................................................... 20
Microsoft Silverlight .............................................. 20
Java FX................................................................................ 21
El sentido de la Web .......................................................... 22
La Web sem ntica ............................................................ 22
Microformats............................................................................ 23
Web mashups ........................................................................ 24
Web services y API .......................................................... 25
Red social.......................................................................................... 26
Etiquetado .................................................................................. 26
Modelos ........................................................................................ 27
Blogs y derivados .................................................... 27
Wikis ...................................................................................... 27
Comunidades .............................................................. 28
Redes sociales............................................................ 29
Interoperabilidad.................................................................. 29
LinkBack............................................................................ 29
Redes de favoritos.................................................. 29
Gadgets y Widgets ................................................ 30
Est ndares ...................................................................................... 30
El nuevo modelo de trabajo.................................... 30
XHTML ................................................................................ 30
CSS ........................................................................................ 31
HTML 5................................................................................ 32
JavaScript ........................................................................ 32
XML ........................................................................................ 32
Separaci¢n en capas ........................................................ 33
C02. Comenzando con AJAX
Herramientas................................................................................ 37
Entorno de trabajo ............................................................ 37
Adobe Dreamweaver ............................................ 37
Microsoft Expression Web ............................ 37
Aptana Studio .............................................................. 38
NetBeans .......................................................................... 41
Visual Studio.................................................................. 43
Navegadores y utilitarios............................................ 47
Internet Explorer ........................................................ 47
Firefox .................................................................................. 49
Opera .................................................................................... 51
Google Chrome.......................................................... 52
Safari...................................................................................... 52
Servidor Web .......................................................................... 53
Aptana Development Server ........................ 53
Internet Information Server ............................ 54
Apache ................................................................................ 54
HTTP Proxies................................................................ 55
El objeto XMLHttp ................................................................ 56
Origen .............................................................................................. 56
Modo de uso ............................................................................ 58
Instanciaci¢n............................................................................ 58
En Internet Explorer .............................................. 58
En otros navegadores.......................................... 59
Patr¢n Factory ............................................................ 59
M?todos m s utilizados .............................................. 61
open........................................................................................ 61
send........................................................................................ 62
abort ...................................................................................... 62
Propiedades.............................................................................. 63
readyState........................................................................ 63
status .................................................................................... 63
statusText ........................................................................ 65
responseText ................................................................ 65
responseXML................................................................ 65
onreadystatechange.............................................. 66
Otros m?todos........................................................................ 67
setRequestHeader .................................................. 67
getResponseHeader ............................................ 67
getAllResponseHeaders.................................... 67
M?todos y propiedades no est ndar .......... 68
Primer Proyecto AJAX .................................................... 70
Hola AJAX.................................................................................... 70
Par metros GET .................................................................. 73
Par metros POST .............................................................. 74
Reemplazando contenido ........................................ 76
C03. JavaScript avanzado
T?cnicas avanzadas .......................................................... 81
Try-Catch...................................................................................... 81
Generando errores.................................................. 82
For in.................................................................................................. 83
Manejo de funciones ...................................................... 84
Par metros opcionales ...................................... 84
Sobrecarga de par metros por tipo .... 85
Par metros como variables .......................... 85
Par metros m£ltiples............................................ 87
Programaci¢n orientada a objetos.................. 87
Objeto Object .............................................................. 87
Recorriendo el objeto .......................................... 88
Creando clases .......................................................... 89
Constructores .............................................................. 89
Prototipado .................................................................... 90
Herencia ............................................................................ 90
Buenas pr cticas ................................................................ 91
Nomenclatura .............................................................. 91
Documentaci¢n.......................................................... 92
JSON........................................................................................................ 94
Qu? es.............................................................................................. 94
Sintaxis .......................................................................................... 94
Ventajas.......................................................................................... 96
JSON con funciones........................................................ 97
Usos .................................................................................................. 97
Librer¡as para otros lenguajes.............................. 98
PHP ........................................................................................ 99
.NET........................................................................................ 99
Java ........................................................................................ 100
Document Object Model .............................................. 100
Qu? es.............................................................................................. 100
Estructura .................................................................................... 100
Objetos............................................................................................ 100
M?todos y propiedades .............................................. 102
Documento DOM...................................................... 102
Atributos de los nodos........................................ 102
M?todos de los nodos........................................ 103
Ejemplo .............................................................................. 104
Propiedades £tiles en XHTML.............................. 105
this............................................................................................ 106
disabled.............................................................................. 106
Estilos CSS .................................................................... 106
Ejemplos........................................................................................ 106
Efecto rollover .............................................................. 106
Creando una tabla din mica ........................ 107
Model View Controller .................................................... 111
Qu? es.............................................................................................. 111
Estructura .................................................................................... 111
T?cnicas ........................................................................................ 113
index.html (Vista) ...................................................... 113
index.js (Controlador) .......................................... 114
modelo.js (Modelo) ................................................ 114
ajax.js (Modelo) .......................................................... 114
C04. jQuery
jQuery, el m s usado ........................................................ 117
Destronando al rey............................................................ 117
Comenzando con jQuery............................................ 118
Utilizando una red de contenidos .......... 118
Microsoft AJAX CDN............................................ 119
Google AJAX Libraries API ............................ 119
Fundamentos de la librer¡a ............................ 120
Convirtiendo objetos a jQuery.................... 124
Restringiendo la b£squeda............................ 125
M?todos de jQuery............................................................ 125
Encadenamiento de funciones .................. 125
Funciones de HTML.............................................. 126
Funciones de CSS .................................................. 130
Funciones de formulario .................................. 132
Funciones de eventos ........................................ 133
Capturando DOM Ready.................................. 140
Funciones de Efectos .......................................... 140
Funciones de AJAX................................................ 144
Otras Funciones ........................................................ 149
jQuery Plugins ........................................................................ 152
jQuery UI ............................................................................................ 153
Instalaci¢n de jQuery UI .................................... 154
Definici¢n de Temas.............................................. 157
C05. Primeros proyectos AJAX
Creando un sitio est tico ............................................ 159
Aviso de cargando.................................................. 165
Aplicando efectos.................................................... 168
Lector RSS.................................................................................... 169
Actualizando peri¢dicamente...................... 175
Proxy PHP .................................................................................. 177
C06. Formulario de registro AJAX
Objetivo................................................................................................ 179
Arquitectura .............................................................................. 179
Tablas .............................................................................................. 180
Creando el formulario ...................................................... 182
HTML ................................................................................................ 182
Autocompletar............................................................................ 185
Qu? es.............................................................................................. 185
Cu ndo aplicarlo.................................................................. 186
Autocompletar local ........................................................ 187
Opcionales ...................................................................... 193
Autocompletar remoto.................................................. 194
BD.php ................................................................................ 196
Buscador de localidades.................................. 199
Categor¡as con niveles en cascada.............. 202
Completar pa¡ses................................................................ 203
Problemas con la codificaci¢n .................. 205
Completar provincias .................................................... 207
Controles ricos .......................................................................... 213
Slider.................................................................................................. 213
Script.aculo.us slider ............................................ 216
Atributos opcionales ............................................ 219
Implementando Nivel Educativo .............. 220
DatePicker .................................................................................. 224
Yahoo UI........................................................................................ 224
Calendar ............................................................................ 227
Funciones avanzadas .......................................... 231
NumericTextBox .................................................................. 232
NumericUpDown ...................................................... 232
SortableList................................................................................ 234
Consultando los cursos .................................... 234
RichTextBox.............................................................................. 238
Validaci¢n activa...................................................................... 240
Enviando el formulario .................................................... 241
Mostrando una alerta .......................................... 243
Migrando a jQuery ................................................................ 244
C07. Patrones de dise¿o para RIA
Qu? son................................................................................................ 245
Los patrones como ley ................................................ 246
Patrones GoF .......................................................................... 246
Su uso en AJAX .................................................................... 247
Patrones generales.............................................................. 248
Factory ............................................................................................ 249
Abstract Factory........................................................ 250
Observer........................................................................................ 251
Command.................................................................................... 253
Memento ...................................................................................... 255
Value Object.............................................................................. 256
Patrones exclusivos de RIA...................................... 257
Guesstimate.............................................................................. 257
On-Demand JavaScript................................................ 259
C¢digo din mico con JSON ........................ 259
C¢digo din mico con XHTML .................... 260
Cargador de scripts .............................................. 262
Cross Domain Proxy........................................................ 263
Heartbeat...................................................................................... 263
Unique URL................................................................................ 265
Generar URL bajo demanda ........................ 266
Generar URL en forma autom tica........ 266
Periodic Refresh .................................................................. 267
MultiStage Download .......................................... 271
Predictive Fetch ........................................................ 272
Prefetch cliente .......................................................... 274
Prefetch servidor ...................................................... 275
Local Cache .............................................................................. 276
Submission Throttling.................................................... 276
Implementaci¢n.......................................................... 277
Peticiones que se sobreescriben ............ 278
T?cnicas Comet ........................................................ 279
JSON con Relleno .................................................. 281
C08. AJAX avanzado
T?cnicas ............................................................................................ 283
Historial .......................................................................................... 283
Pasos por seguir ...................................................... 284
M?todos ............................................................................ 285
Ejemplo .............................................................................. 285
Almacenando en el cliente.............................. 288
Cambio de URL.......................................................... 288
Datos a futuro .............................................................. 288
Datos masivos ............................................................ 290
No esperemos las im genes.................................. 290
Reproducir sonido ............................................................ 292
Comprimiendo y ocultando el c¢digo ........ 292
Dojo ShrinkSafe ........................................................ 295
Javascript Chaos Engine.................................. 296
Compilar la l¢gica de negocios ................ 301
Comprimiendo el XHTML .......................................... 302
Pruebas unitarias ................................................................ 305
xUnit ...................................................................................... 306
Aplicaciones desconectadas ................................ 309
Adobe AIR .................................................................................. 310
Google Gears .......................................................................... 312
Ejemplo .......................................................................................... 314
AJAX para Buscadores .................................................. 315
La soluci¢n ................................................................................ 315
Arquitectura .............................................................................. 316
P gina Principal ........................................................ 317
Entregando fotograf¡as ................................................ 318
Generaci¢n manual ................................................ 318
Generaci¢n din mica............................................ 320
Materiales adicionales en la Web
> Comercio electr¢nico con Ajax
> Librer¡as y frameworks
> Prototype y Script.aculo.us
> Conexi¢n con APIs Web 2.0
Descargue estos cap¡tulos extra de la siguiente direcci¢n:
http:\www.alfaomega.com.mx/archivosadicionales
AJAX es una tÚcnica de programación Web fundamental para cualquier sitio moderno que ofrece mayor dinamismo y menores esperas para el usuario. Sitios Web como Google Mail, Facebook y Yahoo! Están desarrollados utilizando sus procedimientos. Esta obra aborda el uso de JavaScript de la poderosa librería jQuery y de las nuevas tÚcnicas de trabajo que incluyen el uso de XML, JSON y Patrones de Diseño.Con este libro, conocimientos básicos de HTML, CSS y una plataforma de servidor, el lector aprenderá todas las tÚcnicas básicas y avanzadas para crear sitios Web profesionales y modernos, con optimización para buscadores. El lector puede acceder a una certificación que avale los conocimientos adquiridos mediante un examen en línea.Sepa cómo usar:Los nuevos conceptos de Web 2.0, el objeto XML-HttpRequest,JSON y DOM, las librerías jQuey, Prototype y Script.acullo.es, controles ricos (como calendarios y deslizadores), optimización para Google de contenido AJAX.Cree: Sitios que actualizan parcialmente la información, un formulario rico y un lector de noticias RSS, aplicaciones para escritorio y para móviles.Nivel: Intermedio - Avanzado
AJAX es una técnica de programación Web fundamental para cualquier sitio moderno que ofrece mayor dinamismo y menores esperas para el usuario. Sitios Web como Google Mail, Facebook y Yahoo! Están desarrollados utilizando sus procedimientos. Esta obra aborda el uso de JavaScript de la poderosa librería jQuery y de las nuevas técnicas de trabajo que incluyen el uso de XML, JSON y Patrones de Diseño. Con este libro, conocimientos básicos de HTML, CSS y una plataforma de servidor, el lector aprenderá todas las técnicas básicas y avanzadas para crear sitios Web profesionales y modernos, con optimización para buscadores. El lector puede acceder a una certificación que avale los conocimientos adquiridos mediante un examen en línea. Sepa cómo usar: Los nuevos conceptos de Web 2.0, el objeto XML-HttpRequest,JSON y DOM, las librerías jQuey, Prototype y Script.acullo.es, controles ricos (como calendarios y deslizadores), optimización para Google de contenido AJAX. Cree: Sitios que actualizan parcialmente la información, un formulario rico y un lector de noticias RSS, aplicaciones para escritorio y para móviles. Nivel: Intermedio - Avanzado