MASHUPS Expo AMI
Upcoming SlideShare
Loading in...5
×

Like this? Share it with your network

Share

MASHUPS Expo AMI

  • 1,576 views
Uploaded on

Presentacion en ppt sobre Mashups para exposicion en materia AMI de la ESPOL 1T-2009

Presentacion en ppt sobre Mashups para exposicion en materia AMI de la ESPOL 1T-2009

More in: Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
1,576
On Slideshare
1,573
From Embeds
3
Number of Embeds
1

Actions

Shares
Downloads
38
Comments
0
Likes
1

Embeds 3

http://www.slideshare.net 3

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. MASHUPS
    Aplicaciones Web Hibridas
    (Web Applications Hybrid)
  • 2. What is a Mashup?
    ZDNetVideos - What is a Mashup.flv
    Video Introductorio
  • 3. HousingMaps - http://www.housingmaps.com/
    Digg - http://digg.com/
    Netvibes - http://www.netvibes.com/
    iGoogle - www.google.com/ig
    WikiCrimes - http://www.wikicrimes.org/
    EJEMPLOS
  • 4. HousingMaps
  • 5.
  • 6.
  • 7. Digg
  • 8. NetVibes
  • 9. iGoogle
  • 10.
  • 11. WikiCrimes
  • 12.
  • 13. Es una página web o aplicación que combina datos o funcionalidad de dos o más fuentes externas, es decir, el contenido de otras aplicaciones web, para crear un nuevo servicio o contenido completo.
    Los mashups son aplicaciones web que reutilizan la información de otras aplicaciones y servicios en la red.
    CONCEPTO (Definicion Formal)
  • 14. APIs (Application Programming Interface)
    Interfaz de programación de aplicaciones.
    Conjunto de funciones que sirven como plataforma sobre la cual otros programas pueden ser construidos.
    XML feeds (RSS o Atom)
    Es un medio o formato de redifusión de contenido web codificado en XML.
    Screen-Scraping (raspado de pantalla)
    Técnica para extraer los datos de una presentación.
    Extraer los datos originales a partir de la imagen de una gráfica elaborada.
    Extraer los datos de un informe en PDF para volcarlos en una hoja de cálculo.
    FUENTES DE DATOS (Data Sources)
  • 15. Proveedor de Contenidos
    Es la fuente de los datos. El contenido es típicamente obtenido de otra fuente vía una interface pública o API(web services) o de Web Feeds(RSS o Atom).
    El SitioMashup
    Es la nueva aplicación web que provee un nuevo servicio utilizando información de diversas fuentes.
    El Web Browser Cliente
    Es la interfaz de usuario del mashup. El contenido puede ser mezclado por los web browser clientes usando lenguaje web del lado del cliente. Por ejemplo Javascript.
    ARQUITECTURA TIPICA
  • 16.
  • 17.
  • 18.
  • 19. API Protocols
  • 20. ESTILOS DE MASHUPS
  • 21. APIs masusados(Top APIs)
  • 22. GoogleMaps API
  • 23. Facebook API
  • 24. Flickr API
  • 25. Amazon API
  • 26. TOP Mashups
  • 27. MozillaUbiquity
    http://ubiquity.mozilla.com/
    JackBe Presto 2.7
    http://www.jackbe.com/enterprise-mashup/
    Yahoo Pipes
    http://pipes.yahoo.com/pipes/
    Editores de Mashups
  • 28. Yahoo Pipes
  • 29.
  • 30. 1. Definir la aplicacion
    2. Definir la Base de Datos
    3. Fichero PHP paraacceso a la base de datos
    4. Fichero PHP paraintroducirnuevosdatos
    5. Visualizacion de Datos
    6. Creacion del Javascript de Google Maps
    Creacion de un Mashup
  • 31. 1 - Definir la aplicacion
  • 32. 2 – La Base de Datos
  • 33. config.php - hacemos una conexión a la Base de Datos y en caso de que exista algún error mostramos un mensaje de error y salimos. Este fichero lo incluiremos en otros PHP con un simple include(’config.php’)
    3 – Acceso a la base de datos
  • 34. introducir.php - introducir nuevos datos en el mapa simplemente pulsando sobre una posición del mapa.
    Obtener los parámetros que rellenamos en el formulario
    Recuperamos la posición
    4 – Introducirnuevosdatos
  • 35. Comprobar que no hay ningún parámetro incorrecto
    Realizamos la inserción
  • 36. index.php - nos sirva de index para nuestro sitio, que tiene que poseer la siguiente funcionalidad:
    Mostrar el mapa de Google Maps
    Mostrar los restaurantes ya posicionados (acceder a la Base de Datos y consultarlos).
    Mostrar una leyenda para entender los datos
    Permitir introducir nuevos datos en el mapa simplemente pulsando sobre una posición del mapa
    Añadir el buscador de Google Maps para poder posicionarnos en le mapa por dirección
    5 – Visualizacion de Datos
  • 37. Creacion varias variables que utilizaremos en el resto del fichero php.
    Incluir los ficheros config.php e introducir.php
    Obtener los restaurantes de la base de datosparamostrar los puntos en el mapa
  • 38. Añadir el script de mapas de google, un script JavaScript que nos proporciona Google
  • 39. process.php - crear el código Javascript necesario por Google maps para posicionar los puntos en el mapa
    creación dinámica de los puntos del mapa
    Incluir process.php en el fichero index.php
    6 – CreacionJavascript de Google Maps
  • 40.
  • 41. Programmable Web – APIs, Mashups, Ejemplos, etc.
    http://www.programmableweb.com/
    TwitGraph
    http://twitgraph.appspot.com/
    Google Hot Trends + Twitter + Google Maps
    http://www.mibazaar.com/gtwitter.html
    Iran Election Protest Tweet Map
    http://www.mibazaar.com/irantweets.html
    1000 songs
    http://1000songs.ebotunes.com/
    MAS EJEMPLOS - Recursos
  • 42. TwitGraph
  • 43.
  • 44. Google Hot Trends + Twitter + Google Maps
  • 45.
  • 46.
  • 47. Iran Election Protest Tweet Map
  • 48.
  • 49. 1000 songs
  • 50.
  • 51.
  • 52. GRACIAS !!!