Your SlideShare is downloading. ×
0
Mashups
work you don’t have to do




           evalica@infoiasi.ro
 http://students.info.uaic.ro/~evalica/
Content
                           Web 2.0 Software

                           So what’s a mashup?

                     ...
quot;We know we don't have a corner on creativity.
                           There are creative people all around the wor...
Buzzword 2.0

                           microformats
                                                                    ...
Web 2.0 Software

                           Alternative way of producing software: lighter,
                           fa...
Web 2.0 Development Ideals
                           Extremely Frequent Releases: Bugs go away faster,
                  ...
So what’s a mashup?

                           “A mashup is a website or application that
                           comb...
So what’s a mashup?

                           That encourage software creators to expose
                           thei...
Make your own mashup
                       Pick a subject Decide what data sources

                       Decide where y...
Make your own mashup
                                                                        Top APIs for Mashups
        ...
Make your own mashup
                       Putting everything together

                                                 ...
Mashup styles

                           Presentation Mashup: Information either remix
                           or just...
Mashup styles
                           Server-Side Software Mashup: Recombinant
                           software is e...
Mashup styles
Summer <Web /> 2.007




                       Ecaterina Valică evalica@infoiasi.ro
                       ...
Google Maps Mashup

                           APIs: http://code.google.com/apis/

                           Lightweight ...
Google Maps Mashup
Summer <Web /> 2.007




                       Ecaterina Valică evalica@infoiasi.ro
                  ...
Google Maps Mashup


                                                                      As simple as possible,
        ...
Google Maps Mashup
Summer <Web /> 2.007




                       Ecaterina Valică evalica@infoiasi.ro
                  ...
Chicagocrime
                                                                                                http://www.ch...
Housing Maps
                                                                                              http://www.hous...
BBC News
                                                                   http://www.benedictoneill.com/content/newsmap/...
loc.alize.us
                                                                                                             ...
Quebec Wines
                                                      http://www.quebecwines.com/qw_quebecwineriesmap.php

  ...
emokoo
                                                                                                      http://www.em...
Page Flakes
                                                                                                  http://www.p...
The Effects of Nuclear Weapons
                                                                   http://meyerweb.com/eric...
World of Warcraft Map
                                                                                                    ...
Goggles
                                                                                 http://www.isoma.net/games/goggle...
Whack-A-Mole(Ker)
                 http://gmaps-samples.googlecode.com/svn/trunk/whackamarker/whackamarker.htm

          ...
Limitations & Challenges
                           Limitations of APIs

                                Query size / Quan...
Limitations & Challenges
                           Bridgewerx, Kapow, Worcsnet - requiring programming
                  ...
Links

                           http://www.programmableweb.com

                           http://www.googlemapsmania.bl...
Questions?
Summer <Web /> 2.007




                       Ecaterina Valică evalica@infoiasi.ro
                          ...
Upcoming SlideShare
Loading in...5
×

Mashups

10,952

Published on

Mashups Intro and Examples

Published in: Technology, Education

Transcript of "Mashups"

  1. 1. Mashups work you don’t have to do evalica@infoiasi.ro http://students.info.uaic.ro/~evalica/
  2. 2. Content Web 2.0 Software So what’s a mashup? Make your own mashup Summer <Web /> 2.007 Mashup styles Google Maps Mashup Samples Limitations & Challenges Ecaterina Valică evalica@infoiasi.ro 2
  3. 3. quot;We know we don't have a corner on creativity. There are creative people all around the world, Summer <Web /> 2.007 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.quot; Vint Cerf Ecaterina Valică evalica@infoiasi.ro 3
  4. 4. Buzzword 2.0 microformats participation ebay RSS Google APIs Mashups Summer <Web /> 2.007 YouTube folksonomy Flickr Ajax del.icio.us Wikipedia blogging open data Amazon Ecaterina Valică evalica@infoiasi.ro 4
  5. 5. Web 2.0 Software Alternative way of producing software: lighter, faster, more people-centric direction Suitable when requirements are rapidly changing Used to make business applications that are easier Summer <Web /> 2.007 to build, cheaper, more reusable, and more maintainable Web 2.0 directions lead to information sharing, collaboration and social networking Ecaterina Valică evalica@infoiasi.ro 5
  6. 6. Web 2.0 Development Ideals Extremely Frequent Releases: Bugs go away faster, smooth evolution Small Pieces, Loosely Joined: Makes change easier, less risky but the parts are also less specialized and hackable Lightweight Programming Models: Languages and Summer <Web /> 2.007 simple data formats make development easy and cost- effective Users as Co-Creators: Offering them the features they want, allowing them to contribute information and attention Real-time Feedback and Sampling: watch what they do and use the feedback to create an better product Ecaterina Valică evalica@infoiasi.ro 6
  7. 7. So what’s a mashup? “A mashup is a website or application that combines content from more than one source into an integrated experience Content used in mashups is typically sourced from a third party via a public interface or API Summer <Web /> 2.007 Other methods of sourcing content for mashups include Web feeds (e.g. RSS or Atom) and JavaScript” Ecaterina Valică evalica@infoiasi.ro 7
  8. 8. So what’s a mashup? That encourage software creators to expose their applications as sets of reusable services and encourage others use the good pieces of what they provide in new and innovative ways, easily wiring together the little pieces Summer <Web /> 2.007 On the demand-side there is a rising comfort with and expectation of finding a throw-away application to do just the one thing you needed when you need it Ecaterina Valică evalica@infoiasi.ro 8
  9. 9. Make your own mashup Pick a subject Decide what data sources Decide where your data is coming from Programmableweb.com Summer <Web /> 2.007 Total APIs: 431 Total Mashups Listed : 1900 Mashup/Day: 3.16 Weigh your coding skills: JavaScript, AJAX, Ruby, etc. Ecaterina Valică evalica@infoiasi.ro 9
  10. 10. Make your own mashup Top APIs for Mashups Advertising Google AdSense, Yahoo Ads Blogging Blogger Bookmarks del.icio.us Events Eventful, Upcoming.org Summer <Web /> 2.007 Mapping Google Maps, Top Mashup Tags Yahoo Maps, Microsoft Virtual Earth Media YouTube, Flickr, Google Picasa News BBC Shopping Amazon, eBay Ecaterina Valică evalica@infoiasi.ro 10
  11. 11. Make your own mashup Putting everything together User User Request Data presentation Summer <Web /> 2.007 Data Manipulation Mashup website Data API Call Data API Call Website 2 Website 1 Ecaterina Valică evalica@infoiasi.ro 11
  12. 12. Mashup styles Presentation Mashup: Information either remix or just placed next to each other: Ajax desktops, portals Client-Side Data Mashup: Information from Summer <Web /> 2.007 remote Web services, feeds, or even just plain HTML => new information Client-Side Software Mashup: Code integrated to result in a distinct new capability Ecaterina Valică evalica@infoiasi.ro 12
  13. 13. Mashup styles Server-Side Software Mashup: Recombinant software is easier since Web services Server-Side Data Mashup: Mashup up data across databases from different vendors Summer <Web /> 2.007 The advantage of in-browser client mashups is the complete portability and mobility they offer The advantage of server-side mashup is that it simplifies the client and offers a programming infrastructure that is much deeper and more powerful Ecaterina Valică evalica@infoiasi.ro 13
  14. 14. Mashup styles Summer <Web /> 2.007 Ecaterina Valică evalica@infoiasi.ro 14
  15. 15. Google Maps Mashup APIs: http://code.google.com/apis/ Lightweight programming model: Ajax, entirely JavaScript and XML, data formats: JSON, RSS Summer <Web /> 2.007 Google offers trust and credibility. As a mashup component supplier, having both of these in large supply is essential to get people to establish a long-term relationship with you Ecaterina Valică evalica@infoiasi.ro 15
  16. 16. Google Maps Mashup Summer <Web /> 2.007 Ecaterina Valică evalica@infoiasi.ro 16
  17. 17. Google Maps Mashup As simple as possible, but no simpler Summer <Web /> 2.007 Ecaterina Valică evalica@infoiasi.ro 17
  18. 18. Google Maps Mashup Summer <Web /> 2.007 Ecaterina Valică evalica@infoiasi.ro 18
  19. 19. Chicagocrime http://www.chicagocrime.org Description: A freely browsable database of crimes reported in Chicago overlaid onto Google Maps APIs: Google Maps Summer <Web /> 2.007 Ecaterina Valică evalica@infoiasi.ro 19
  20. 20. Housing Maps http://www.housingmaps.com/ Description: Visual housing search page via dynamic overlays of Craigslist home listings on Google Maps APIs: Google Maps Summer <Web /> 2.007 Ecaterina Valică evalica@infoiasi.ro 20
  21. 21. BBC News http://www.benedictoneill.com/content/newsmap/ Description: See where the latest news is happening in the UK APIs: BBC, Google Maps Summer <Web /> 2.007 Ecaterina Valică evalica@infoiasi.ro 21
  22. 22. loc.alize.us http://loc.alize.us Description: Find any place all around the world and see where your or your friends have been APIs: Flickr, Google Maps Summer <Web /> 2.007 Ecaterina Valică evalica@infoiasi.ro 22
  23. 23. Quebec Wines http://www.quebecwines.com/qw_quebecwineriesmap.php Description: Show the location of the wineries in Quebec and related wine information APIs: Amazon E-commerce, Google AdSense, Google Maps, Google Search Summer <Web /> 2.007 Ecaterina Valică evalica@infoiasi.ro 23
  24. 24. emokoo http://www.emokoo.com/ Description: A community site allowing you to share media from other social web 2.0 communities APIs: Blogger, Flickr, YouTube Summer <Web /> 2.007 Ecaterina Valică evalica@infoiasi.ro 24
  25. 25. Page Flakes http://www.pageflakes.com/ Description: Custom homepage builder that uses Ajax to includes pre-built modules for Flickr, YouTube, Amazon, etc. APIs: Amazon S3, AOL Video, Box.net, Clickatell, del.icio.us, FedEx, Flickr, Google Ajax Search, Google Calendar, Google Code Search, Google Maps, indeed, InnerGears Weather by City, Map24 AJAX API, OpenStreetMap, Rhapsody, Rrove, SmashFly, TradeSports, WebAIM, YouTube Summer <Web /> 2.007 Ecaterina Valică evalica@infoiasi.ro 25
  26. 26. The Effects of Nuclear Weapons http://meyerweb.com/eric/tools/gmap/hydesim.html Description: Illustrates the effect of a 150 kiloton nuclear explosion APIs: Google Maps Summer <Web /> 2.007 Ecaterina Valică evalica@infoiasi.ro 26
  27. 27. World of Warcraft Map http://mapwow.com/ Description: A World of Warcraft Map that includes Herbs, Ores and Treasures APIs: Google Maps Summer <Web /> 2.007 Ecaterina Valică evalica@infoiasi.ro 27
  28. 28. Goggles http://www.isoma.net/games/goggles.html Description: Flight simulator built on top of Google Maps, containing several locations to fly over APIs: Google Maps Summer <Web /> 2.007 Ecaterina Valică evalica@infoiasi.ro 28
  29. 29. Whack-A-Mole(Ker) http://gmaps-samples.googlecode.com/svn/trunk/whackamarker/whackamarker.htm Description: Whack as many invader mole you can APIs: Google Maps Other: Easter Egg Hunt Summer <Web /> 2.007 Ecaterina Valică evalica@infoiasi.ro 29
  30. 30. Limitations & Challenges Limitations of APIs Query size / Quantity – less than 50,000 hits per day (Google Maps) API change? Can you keep up? Summer <Web /> 2.007 Cross-domain security problem Legal Issues: quot;It's simply combining two things but not (adding) a lot of intellectual property on top of it. The problem is the people giving you the content want to be compensated. You are in fact a reseller of that content.“ Leap Frog Ventures Ecaterina Valică evalica@infoiasi.ro 30
  31. 31. Limitations & Challenges Bridgewerx, Kapow, Worcsnet - requiring programming skills to create mashups QEDWiki developed by IBM Google launches a new feature for Google Maps, My Maps, who can: Summer <Web /> 2.007 Mark locations on a map from a library of icons Draw lines and shapes to highlight paths and areas Add text, photos, or YouTube/Google Videos to a map Add HTML for further personalization View their maps in Google Earth Ecaterina Valică evalica@infoiasi.ro 31
  32. 32. Links http://www.programmableweb.com http://www.googlemapsmania.blogspot.com/ http://www.webdirections.org/ Summer <Web /> 2.007 http://web2.wsj2.com/ http://code.google.com/ http://www.wikipedia.org/ Ecaterina Valică evalica@infoiasi.ro 32
  33. 33. Questions? Summer <Web /> 2.007 Ecaterina Valică evalica@infoiasi.ro 33
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×