Scribd
Upload
74 views62 pages

Facebook Mobile Hack Crash Course: Singapore 19th March 2012

This document provides an overview and summary of Facebook's mobile, web, and API capabilities. It discusses Facebook plugins that can be used to share content on external sites, the SDKs available for different platforms, tools like the Graph API and FQL for accessing user data, and how the Open Graph protocol allows external apps to publish user actions to Facebook.

Uploaded by

mantosz
Copyright
© Attribution Non-Commercial (BY-NC)
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
74 views62 pages

Facebook Mobile Hack Crash Course: Singapore 19th March 2012

This document provides an overview and summary of Facebook's mobile, web, and API capabilities. It discusses Facebook plugins that can be used to share content on external sites, the SDKs available for different platforms, tools like the Graph API and FQL for accessing user data, and how the Open Graph protocol allows external apps to publish user actions to Facebook.

Uploaded by

mantosz
Copyright
© Attribution Non-Commercial (BY-NC)
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 62

Facebook Mobile Hack

Singapore th March

Crash Course
Jonathan Matus Christine Abernathy

The Netix Share Moment

1. People want to talk to one another


Sharing is a means to an end. The conversation is the end. Build experiences and products which meet this need. Sharing should be organic and natural, not incentivised or forced.

2. Why do people talk?


We talk to survive. We talk to form social bonds We talk to help others We talk to manage how others perceive us.

3. People Talk about three things:


70% of conversations are about people not who
are not involved in the conversation.

We share feelings, not facts. We talk about things around us

4. Who do we talk to?


Primarily, we talk to the same people, the ones that are close to us. Build experiences which focus on that.

Social applications

Jargon-Busting
Understanding the Facebook Product

TimeLine

TimeLine

Facebook Platform Capabilities


What are the type of things you can use Facebook Platform for?

Facebook Platform
Pages Canvas

Social plugins

Mobile

Open Graph

Credits

Ads

Insights

Facebook Platform
Pages Canvas

Social plugins

Mobile

Open Graph

Credits

Ads

Insights

GDP Authentication

user_about_me user_activities user_checkins user_education_history rsvp_event user_events create_event user_groups user_hometown user_likes user_interests

user_education_history rsvp_event user_events create_event user_groups user_hometown user_likes user_interests user_notes user_photo_video_tags user_photos user_questions email

user_likes user_interests user_notes user_photo_video_tags user_photos user_questions email user_relationships user_relationship_details user_religion_politics user_status user_videos user_website

user_relationship_details user_religion_politics user_status user_videos user_website user_work_history user_location user_birthday friends_about_me friends_activities friends_birthday friends_checkins friends_education_history

user_birthday friends_about_me friends_activities friends_birthday friends_checkins friends_education_history publish_actions publish_stream friends_events friends_groups friends_hometown friends_interests friends_likes

friends_photo_video_tags friends_photos friends_questions friends_relationships user_actions:{app_namespace} friends_actions:{app_namespace} user_actions.music friends_actions.music friends_relationship_details friends_religion_politics friends_status friends_videos friends_website

read_insights read_mailbox read_requests read_stream xmpp_login ads_management manage_friendlists manage_notications user_online_presence friends_online_presence publish_checkins

Plugins SDKs Tools Graph API Open Graph

Plugins

Plugins

https://developers.facebook.com/docs/plugins/

Plugins

https://developers.facebook.com/docs/plugins/

Plugins: creation

Plugins: HTML & XFBML


<div class="fb-like" data-href="http://tripleodeon.com" data-send="true" data-width="450" data-show-faces="true" ></div> <html xmlns:fb="http://ogp.me/ns/fb#"> <fb:like href="http://tripleodeon.com" send="true" width="450" show_faces="true"> </fb:like>

<iframe>
<iframe src="//www.facebook.com/plugins/like.php? href=https%3A%2F%2Ffanyv88.com%3A443%2Fhttp%2Ftripleodeon.com &amp;send=false &amp;layout=standard &amp;width=450 &amp;show_faces=true &amp;action=like &amp;colorscheme=light &amp;appId=177774888997202" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:450px;" ></iframe>

SDKs

SDKs
https://github.com/facebook...

/facebook-js-sdk

/facebook-php-sdk

/facebook-android-sdk /facebook-ios-sdk

JavaScript
<div id="fb-root"></div> <script> window.fbAsyncInit = function() {FB.init({appId: 'APP_ID'});}; (function(d){ var js, id='facebook-jssdk', ref=d.getElementsByTagName('script')[0]; if (d.getElementById(id)) {return;} js = d.createElement('script'); js.id = id; js.async = true; js.src = "//connect.facebook.net/en_US/all.js"; ref.parentNode.insertBefore(js, ref); }(document)); </script>

JavaScript
FB.login(function(response) { if (response.authResponse) { console.log('Welcome! Fetching your information...'); FB.api('/me', function(response) { console.log('Good to see you, ' + response.name + '.'); }); } else { console.log('User cancelled login or did not authorize.'); } });

SDK is also used to support the plugins and (desktop) canvas apps

PHP
require_once("facebook.php"); $facebook = new Facebook(array('appId' => 'APP_ID', 'secret' => 'APP_SECRET')); $loginUrl = $facebook->getLoginUrl(array( 'scope' => 'read_stream, friends_likes', 'redirect_uri' => 'https://www.myapp.com/post_login_page' )); ... $user_profile = $facebook->api('/me'); echo "Name: " . $user_profile['name'];

App Manager

https://developers.facebook.com/apps

Editing App Settings

Tools

https://developers.facebook.com/tools/explorer

Graph API

Graph API
GET https://graph.facebook.com/738229837 { "id": "738229837", "name": "James Pearce", "first_name": "James", "last_name": "Pearce", "hometown": { "id": "106078429431815", "name": "London, United Kingdom" }, "location": { "name": "Palo Alto, California" ... https://developers.facebook.com/docs/reference/api/

Graph API
GET https://graph.facebook.com/738229837/checkins { "data": [ { "id": "10150835326849838", "from": { "name": "James Pearce", "id": "738229837" }, "message": "Warm and productive in London...", "place": { "id": "109599872410687", "name": "Facebook London"...

Graph API
$facebook->api('/738229837/checkins', 'POST', array( 'access_token' => $facebook->getAccessToken(), 'place' => '109599872410687', 'message' => 'Sitting at work', 'coordinates' => json_encode(array( ... )) ) );

FQL
SELECT name FROM user WHERE uid = me()

SELECT name, pic_square FROM user WHERE uid = me() OR uid IN ( SELECT uid2 FROM friend WHERE uid1 = me() )

https://developers.facebook.com/docs/reference/fql/

FQL
GET https://graph.facebook.com/fql? q=SELECT+name+FROM+user+WHERE+uid+=+me() &access_token=...

GET https://graph.facebook.com/fql? q={"friends":"SELECT+uid2+FROM+friend+ WHERE+uid1=me()", "my+name":"SELECT+name+FROM+user+ WHERE+uid=me()"} &access_token=...

https://developers.facebook.com/docs/reference/fql/

Open Graph

Open Graph

<head prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# castline: http://ogp.me/ns/fb/castline#"> <meta <meta <meta <meta <meta <meta property="fb:app_id" content="678678" /> property="og:type" content="castline:podcast" /> property="og:url" content="http://myapp.com/12345" /> property="og:title" content="My Podcast" /> property="og:description" content="Cool podcast" /> property="og:image" content="http://..." />

Open Graph

GET

https://graph.facebook.com/me/castline:listen_to? access_token=...

POST https://graph.facebook.com/me/castline:listen_to podcast=http://myapp.com/12345 access_token=...

Plugins SDKs Tools Graph API Open Graph

Thanks

Jonathan Matus Christine Abernathy

You might also like