Facebook App Development
Jason Bouffard - @jpb0104 *
Facebook App Development
- Tabs and Apps
- SDKs
- Graph API
- FQL
- Tools
- True Blood
Why Facebook?
facebook.com/cocacola
Why Facebook?
Why Facebook?
What's changed?
- No more FBML apps
- iframes
- Graph API
Apps & Tabs *
- Both are actually apps
- Both are iframes
- Tabs 520px wide, apps 760px wide
- Tabs live on fan pages and user profiles
- Most Facebook techniques used on apps and tabs can be used on a site outside Facebook
- Think single page apps. Client side navigation and templates.
- One entry point.
PHP SDK *
- FQL and Graph API calls from the server
- Most code samples in the official docs are in PHP
- Signed Request *
- User info, locale, country
- App Data
- Information about the page, if a user is accessing you app through an iframe page tab. Liked or not. If they are the admin.
JavaScript SDK *
- Authentication
- Client side API and FQL calls
- Enables use of XFBML
- Dialogs *
Permissions *
- During authentication ask users for specific permissions
- Only ask for what you need
- user_about_me, user_likes
- friends_about_me, friends_likes
- Other permissions like publish_stream and offline_access
Development Environment
-
Same techniques you use to develop web apps
- Firebug, Chrome Developer Tools
- Use your hosts file to point your app domain to your dev server
- Facebook doesn't care where your server is
Graph API - Features *
- simple, consistent view of the Facebook social graph
- people, photos, events, and pages and the connections between them
-
- friend relationships
- shared content
- photo tags
- and more...
"At Facebook's core is the social graph; people and the connections they have to everything they care about."
Graph API - Unique ID
Every object in the social graph has a unique ID.
https://graph.facebook.com/ID
Users,
pages,
events,
groups,
applications,
status messages,
photos,
photo albums,
videos,
notes, and
checkins
Alternatively, people and pages with usernames can be accessed using their username as an ID.
Graph API - /me
Additionally, there is a special identifier me which refers to the current user. So the URL https://graph.facebook.com/me returns the active user's profile.
Graph API - Connections
All of the objects in the Facebook social graph are connected to each other via relationships.
https://graph.facebook.com/ID/CONNECTION_TYPE
Friends,
news feed,
profile feed (wall),
likes,
movies,
music,
books,
notes,
photo tags,
photo albums,
video tags,
video uploads,
events,
groups,
family,
and checkins
Graph API - Pictures
You can render the current profile photo for any object by adding the suffix /picture to the object URL.
You can specify the picture size you want with the type argument, which should be one of square (50x50), small (50 pixels wide, variable height), and large (about 200 pixels wide, variable height)
People,
events,
groups,
pages,
applications, and
photo albums,
Graph API - Introspection
The Graph API supports introspection of objects, which enables you to see all of the connections an object has without knowing its type ahead of time.
https://graph.facebook.com/ID?metadata=1
Page metadata
Graph API - Search
You can search over all public objects in the social graph with https://graph.facebook.com/search.
https://graph.facebook.com/search?q=QUERY&type=OBJECT_TYPE
FQL - Facebook Query Language *
facebook.com/TrueBlood *
True Blood - Server-side
- Faked deep linking with Signed Request's app_data param
HTTPS
- Plan for HTTPS support
- October 1st, 2011 all canvas apps must support SSL
OAUTH 2.0 *
- July 20th, 2011 - Updates to the PHP and JS SDKs available that use OAuth 2.0 and have new cookie format (without access token).
- September 1st, 2011 - All apps must migrate to OAuth 2.0 and expect an encrypted access token.
Some topics we missed today
- Facebook Credits *
- Facebook apps on mobile platforms *
- Insights - Facebook's analytics *
- Open Graph Protocol *
And remember play by the rules
-
Read and understand platform policies. Facebook will pull your app.
- Policy *
- Policy check list (pdf) *