Your SlideShare is downloading. ×
Web2.0 2012 - lesson 7 - technologies and mashups
Upcoming SlideShare
Loading in...5

Thanks for flagging this SlideShare!

Oops! An error has occurred.


Saving this for later?

Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime - even offline.

Text the download link to your phone

Standard text messaging rates apply

Web2.0 2012 - lesson 7 - technologies and mashups


Published on

Lesson 7 course Web 2.0 2012 …

Lesson 7 course Web 2.0 2012
University of Camerino
Web 2.0 technologies and mashups

Published in: Technology

  • Be the first to comment

No Downloads
Total Views
On Slideshare
From Embeds
Number of Embeds
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

No notes for slide


  • 1. Web 2.0 blog, wiki, tag, social network: what are they, how to use them and why they are important Lesson 7: web 2.0 technologies and mashups
  • 2. This material is distributed under the Creative Commons "Attribution - NonCommercial - Share Alike - 3.0", available at . Part of the slides is the result of a welcome distance collaboration with prof. Roberto Polillo, University Milan Bicocca ( )
  • 3. Web 2.0 techniques From AJAX: HTML liberation from - Post / Get - asynchronous model (stateless) with the "WIMP" ( w indows, i cons, m enus and pointers) GUI, the Web comes close to desktop applications and Rich Internet Applications (RIA) arise Technical tools:
    • AJAX (Asynchronous JavaScript and XML)
    • 4. ATOM - RSS
    • 5. public API integration - interaction
    • 6. Mash-Up: Hybrid - Plugins (XUL!)
    • 7. many links
  • 8. Web 2.0 – moving to servers Centralization – decentralization cycle Technology mainframe -> LAN / fat client -> Web / thin client Monopolist IBM -> Microsoft -> Google Data Central (local) -> Decentralized (local) -> Central (global) Cloud!
  • 9. Web 2.0 – AJAX AJAX Components - XHTML and CSS to format the information (an XHTML file is an HTML page written in accordance with the XML standard) - DOM objects, manipulated through Javascript, to interact with the information presented (events!) - The XMLHttpRequest object to exchange data asynchronously with the server - XML as a format for exchanging data between servers and clients First use of the term: (see schema) In deep: (see next)
  • 10. Web 2.0 : development tools 2.0: agile technologies:
    • constant evolution
    • 11. development phases divided in little interactions
    • 12. care to current project needs Frameworks available:
    • Ruby On Rails, fw open MVC based on Ruby (OO)
    • 13. Django, fw open MVC Python
    • 14. Symfony fw open MVC PHP5 with AJAX support
    • 15. Zend framework fw open PHP5
    • 16. Google Web Toolkit fw open java, plugin for Eclipse/NetBeans W3C started a group on “Rich Web Clients Activity” to improve client-side Web functionalities
  • 17. Web 2.0 techniques: XUL XUL (XML User Interface Language) is a language used to define graphical interfaces Used for Firefox, Thunderbird and their extensions and plugins : film references
  • 18. Web 2.0 : mash-up Meaning: mash = mixture, medley to mash = to crush, to squeeze (term used even in music) Web application that integrates dynamic content or services from multiple sources (eg RSS or via API) to create a new service (note: portal |= mashup) a good presentation: (choose the best)
  • 19. Web 2.0 : examples of mash-up a partments for rent and for sale geo-referenced (Googlemaps + real-time tweets your twitter status … in photos! tweets: positive, neutral, negative visual search-engine NY art in bubbles color search-engine “ There are creative people all around the world, hundreds of millions of them, and they are going to think of things to do with our basic platform that we didn’t think of.” Vinton Cerf
  • 20. Web 2.0 : examples of mash-up MashMaker by Intel “Keeping you up to date with APIs, mashup and the Web as a platform” Most popular mashups:
  • 21. Web 2.0 : examples of mash-up Source:
  • 22. Web 2.0 : examples of mash-up A "dashboard" to monitor the flow of news about certain topics on different information channels (CNN, Twitter Search, Technorati, Daylife, Alexa, Google's Insight for Search, and other) “ This project presents different perspectives in our world, including that of Mainstream media and user-generated content on the Internet. Explore the similarities and the disparities, hear the many voices that have emerged and choose which view, if any, makes the most sense to you. What we think vs. what they say we think -- All the chatter on the Internet, all the traditional news media coverage, and all the pollsters -- Perspctv brings it all together in a simple and elegant manner -- and gives a unique "dashboard" picture of the elections at any one given moment in time, totally un-biased.”
  • 23. mash-up Strengths
    • "Lightweight" application
    • 24. (reduced code volume, low-cost application development)
    • 25. Ease of application development
    • 26. (availability of tools that do not require high technical skills - es.pipes)
    • 27. Availability of large databases
    • 28. Low (or no) cost of acquiring and updating data
    • 29. Quick Set-up application
    • 30. (time-to-market, possibility of quick prototyping)
  • 31. mash-up Critical
    • Dependence on data sources
    • 32. (data quality, performance, availability and continuity of service, changes in service policies, stability -> fragility, "the strength of its weakest link")
    • 33. API standards and versioning
    • 34. Intellectual property and copyright
    • 35. ("right to remix”: to what extent?)
    • 36. Privacy
    • 37. (cross and filter data can generate problems not existing in the original data)
  • 38. Mobilize web sites example: test about web sites appearance in mobile phones standard:
  • 39. exercise 7
    • Explore , and report examples of particularly interesting and innovative mashups
    • 40. Embed images, photos, slides, etc. inside your blog using mashup techniques
    • 41. Explore the use of yahoo! pipes
    • 42. (comments and links on the wiki!)