facebook for web & mobile developers

   
David Aguilar - OC Dev
Nov. 7, 2013

developing with facebook


"Facebook offers tools, services and SDKs to developers who want to integrate social experiences into their apps."


platforms



what is offered?


  • Social Plugins
  • Facebook Login
  • Facebook API
  • Open Graph
  • and a lot more...


https://developers.facebook.com/

social plugins


  • Like Button
  • Share Button
  • Send Button
  • Follow Button
  • Embedded Posts
  • Comments
  • Activity Feed
  • Recommendations Box
  • Recommendations Bar
  • Like Box
  • Registration
  • Facepile

like button


"Let people share pages and content from your site back to their Facebook profile with one click, so all their friends can read them."


share button


"Give people more control over the content they share from your site. With the Share button users can write a customized message for the content they are going to share one their Facebook profile. They can select if they want to share with particular friends or with a group. Alternatively, they can share in a private message."

embedded posts


"Embedded Posts let you add any public post from Facebook to your blog or web site."


comments


"The Comments box lets people comment on content on your site using their Facebook profile and shows this activity to their friends in news feed. It also contains built-in moderation tools and special social relevance ranking."


facebook login


"Facebook Login is a personalized and secure way for people to sign in to your app. iOS, Android, JavaScript and PHP SDKs are available to speed up the registration process and build a functional login system in minutes."


permissions



By default, Public Profile and Friend List are accessible. Everything else needs to be requested thru the Login dialog.

login dialog


"The Login dialog creates a trusted link between you, people using your app and their info. It displays consistent messaging across all devices, enabling apps to request permissions anywhere."

login process


  • Determine whether someone is already logged in
  • If they aren't logged in, prompt them to do so
    (with the Login dialog)
  • Exchange secure codes to confirm identity
  • Generate an access token

app setup




scenario #1


scenario #2


user registration flows





https://developers.facebook.com/docs/user_registration/flows/




demo

facebook api


  • Core methods
  • Auth methods
  • Event handling
  • XFBML
  • Canvas methods

core methods


  • FB.api - Make an API call to the Graph API
  • FB.init - Initialize the library
  • FB.uiMethod for triggering Dialogs as popups,
    modal dialogs or as full pages

auth methods


  • FB.getAuthResponse - Synchronous accessor for
    the current authResponse
  • FB.getLoginStatus - Find out the current status from
    the server, and get a session if the user is connected
  • FB.login - Login/Authorize/Permissions
  • FB.logout - Logout the user in the background

event handling


  • FB.Event.subscribe - Subscribe to a given event
    name, invoking your callback function whenever
    the event is fired
  • FB.Event.unsubscribe - Removes subscribers,
    inverse of FB.Event.subscribe

xfbml


canvas methods


Too many to list... Go here:

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

:)




demo

open graph


"Help people tell rich stories on Facebook from your app through a structured, strongly typed API."

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

mobile


  • iOS SDK for Developers
  • Android SDK for Developers

(Other platforms can use WebViews and the JavaScript SDK)

facebook sdk for ios


  • Facebook Login
  • API Queries
  • Mobile App Install Ads
  • Sharing and Distribution
  • Uses native Facebook app for Login
    (rolls back to WebView login if error)


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

facebook sdk for android


  • Facebook Login
  • API Queries
  • Mobile App Install Ads
  • Sharing and Distribution
  • Uses native Facebook app for Login
    (rolls back to WebView login if error)

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

facebook connect plugin
for phonegap




https://github.com/phonegap-build/FacebookConnect/

app setup



code samples





https://github.com/davidraguilar/facebook-for-web-and-mobile-developers

thank you




David Aguilar
david@dcfusion.com
@davidraguilar
Made with Slides.com