Tecnologías de la web 2.0
-
Upload
juan-antonio-perez-ortiz -
Category
Technology
-
view
649 -
download
0
description
Transcript of Tecnologías de la web 2.0
![Page 1: Tecnologías de la web 2.0](https://reader033.fdocuments.es/reader033/viewer/2022052909/559806a91a28ab72398b46a0/html5/thumbnails/1.jpg)
La web 2.0: retos y tecnologías para la internet de nueva generación, Universitat d'Alacant, julio 2008© 2008, Juan Antonio Pérez Ortiz
Manual de uso de la web 2.0Manual de uso de la web 2.0
TecnologíasTecnologías
![Page 2: Tecnologías de la web 2.0](https://reader033.fdocuments.es/reader033/viewer/2022052909/559806a91a28ab72398b46a0/html5/thumbnails/2.jpg)
Tipos de tecnologíasTipos de tecnologías
● Para el cliente y para el servidor:● Metodologías de desarrollo● Lenguajes de programación y frameworks● Gestión de datos● Algoritmos● Servidores/hosting● Programas existentes (Bitnami)
![Page 3: Tecnologías de la web 2.0](https://reader033.fdocuments.es/reader033/viewer/2022052909/559806a91a28ab72398b46a0/html5/thumbnails/3.jpg)
Metodologías de desarrolloMetodologías de desarrollo● Ciclo de desarrollo tradicional● Desarrollo ágil de webs:
● Basado en el desarrollo ágil de software● Múltiples iteraciones de pocas semanas, cada
una de las cuales es un proyecto en sí● Modelo de lavadora frente al modelo clásico
de cascada● Comunicación cara a cara● Poca documentación: el objetivo es conseguir
software que funcione
![Page 4: Tecnologías de la web 2.0](https://reader033.fdocuments.es/reader033/viewer/2022052909/559806a91a28ab72398b46a0/html5/thumbnails/4.jpg)
Lenguajes de programación Lenguajes de programación para el servidorpara el servidor
● Los habituales: PHP, Java, C#, etc.● Lenguajes dinámicos: Python, Ruby, etc.
![Page 5: Tecnologías de la web 2.0](https://reader033.fdocuments.es/reader033/viewer/2022052909/559806a91a28ab72398b46a0/html5/thumbnails/5.jpg)
Plataformas para el servidorPlataformas para el servidor● Las habituales: J2EE, .Net, etc.● Ruby on Rails (RoR):
● An open-source web framework that's optimized for programmer happiness and sustainable productivity. It lets you write beautiful code by favoring convention over configuration.
● Django:● Django is a high-level Python Web framework
that encourages rapid development and clean, pragmatic design.
![Page 6: Tecnologías de la web 2.0](https://reader033.fdocuments.es/reader033/viewer/2022052909/559806a91a28ab72398b46a0/html5/thumbnails/6.jpg)
Ruby on RailsRuby on Rails● Framework para el desarrollo de aplicaciones
web que usan bases de datos● Está escrito en Rails y sigue el paradigma
Model-View-Controller (MVC)● Genera automáticamente esqueletos de código● Máximas:
● Convention over configuration: solo has de escribir el código que se salga de lo habitual
● Don't repeat yourself: la información está en un único sitio
![Page 7: Tecnologías de la web 2.0](https://reader033.fdocuments.es/reader033/viewer/2022052909/559806a91a28ab72398b46a0/html5/thumbnails/7.jpg)
Tecnologías para el cliente o Tecnologías para el cliente o para el cliente/servidorpara el cliente/servidor
● Ajax● Google Web Toolkit● Silverlight● Flex● Java FX● ...
![Page 8: Tecnologías de la web 2.0](https://reader033.fdocuments.es/reader033/viewer/2022052909/559806a91a28ab72398b46a0/html5/thumbnails/8.jpg)
Ajax (1)Ajax (1)
● Ajax: Asynchronous JavaScript and XML● Técnica de desarrollo web para mejorar la
interactividad y funcionalidad de las aplicaciones web
● El cliente intercambia datos con el servidor de forma asíncrona, sin tener que recargar la página completa ante cada acción del usuario
![Page 9: Tecnologías de la web 2.0](https://reader033.fdocuments.es/reader033/viewer/2022052909/559806a91a28ab72398b46a0/html5/thumbnails/9.jpg)
Ajax (2)Ajax (2)
● Javascript es el lenguaje usado en el cliente● La comunicación con el servidor se realiza con
el objeto XMLHttpRequest● Los datos intercambiados, sin embargo, no
necesitan estar en XML; puede usarse texto, HTML, JSON, etc.
● La mayor parte de las tecnologías relacionadas son abiertas
![Page 10: Tecnologías de la web 2.0](https://reader033.fdocuments.es/reader033/viewer/2022052909/559806a91a28ab72398b46a0/html5/thumbnails/10.jpg)
Ajax (3)Ajax (3)
● Ajax no es una tecnología en sí, sino un conjunto de tecnologías con efectos sinérgicos
● Término acuñado por Jesse James Garrett en febrero de 2005 en � Ajax: a new approach to web applications�
● Las tecnologías implicadas ya existían desde años antes
![Page 11: Tecnologías de la web 2.0](https://reader033.fdocuments.es/reader033/viewer/2022052909/559806a91a28ab72398b46a0/html5/thumbnails/11.jpg)
Justificación de AjaxJustificación de Ajax
● Las aplicaciones web tradicionales formatean los datos en el servidor dentro de una nueva página HTML
● Esto impide muchos comportamientos habituales en las aplicaciones de escritorio; ejemplo: un control desplegable
● Ajax es una de las formas de implementar aplicaciones RIA (Rich Internet Applications)
![Page 12: Tecnologías de la web 2.0](https://reader033.fdocuments.es/reader033/viewer/2022052909/559806a91a28ab72398b46a0/html5/thumbnails/12.jpg)
Usos de AjaxUsos de Ajax
● Validación de formularios en tiempo real● Autocompleción● Carga incremental de una página● Controles más avanzados (calendarios,
árboles, menús, editores de texto, etc.)● Recarga parcial● Mashups● El navegador como plataforma
![Page 13: Tecnologías de la web 2.0](https://reader033.fdocuments.es/reader033/viewer/2022052909/559806a91a28ab72398b46a0/html5/thumbnails/13.jpg)
Ventajas de AjaxVentajas de Ajax
● Aprovechamiento del ancho de banda● Reducción de la carga del servidor● Aplicaciones más intuitivas e interactivas
![Page 14: Tecnologías de la web 2.0](https://reader033.fdocuments.es/reader033/viewer/2022052909/559806a91a28ab72398b46a0/html5/thumbnails/14.jpg)
Desventajas de AjaxDesventajas de Ajax
● Pérdida del historial de navegación; solución: iframes, cambio en el URI del navegador...
● La latencia de la conexión puede provocar desconcierto en el usuario; solución: throbbers, atenuación, � loading� ...
● Compatibilidad de Javascript; solución: Prototype, Scriptaculous, Dojo, Ext, GWT...
● �Same-origin policy�
![Page 15: Tecnologías de la web 2.0](https://reader033.fdocuments.es/reader033/viewer/2022052909/559806a91a28ab72398b46a0/html5/thumbnails/15.jpg)
Librerías de Ajax (1)Librerías de Ajax (1)● Existen más de 40 librerías de JavaScript
para Ajax; ¡no excluyentes!● Algunas de las más usadas:
● Prototype: mejora de JavaScript para darle un aspecto a lo Ruby
● Scriptaculous: efectos y elementos gráficos sobre Prototype
● demos● sigue...
![Page 16: Tecnologías de la web 2.0](https://reader033.fdocuments.es/reader033/viewer/2022052909/559806a91a28ab72398b46a0/html5/thumbnails/16.jpg)
Librerías de Ajax (2)Librerías de Ajax (2)● Más librerías:
● Dojo: aporta una funcionalidad mucho mayor que el resto (encriptación, carga dinámica, uso sin conexión), a costa de una complejidad de aprendizaje también mayor
● demos● Ext JS: centrada en conseguir una interfaz
muy elegante y visualmente atractiva● demos
![Page 17: Tecnologías de la web 2.0](https://reader033.fdocuments.es/reader033/viewer/2022052909/559806a91a28ab72398b46a0/html5/thumbnails/17.jpg)
Google Web Toolkit (1)Google Web Toolkit (1)
● Google Web Toolkit (GWT) aparece en 2006 ● Permite desarrollar aplicaciones Ajax sin conocer
JavaScript, HTML o XML● El desarrollo se hace en Java, y GWT lo traduce
automáticamente a HTML y JavaScript● JavaScript es como el ensamblador de los
compiladores tradicionales
![Page 18: Tecnologías de la web 2.0](https://reader033.fdocuments.es/reader033/viewer/2022052909/559806a91a28ab72398b46a0/html5/thumbnails/18.jpg)
Google Web Toolkit (2)Google Web Toolkit (2)
● Se evitan algunos de los problemas de Ajax:● la incompatibilidad entre navegadores● depuración de código● historial de navegación
![Page 19: Tecnologías de la web 2.0](https://reader033.fdocuments.es/reader033/viewer/2022052909/559806a91a28ab72398b46a0/html5/thumbnails/19.jpg)
Google Web Toolkit (3)Google Web Toolkit (3)● Durante el desarrollo se puede usar cualquier
IDE de Java (por ejemplo, Eclipse), incluso para depurar
● Proporciona una librería de controles gráficos similar a AWT, Swing o SWT
● Plataforma de código abierto:● Apache Open Source License 2.0
![Page 20: Tecnologías de la web 2.0](https://reader033.fdocuments.es/reader033/viewer/2022052909/559806a91a28ab72398b46a0/html5/thumbnails/20.jpg)
Google Web Toolkit (4)Google Web Toolkit (4)
● Crea una aplicación diferente para cada navegador e idioma (soporte para i18n)
● Puede insertarse código JavaScript directamente gracias a JSNI (JavaScript Native Interface)
![Page 21: Tecnologías de la web 2.0](https://reader033.fdocuments.es/reader033/viewer/2022052909/559806a91a28ab72398b46a0/html5/thumbnails/21.jpg)
Flex (1)Flex (1)
● Propiedad de Adobe● Tecnología para el cliente● Las aplicaciones se ejecutan sobre la
máquina virtual del reproductor de Flash (extensión del navegador)
● Lenguajes: MXML (declarativo; definición de la interfaz) y ActionScript (compatible con EcmaScript)
![Page 22: Tecnologías de la web 2.0](https://reader033.fdocuments.es/reader033/viewer/2022052909/559806a91a28ab72398b46a0/html5/thumbnails/22.jpg)
Flex (2)Flex (2)
● Flash Player 9; la versión 9 actualiza sustancialmente la máquina virtual (AVM2)
● Flex SDK; librerías; licencia abierta● Flex Builder; basado en Eclipse; código
cerrado● Flex Charting Components; visualización
avanzada de datos
![Page 23: Tecnologías de la web 2.0](https://reader033.fdocuments.es/reader033/viewer/2022052909/559806a91a28ab72398b46a0/html5/thumbnails/23.jpg)
Silverlight (1)Silverlight (1)● Propiedad de Microsoft● Las aplicaciones se ejecutan sobre una versión
de la máquina virtual de .Net llamada CoreCLR (extensión del navegador)
● Lenguajes: XAML (definición de la interfaz; usado ya en el subsistema gráfico de .Net, llamado Windows Presentation Foundation, WPF) y cualquier lenguaje de .Net
![Page 24: Tecnologías de la web 2.0](https://reader033.fdocuments.es/reader033/viewer/2022052909/559806a91a28ab72398b46a0/html5/thumbnails/24.jpg)
Silverlight (2)Silverlight (2)
● El desarrollo se realiza con Visual Studio● Plataforma muy joven: publicada a finales de
2006● Disponible parcialmente en Linux a través de
Moonlight del proyecto Mono
![Page 25: Tecnologías de la web 2.0](https://reader033.fdocuments.es/reader033/viewer/2022052909/559806a91a28ab72398b46a0/html5/thumbnails/25.jpg)
Del navegador al escritorioDel navegador al escritorio● Adobe Air (Windows, Linux y Mac):
● HTML, Ajax, Flash y Flex en el escritorio● Acceso a ficheros estrictamente locales● Comunicación entre aplicaciones
● Google Gears● Firefox 3 y su modo sin conexión● HTML 5 estandariza algunos aspectos del
trabajo sin conexión● ...
![Page 26: Tecnologías de la web 2.0](https://reader033.fdocuments.es/reader033/viewer/2022052909/559806a91a28ab72398b46a0/html5/thumbnails/26.jpg)
Factores a considerar al elegir Factores a considerar al elegir una tecnología adecuadauna tecnología adecuada
● Plataforma● Interoperabilidad● Código abierto o cerrado● Escalabilidad● Accesibilidad de las aplicaciones● Tiempo de aprendizaje● Tiempo de desarrollo● Comunidad de desarrolladores
![Page 27: Tecnologías de la web 2.0](https://reader033.fdocuments.es/reader033/viewer/2022052909/559806a91a28ab72398b46a0/html5/thumbnails/27.jpg)
¡Y algoritmos!¡Y algoritmos!● Fundamentales en las aplicaciones sociales:
● Votaciones, recomendaciones, personalización● Las técnicas fundamentales de reconocimiento de
formas se recogen en el libro Programming Collective Intelligence:● Minería de datos● Page ranking● Clasificación y agrupamiento● Algoritmos de búsqueda e indexación● ...
![Page 28: Tecnologías de la web 2.0](https://reader033.fdocuments.es/reader033/viewer/2022052909/559806a91a28ab72398b46a0/html5/thumbnails/28.jpg)
Servidores/hostingServidores/hosting● Software as a Service (SaaS)● Hardware as a Service (HaaS)
● Servicios web de Amazon (Amazon Web Services, AWS)
● Google App Engine
![Page 29: Tecnologías de la web 2.0](https://reader033.fdocuments.es/reader033/viewer/2022052909/559806a91a28ab72398b46a0/html5/thumbnails/29.jpg)
Amazon Web ServicesAmazon Web Services● AWS:
● Simple Storage Service (Amazon S3)● Elastic Compute Cloud (Amazon EC2), sobre
el que se pueden instalar diferentes imágenes y con persistencia a través de S3
● Simple Queue Service (Amazon SQS) para colas y mensajes entre los servidores
● Precios según uso; recursos escalables automáticamente según demanda en minutos; fiabilidad
![Page 30: Tecnologías de la web 2.0](https://reader033.fdocuments.es/reader033/viewer/2022052909/559806a91a28ab72398b46a0/html5/thumbnails/30.jpg)
Google App EngineGoogle App Engine
● Programable en Python● Google aporta un entorno de desarrollo
integrado● Gratuito para usos limitados
![Page 31: Tecnologías de la web 2.0](https://reader033.fdocuments.es/reader033/viewer/2022052909/559806a91a28ab72398b46a0/html5/thumbnails/31.jpg)
CréditosCréditos
● Los usos, ventajas y desventajas de Ajax se tomaron de la Wikipedia
● Plantilla de las transparencias