Post on 04-Jul-2015
description
transcript
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
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)
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
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.
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.
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
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● ...
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
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
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
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)
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
Ventajas de AjaxVentajas de Ajax
● Aprovechamiento del ancho de banda● Reducción de la carga del servidor● Aplicaciones más intuitivas e interactivas
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�
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...
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
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
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
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
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)
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)
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
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
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
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● ...
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
¡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● ...
Servidores/hostingServidores/hosting● Software as a Service (SaaS)● Hardware as a Service (HaaS)
● Servicios web de Amazon (Amazon Web Services, AWS)
● Google App Engine
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
Google App EngineGoogle App Engine
● Programable en Python● Google aporta un entorno de desarrollo
integrado● Gratuito para usos limitados
CréditosCréditos
● Los usos, ventajas y desventajas de Ajax se tomaron de la Wikipedia
● Plantilla de las transparencias