![Page 2: Mashups in the Information Technology Classroom](https://reader038.vdocument.in/reader038/viewer/2022102923/5549248ab4c905a54c8b9cf0/html5/thumbnails/2.jpg)
Agenda
• Teaching Mashups and Web 2.0• What are Mashups?• Microsoft Popfly• Yahoo Pipes• ASP.NET / C# Web Services with Google Maps• Google Spreadsheets• Sprout Builder• Teach Using Mashups ?
![Page 3: Mashups in the Information Technology Classroom](https://reader038.vdocument.in/reader038/viewer/2022102923/5549248ab4c905a54c8b9cf0/html5/thumbnails/3.jpg)
Web 2.0 at a Business University
• Web 2.0 is interdisciplinary• Experience “Data is the next Intel inside”• Tools are becoming more prevalent • Knowledge Workers will work with Information
Technologists and Software Developers• Data comes from many different sources• Understand concepts without mastering
implementation details• Web 2.0 opens the door to new business models
![Page 4: Mashups in the Information Technology Classroom](https://reader038.vdocument.in/reader038/viewer/2022102923/5549248ab4c905a54c8b9cf0/html5/thumbnails/4.jpg)
Teaching IT Concepts Through the Lens of Web 2.0
IT 101• IT 101 is a first year
required Intro to IT Course• “Technology Intensive”
sections
Topics• Computer maintenance• Windows Operating System• Spreadsheets• Web Pages• Internet / Networking• Multimedia / Graphics / Video• Current Events, Apps, and
Trends.
![Page 5: Mashups in the Information Technology Classroom](https://reader038.vdocument.in/reader038/viewer/2022102923/5549248ab4c905a54c8b9cf0/html5/thumbnails/5.jpg)
Information Technology Through the Lens of Web 2.0
Web 2.0
![Page 6: Mashups in the Information Technology Classroom](https://reader038.vdocument.in/reader038/viewer/2022102923/5549248ab4c905a54c8b9cf0/html5/thumbnails/6.jpg)
Learn By Experience
Technologies
• XML• RSS• Web Services• API• JavaScript• Servers• Distributed Applications• Compile
Application Development
• Software Design / Requirements
• Abstraction• Data• Logic• Iteration• Objects• Algorithmic Thinking• Methods• Parameters
![Page 7: Mashups in the Information Technology Classroom](https://reader038.vdocument.in/reader038/viewer/2022102923/5549248ab4c905a54c8b9cf0/html5/thumbnails/7.jpg)
Teach IT Concepts
Mash-Ups
• “Data is the next Intel Inside”
• XML, RSS• Web Services• Service Oriented
Architecture
Software Development
• Computer Programming• Application Development• Input, Output, Processing• Parameters• Application Programming
Interface (API)• Tools focus on Data Flow,
Not Syntax
![Page 8: Mashups in the Information Technology Classroom](https://reader038.vdocument.in/reader038/viewer/2022102923/5549248ab4c905a54c8b9cf0/html5/thumbnails/8.jpg)
What is a Mashup?
![Page 9: Mashups in the Information Technology Classroom](https://reader038.vdocument.in/reader038/viewer/2022102923/5549248ab4c905a54c8b9cf0/html5/thumbnails/9.jpg)
Mashups
![Page 10: Mashups in the Information Technology Classroom](https://reader038.vdocument.in/reader038/viewer/2022102923/5549248ab4c905a54c8b9cf0/html5/thumbnails/10.jpg)
Mashups
![Page 11: Mashups in the Information Technology Classroom](https://reader038.vdocument.in/reader038/viewer/2022102923/5549248ab4c905a54c8b9cf0/html5/thumbnails/11.jpg)
Read about Real World Mashups
• http://programmableweb.com• http://mashable.com• http://webmashup.com• http://readwriteweb.com
![Page 12: Mashups in the Information Technology Classroom](https://reader038.vdocument.in/reader038/viewer/2022102923/5549248ab4c905a54c8b9cf0/html5/thumbnails/12.jpg)
What’s Mashable? Anything XML
RSS Feeds• Reuters.com, Trulia.com
(real estate), flickr, twitter, delicious
• Google News search on a topic
REST• Wikipedia• Yahoo GeoCoding
Web Services Data (programming required)
• Xmethods.Net
![Page 13: Mashups in the Information Technology Classroom](https://reader038.vdocument.in/reader038/viewer/2022102923/5549248ab4c905a54c8b9cf0/html5/thumbnails/13.jpg)
MASHUPS WITH MICROSOFT POPFLY
![Page 14: Mashups in the Information Technology Classroom](https://reader038.vdocument.in/reader038/viewer/2022102923/5549248ab4c905a54c8b9cf0/html5/thumbnails/14.jpg)
• Developed by Microsoft non-professional products division
• Visually build real-world applications without code• Beta, Oct. 17, 2007• Share on web site, blog, or Facebook• I was in the New York Times !
![Page 15: Mashups in the Information Technology Classroom](https://reader038.vdocument.in/reader038/viewer/2022102923/5549248ab4c905a54c8b9cf0/html5/thumbnails/15.jpg)
popflywiki.com : Teaching Popfly
• http://popfly.com• http://popflywiki.com/teachingpopfly.ashx
![Page 16: Mashups in the Information Technology Classroom](https://reader038.vdocument.in/reader038/viewer/2022102923/5549248ab4c905a54c8b9cf0/html5/thumbnails/16.jpg)
Mash-ups in 6 Steps1. Drag and connect blocks in
your mashup onto the design surface.
2. Specify the methods and parameters for each block.
3. Play to run your mashup.4. Customize to work on it some
more.5. Save it when you’re done.6. Share your mash-up on your
web page
![Page 17: Mashups in the Information Technology Classroom](https://reader038.vdocument.in/reader038/viewer/2022102923/5549248ab4c905a54c8b9cf0/html5/thumbnails/17.jpg)
Student Work
Tim’s Web Site Matt’s Web Site
![Page 18: Mashups in the Information Technology Classroom](https://reader038.vdocument.in/reader038/viewer/2022102923/5549248ab4c905a54c8b9cf0/html5/thumbnails/18.jpg)
Popfly ExerciseWeather Map Mashup from Lesson 3
![Page 19: Mashups in the Information Technology Classroom](https://reader038.vdocument.in/reader038/viewer/2022102923/5549248ab4c905a54c8b9cf0/html5/thumbnails/19.jpg)
MASHUPS WITH YAHOO PIPES
![Page 20: Mashups in the Information Technology Classroom](https://reader038.vdocument.in/reader038/viewer/2022102923/5549248ab4c905a54c8b9cf0/html5/thumbnails/20.jpg)
Yahoo Pipes• Simplest is to output
custom RSS Feeds• Can output maps or
images if you add code to a badge and the feed contains that data
• A good Tutorial
• combine many feeds into one, then sort, filter and translate it.
• geocode your favorite feeds and browse the items on an interactive map.
• power widgets/badges on your web site.
• grab the output of any Pipes as RSS, JSON, KML, and other formats.
![Page 21: Mashups in the Information Technology Classroom](https://reader038.vdocument.in/reader038/viewer/2022102923/5549248ab4c905a54c8b9cf0/html5/thumbnails/21.jpg)
![Page 22: Mashups in the Information Technology Classroom](https://reader038.vdocument.in/reader038/viewer/2022102923/5549248ab4c905a54c8b9cf0/html5/thumbnails/22.jpg)
![Page 23: Mashups in the Information Technology Classroom](https://reader038.vdocument.in/reader038/viewer/2022102923/5549248ab4c905a54c8b9cf0/html5/thumbnails/23.jpg)
Yahoo Pipes
![Page 24: Mashups in the Information Technology Classroom](https://reader038.vdocument.in/reader038/viewer/2022102923/5549248ab4c905a54c8b9cf0/html5/thumbnails/24.jpg)
![Page 25: Mashups in the Information Technology Classroom](https://reader038.vdocument.in/reader038/viewer/2022102923/5549248ab4c905a54c8b9cf0/html5/thumbnails/25.jpg)
Pipes Exercises
• Find apartments on Craigslist near restaurants on the main street in your town.
![Page 26: Mashups in the Information Technology Classroom](https://reader038.vdocument.in/reader038/viewer/2022102923/5549248ab4c905a54c8b9cf0/html5/thumbnails/26.jpg)
Exercises (Popfly or Pipes)
• Make your own “friendfeed” mashup that combines data from different online RSS feeds with data about you (twitter, flickr, google search, etc.)
• Add a filter based on user input.
![Page 27: Mashups in the Information Technology Classroom](https://reader038.vdocument.in/reader038/viewer/2022102923/5549248ab4c905a54c8b9cf0/html5/thumbnails/27.jpg)
MASHUPS WITH GOOGLE SPREADSHEETS
![Page 28: Mashups in the Information Technology Classroom](https://reader038.vdocument.in/reader038/viewer/2022102923/5549248ab4c905a54c8b9cf0/html5/thumbnails/28.jpg)
Data Mashups with Google Spreadsheets
• Google Sets (ctrl and drag)• =GoogleFinance(“symbol”, “attribute”)• =GoogleLookup(“entity”, “value”)• =ImportFeed(“url”, paramters)• =ImportXML(url, Xpath expression)• =ImportHTML(“url”)• =ImportData(“url”)
http://googlesystem.blogspot.com/2007/09/google-spreadsheets-lets-you-import.html
![Page 29: Mashups in the Information Technology Classroom](https://reader038.vdocument.in/reader038/viewer/2022102923/5549248ab4c905a54c8b9cf0/html5/thumbnails/29.jpg)
=GoogleLookup(entity, value)• Countries and Territories (like "Burkina Faso"): population, capital, largest city, gdp • U.S. States (like "Tennessee"): area, governor, nickname, flower • Rivers (like "Amazon River"): origin, length • Cities and Towns (like "Chicago"): state, mayor, elevation • Musicians (like "John Lennon"): date of birth, place of birth, nationality • Actors (like "Audrey Hepburn"): date of birth, place of birth, nationality • Politicians (like "Anwar Al-Sadat"): date of birth, place of birth, nationality • U.S. Presidents (like "Zachary Taylor"): date of birth, place of birth, political party • Baseball Players (like "Wade Boggs"): games, at bats, earned run average, position • Chemical Elements (like "Helium"): atomic number, discovered by, atomic weight • Chemical Compounds (like "Isopropyl Alcohol"): chemical formula, melting point, boiling point,
density • Stars (like "Betelgeuse"): constellation, distance, mass, temperature • Planets (like "Saturn"): number of moons, length of day, distance from sun, atmosphere • Dinosaurs (like "Velociraptor"): height, weight, when it lived • Ships (like "USS Chesapeake"): length, displacement, complement, commissioned • Companies (like "Hewlett-Packard"): employees, ceo, ticker
![Page 30: Mashups in the Information Technology Classroom](https://reader038.vdocument.in/reader038/viewer/2022102923/5549248ab4c905a54c8b9cf0/html5/thumbnails/30.jpg)
![Page 31: Mashups in the Information Technology Classroom](https://reader038.vdocument.in/reader038/viewer/2022102923/5549248ab4c905a54c8b9cf0/html5/thumbnails/31.jpg)
Tech Companies Info Mashup
• =hyperlink(ImportFeed("http://news.google.com/news?hl=en&ned=us&q=" & A2 & "&ie=UTF-8&output=rss", "items url", "false", 1),ImportFeed("http://news.google.com/news?hl=en&ned=us&q=" & A2 & "&ie=UTF-8&output=rss", "items title", "false", 1))
![Page 32: Mashups in the Information Technology Classroom](https://reader038.vdocument.in/reader038/viewer/2022102923/5549248ab4c905a54c8b9cf0/html5/thumbnails/32.jpg)
![Page 33: Mashups in the Information Technology Classroom](https://reader038.vdocument.in/reader038/viewer/2022102923/5549248ab4c905a54c8b9cf0/html5/thumbnails/33.jpg)
![Page 34: Mashups in the Information Technology Classroom](https://reader038.vdocument.in/reader038/viewer/2022102923/5549248ab4c905a54c8b9cf0/html5/thumbnails/34.jpg)
![Page 35: Mashups in the Information Technology Classroom](https://reader038.vdocument.in/reader038/viewer/2022102923/5549248ab4c905a54c8b9cf0/html5/thumbnails/35.jpg)
OTHER MASHUP TOOLS
![Page 36: Mashups in the Information Technology Classroom](https://reader038.vdocument.in/reader038/viewer/2022102923/5549248ab4c905a54c8b9cf0/html5/thumbnails/36.jpg)
Other Mashup Tools
• Qrowd– Functional programming visually with blocks– Similar UI to Yahoo Pipes
• Sprout Builder– Build widgets from RSS, Video, images – Embed multimedia and RSS– Cool widgets/gadgets for your web page with no
HTML knowledge needed
![Page 37: Mashups in the Information Technology Classroom](https://reader038.vdocument.in/reader038/viewer/2022102923/5549248ab4c905a54c8b9cf0/html5/thumbnails/37.jpg)
MASHUPS WITH C#, WEB SERVICES, AND ASP.NET
![Page 38: Mashups in the Information Technology Classroom](https://reader038.vdocument.in/reader038/viewer/2022102923/5549248ab4c905a54c8b9cf0/html5/thumbnails/38.jpg)
Store Finder Project
![Page 39: Mashups in the Information Technology Classroom](https://reader038.vdocument.in/reader038/viewer/2022102923/5549248ab4c905a54c8b9cf0/html5/thumbnails/39.jpg)
http://it.bentley.edu/MEYFART_CHRI/final.aspx
![Page 40: Mashups in the Information Technology Classroom](https://reader038.vdocument.in/reader038/viewer/2022102923/5549248ab4c905a54c8b9cf0/html5/thumbnails/40.jpg)
Your Thoughts?
• What concepts can students better learn using mashups?
• Which tools or techniques are better suited for your classroom?