devcon 2010 - facebook apps development for asp.net devs
Post on 06-May-2015
9.896 Views
Preview:
TRANSCRIPT
DevCon 2010Hyderabad │ 24th October
Facebook apps development for web devs
Krishna Chaitanya T │ Future Web Research Lab, SETLabs, Infosys
Overview of Facebook platform & the social web
The Facebook Graph API
Getting started with Facebook apps
How Facebook Authentication works (C# demo)
JavaScript SDK & Social plugins
S E S S I O N A G E N D A
DevCon 2010Hyderabad │ 24th October
Facebook.com
DevCon 2010Hyderabad │ 24th October
More than 500 million active users, 150 million mobile users Over 900 million objects that people interact with (pages, groups, events) More than 1 million developers & 555,000 apps … More Social Graph – A graph that connects people & things they care about
FB Platform – Set of APIs & tools to integrate with social graph. Available for websites, apps on Facebook, mobile apps
Personalized experiences. Ex: Docs.com
OVERVIEW
DevCon 2010Hyderabad │ 24th October
Provides consistent view of FB social graph Every object in the social graph has unique ID Query: https://graph.facebook.com/[ID or UserName] All objects are accessible similarly & all responses are JSON objects
Object for MUGH group: http://graph.facebook.com/themugh Picture of Bill Gates: http://graph.facebook.com/billgates/picture
Connections: Relationships b/w objects(requires authentication) Query: https://graph.facebook.com/ID/CONNECTION_TYPE
Friends: https://graph.facebook.com/me/friends?limit=15 Books: https://graph.facebook.com/me/books People attending DevCon: https://graph.facebook.com/152359924805795/attending
Facebook Graph API
DevCon 2010Hyderabad │ 24th October
Register your facebook app Specify canvas page & canvas URL (can use http://localhost during dev) The App Id is “client_Id” & App Secret is “client_secret”. We’ll use this later.
Choose “Canvas Type” as “Iframe” or “FBML” and save changes. Host your app at canvas URL and test. (The demos here use “Iframe”)
Getting started with FB apps
DevCon 2010Hyderabad │ 24th October
FB uses oAuth 2.0 protocol for authentication. Authorized requests to Facebook require access token . Here are the steps to make
authorized requests:
1. Redirect to https://graph.facebook.com/oauth/authorize? client_id=...&
redirect_uri=http://www.example.com/oauth_redirect 2. User authorizes-> FB redirects to “redirect_uri” with the parameter “code”3. Extract the “code” & redirect to:
https://graph.facebook.com/oauth/access_token? client_id=...& redirect_uri=http://www.example.com/oauth_redirect& client_secret=...& code=...
4. From the above request, Facebook returns “access_token”. Use this to make authorized requests like :
https://graph.facebook.com/me?access_token=...
Facebook Authentication
DevCon 2010Hyderabad │ 24th October
DEMO: Making Facebook oAuth handshake using C#
DevCon 2010Hyderabad │ 24th October
Simplifies authentication process without worrying about oAuth handshake. Enables all features of Graph API via JavaScript
The SDK is open source and is available on GitHub. API is initialized like this:
FB.init({appId: 'your app id', status: true, cookie: true, xfbml: true}); Subscribe to events, trigger UI interactions, make calls to Graph API.
Social plugins: Embeddable social features to integrate into your site, single line of code.
Extensions of facebook, ensure data is not shared hosted sites Login button, Like box, Like button, Comments, Activity feed, Recommendations,
Live stream & FacePile.
JavaScript SDK & social plugins
DevCon 2010Hyderabad │ 24th October
DEMO: Creating Facebook app with JavaScript SDK & jQuery
DevCon 2010Hyderabad │ 24th October
Facebook Docs http://developers.facebook.com/docs/
Facebook C# SDK http://github.com/facebook/csharp-sdk
Facebook JavaScript SDK http://developers.facebook.com/docs/reference/javascript/
RESOURCES
DevCon 2010Hyderabad │ 24th October
Twitter: @novogeek │ Blog: www.novogeek.com
DevCon 2010Hyderabad │ 24th October
Demo Facebook app: http://apps.facebook.com/devcon-app
top related