Loading…

Flash Player 9 (or above) is needed to view presentations.
We have detected that you do not have it on your computer. To install it, go here.

Like this presentation? Why not share!

A

on

  • 1,992 views

Just a simple PDF for SlideShare.

Just a simple PDF for SlideShare.

Statistics

Views

Total Views
1,992
Views on SlideShare
1,992
Embed Views
0

Actions

Likes
0
Downloads
11
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment
  • Enter Title of Presentation HereGoogle Confidential
  • Enter Title of Presentation HereGoogle Confidential
  • Benefits of using Friend Connect

A A Presentation Transcript

  • Introduction to OpenSocial Chris Schalk, Developer Advocate 6/14/2008 Taipei
  • Agenda • OpenSocial Concepts • Building OpenSocial Applications • Hosting OpenSocial Applications • Google Friend Connect • OpenSocial Containers 3
  • Agenda • OpenSocial Concepts • Building OpenSocial Applications • Hosting OpenSocial Applications • Google Friend Connect • OpenSocial Containers 4
  • OpenSocial Making the Web More Social OpenSocial makes this possible 5
  • OpenSocial High Level Details • A set of APIs that operate in standard Web technologies • A reference Implementation: Shindig • Apache Open Source Project • A huge community of developers • Even bigger community of users! 6
  • OpenSocial Advantages • Social Networks • Lots of features, minimal cost, showcase their innovations • App Developers • Can reach 275+ Million Users • Web Users • Lots of apps to choose from! So what is the biggest advantage of OpenSocial? 7
  • Too many platforms!
  • Standards based OpenSocial Write once… Deploy everywhere
  • Single Platform Cooooool!
  • A small sample of OpenSocial partners friendster ® 11
  • Agenda • OpenSocial Concepts • Building OpenSocial Applications • Hosting OpenSocial Applications • Google Friend Connect • OpenSocial Containers 12
  • Building OpenSocial Applications • Standards Based • HTML+JavaScript+CSS, LAMP, Cloud services • Provides Viral features to share apps • Developer Sandboxes • MySpace, orkut, hi5, iGoogle,… 13
  • OpenSocial Client APIs • JavaScript API - for browser based client development Standard Web development technologies • HTML + Javascript, CSS, AJAX • Can integrate with 3rd party servers • PHP, Perl, Java, C/C++ • • RESTful API - for server based client development Based on Atom publishing protocol • Data transfer is Atom or JSON • More on RESTful API later… • 14
  • Building JavaScript OpenSocial Applications • If you know how to develop gadgets, you know how to develop JavaScript OpenSocial applications! Follows same approach as gadgets • • JavaScript/HTML/CSS embedded in an XML document • XML document containing gadget is hosted on the Internet OpenSocial applications are “gadgets++” • • Gadgets development, but with additional Social capabilities 15
  • OpenSocial application in action Gadget using JavaScript Client API communicates with OpenSocial server OpenSocial JSON Server browser Gadget XML Source 16
  • Understanding the OpenSocial JavaScript API The core OpenSocial services: • People & Friends Access friends information programmatically • • Activities See what you’re friends are up to • Share what you are doing • • Persistence Provide state without a server • Share data with your friends • 17
  • OpenSocial JavaScript APIs overview Additional Gadgets services: • Gadgets Core Utilities handling gadget preferences, IO, JSON • Gadgets Feature-Specific Utilities for working with flash, window management, tabs, rpc, MiniMessage 18
  • People & Friends Example An example JavaScript function to request viewer and friends info function getFriendData() { var req = opensocial.newDataRequest(); req.add(req.newFetchPersonRequest(VIEWER), 'viewer'); req.add(req.newFetchPeopleRequest(VIEWER_FRIENDS), 'viewerFriends'); req.send(onLoadFriends); } 19
  • People & Friends Example Callback function for returned friend data function onLoadFriends(resp) { var viewer = resp.get('viewer').getData(); var viewerFriends = resp.get('viewerFriends').getData(); var html = 'Friends of ' + viewer.getDisplayName() + ‘:<br><ul>’; viewerFriends.each(function(person) { html += '<li>' + person.getDisplayName()+'</li>';}); html += '</ul>'; document.getElementById('friends').innerHTML = html; } 20
  • Activities Example Posting an Activity function postActivity(text) { var params = {}; params[opensocial.Activity.Field.TITLE] = text; var activity = opensocial.newActivity(params); opensocial.requestCreateActivity(activity, opensocial.CreateActivityPriority.HIGH, callback); } postActivity(quot;This is a sample activity, created at quot; + new Date().toString()) } 21
  • Persistence Example Storing persisted data function populateMyAppData() { var req = opensocial.newDataRequest(); var data1 = Math.random() * 5; var data2 = Math.random() * 100; req.add(req.newUpdatePersonAppDataRequest(quot;VIEWERquot;, quot;AppField1quot;, data1)); req.add(req.newUpdatePersonAppDataRequest(quot;VIEWERquot;, quot;AppField2quot;, data2)); req.send(requestMyData); } 22
  • Persistence Example Fetching persisted data function requestMyData() { var req = opensocial.newDataRequest(); var fields = [quot;AppField1quot;, quot;AppField2quot;]; req.add(req.newFetchPersonRequest( opensocial.DataRequest.PersonId.VIEWER), quot;viewerquot;); req.add(req.newFetchPersonAppDataRequest(quot;VIEWERquot;, fields), quot;viewer_dataquot;); req.send(handleReturnedData); } 23
  • Demonstration: Building OpenSocial Applications 24
  • Integrating OpenSocial applications with external servers The OpenSocial persistence service provides a way to store/share small amounts of data on the OpenSocial server, but… • What if you need to store more data than your container allows? • Solution: You can make independent requests out to external servers. • Use: gadgets.io.makeRequest • Can also make authenticated requests using Oauth • Can use cloud services from: Joyent, Amazon or AppEngine! 25
  • Integrating OpenSocial applications with external servers An example request to an external server gadgets.io.makeRequest TIFFQuickTimeªsee this picture. and a (Uncompressed) decompressor are needed to OpenSocial External Server Server 1 2 browser 1. Initial request made from gadget 2. Server routes request to external server Requests can be secured using OAuth! 26
  • Additional OpenSocial application development resources • OpenSocial documentation, FAQ, Blog • http://code.google.com/opensocial • Further development resources • http://code.google.com/p/opensocial-resources • Development sandboxes available for: • orkut, hi5, MySpace, imeem, Netlog 27
  • Agenda • OpenSocial Concepts • Building OpenSocial Applications • Hosting OpenSocial Applications • Google Friend Connect • OpenSocial Containers 28
  • How to host OpenSocial Applications 1. Can build your own server that implements OpenSocial specification… 2. Or can use “Shindig” - Reference implementation for OpenSocial • Gadget Server –Renders gadget XML as HTML/JS/CSS • OpenSocial Data Server –RESTful API server (in-progress) 29
  • Shindig Architecture • Gadget Server • OpenSocial Data Server Shindig Yoursite.com Gadget Server Gadget OpenSocial DataServer 30 30
  • Why use Shindig? • Strong open source community • High quality production-ready code • Update easily as OpenSocial evolves • Built in security using OAuth • Fully compliant with OpenSocial v0.7 • Shindig is language neutral (Java, PHP today…) 31
  • Demonstration: Trying out Shindig 32 32
  • Interacting with the REST API using Shindig Question: Why would you need a RESTful API? Answer: What if you wanted to access OpenSocial data from a server? (Outside of a browser/JavaScript environment) • Use simple REST calls instead! – Does not require JavaScript – Allows server-to-server communication • Easily integrate with other server-side technologies: Java, PHP, Perl 33
  • Shindig REST Architecture • Gadget Server • OpenSocial Data Server • REST Server (in progress) Shindig Gadget Server REST Yoursite.com OpenSocial REST Server Java | PHP | Python JSON or ATOM C++ | Perl … OpenSocial DataServer 34 34
  • Shindig success at hi5 • Big Traffic • 10k req/sec Edge • 6k req/sec Origin • Hundreds of Developers • 800+ Apps • 1 Billion hits/day … on 40 Shindig servers 35 35
  • Agenda • OpenSocial Concepts • Building OpenSocial Applications • Hosting OpenSocial Applications • Google Friend Connect • OpenSocial Containers 36
  • Google Friend Connect • Personal Web sites (e.g.blogs) have readers, contacts, connections for a social graph • Can small personal websites host OpenSocial applications? Problem: blogger’s/Webmasters typically lack development resources! Solution: Google Friend Connect solves this problem! 37
  • Google Friend Connect A hosted OpenSocial container solution 38
  • ingridmichaelson.com on Friend Connect 39
  • My new blog on Friend Connect 40
  • Google Friend Connect •Users • … more ways to do more things with my friends •Site owners •… more (and more engaged) traffic for my site •App developers •... more reach for my apps • Sign up for the preview release! http://google.com/friendconnect/ 41
  • Agenda • OpenSocial Concepts • Building OpenSocial Applications • Hosting OpenSocial Applications • Google Friend Connect • OpenSocial Containers 42
  • OpenSocial Development Current live OpenSocial developer sandboxes • 2400+ apps • 275+ million users • 20,000+ developers • 88 million installs 43
  • OpenSocial Platform Q&A A & Q ! 44