facebook developer garage cyberjaya

29
Intro to facebook Platform Presented by Mehedi Hasan Sumon E-mail: [email protected]

Upload: mehedi-sumon

Post on 09-May-2015

5.967 views

Category:

Technology


3 download

DESCRIPTION

Facebook Developer Garage CyberjayaIntro to Facebook Platformby : Mehedi Hasan [email protected]

TRANSCRIPT

Page 1: Facebook Developer Garage Cyberjaya

Intro to facebook Platform

Presented byMehedi Hasan Sumon

E-mail: [email protected]

Page 2: Facebook Developer Garage Cyberjaya

What is Facebook Platform?

• The "Facebook Platform" is a set of application programming interfaces (APIs) and services provided by Facebook which makes this information available to Platform Applications and allows Facebook and third-party developers ("Developers") to develop new features and applications that we hope will enhance your ability to interact with people in your life in new and interesting ways.

Page 3: Facebook Developer Garage Cyberjaya

This is example of a facebook app

Page 4: Facebook Developer Garage Cyberjaya

Points of integration

• When we create an application for the Facebook Platform, we can integrate it at several points in the framework.Display in the Application directory.Provide an About page.Display inside Facebook Canvas Pages.Display at Left Navigation PanelDisplay a Profile PageAccess and post to News Feed.

Page 5: Facebook Developer Garage Cyberjaya

Display in the Application directory

MySimplifieds app is in application

directory

Page 6: Facebook Developer Garage Cyberjaya

Provide an About page

Abut Page of mySimplifieds

Page 7: Facebook Developer Garage Cyberjaya

Display inside Facebook Canvas Pages

Canvas Page of mySimplifieds

Page 8: Facebook Developer Garage Cyberjaya

Display at Left Navigation Panel

Profile Box of mySimplifieds

Page 9: Facebook Developer Garage Cyberjaya

Display a Profile Page

Profile Page ofmySimplifieds

Page 10: Facebook Developer Garage Cyberjaya

Invite friends

Invite Page of mySimplifieds

Page 11: Facebook Developer Garage Cyberjaya

Access and post to News Feed

News Feed Example

Page 12: Facebook Developer Garage Cyberjaya

Facebook web application model

Page 13: Facebook Developer Garage Cyberjaya

Facebook web application model

• Facebook applications are not installed directly onto the Facebook server. Instead, they are placed on the developer’s server and then called by Facebook when the application URL is requested.

• To interact with applications, Facebook uses a callback metaphor. It will use a registered URL associated with the application.

• in Facebook. When the Facebook application URL is requested, Facebook redirects the request to the APP server. Then the APP will processes the request, communicates with Facebook.

Page 14: Facebook Developer Garage Cyberjaya

Facebook platform elements

• The Facebook API• FBML – Facebook Markup language• FQL – Facebook Query Language• Facebook JavaScript

Page 15: Facebook Developer Garage Cyberjaya

Facebook API

• The Facebook API is a Web services programming interface for accessing core services (profile, friends, group, event, photo) and performing other Facebook-centric functionality (log in, redirect, update view). The API is based on a REST-based architecture. Facebook officially supports client libraries for PHP and Java.

• Several unofficial client libraries have been developed for most every major Web programming language, including ASP.NET, ColdFusion, C++, Python, Ruby on Rails, VB.NET.

Page 16: Facebook Developer Garage Cyberjaya

Facebook Markup Language

• Facebook Markup Language (FBML) is an HTML-like language used to display pages inside of the Facebook canvas. Here are three basic facts about FBML:FBML contains a subset of HTML elements. FBML provides qualified support for script and

style elements.

<p>Your name is: <fb:name uid=”665127078” useyou=”false”/></p>

Page 17: Facebook Developer Garage Cyberjaya

Facebook Query Language

• Facebook Query Language (FQL) is a SQL-based interface into Facebook data. You can access many Facebook database tables, including user, friend, group, group_member, event, event_member, photo, album, and photo_ tag.

$friends = $facebook->api_client->fql_query(“SELECT uid, name FROM user WHEREuid IN (SELECT uid2 FROM friend WHERE uid1=$user)”);

Page 18: Facebook Developer Garage Cyberjaya

Facebook JavaScript

• FBML does not support the use of standard JavaScript using the script element. However, Facebook JavaScript (or FBJS, for short) allows for limited scripting functionality inside a Facebook application. But Facebook JavaScript does provide AJAX and Facebook dialog objects for developers to take advantage of.

Page 19: Facebook Developer Garage Cyberjaya

Developer centerson Facebook.com

• facebook.com/developers is the “home base” for Facebook developers.

• developers.facebook.com is the official documentation center for Facebook Platform developers.

• wiki.developers.facebook.com is a user-based Facebook developer’s Wiki, providing documentation, FAQs, sample codes.

Page 20: Facebook Developer Garage Cyberjaya

Developing your first Facebook application

Page 21: Facebook Developer Garage Cyberjaya

Registering an Application

• Go to www.facebook.com/developers

Page 22: Facebook Developer Garage Cyberjaya

Registering an Application

• Click the Set Up New Application button.• Enter the name of your application in the space provided.

Page 23: Facebook Developer Garage Cyberjaya

Registering an Application• Click the Optional Fields link to display several more settings

Page 24: Facebook Developer Garage Cyberjaya

Registering an Application

• Add an e-mail address that you want to use for technical support issues.

• In the Callback URL field, enter the base URL for your application.

• In the Canvas Page URL field, enter the subfolder name that you would like to request for your Facebook application.

• Select the Use FBML and Website option button• In the Side Nav URL field, enter the canvas page URL of your

application. E.g.: (http://apps.facebook.com/yourapp)• Click the submit button, you will get the API Key and secrete,

save them for next step.

Page 25: Facebook Developer Garage Cyberjaya

API key and Secret

Page 26: Facebook Developer Garage Cyberjaya

Creating a Simple Facebook App• Download the client library files of your programming language from the

My Applications page (facebook.com/developers/apps.php).• Uncompress the downloaded file and copy the client library files via FTP to

your Web server.• In your text editor, create a new file and save it as appinclude.php.

• On your Web server, create a new folder for your application.

<?phprequire once ‘lib/facebook.php’;$appapikey = ‘[your_api_key]’;$appsecret = ‘[your_secret_key]’;$appcallbackurl = ‘[your_web_app_url]’;?>

Page 27: Facebook Developer Garage Cyberjaya

Creating a Simple Facebook App• In your text editor, create a new file and save it as index.php

<h1> Sample Application</h1><?phprequire once ‘appinclude.php’;

echo “<p>Your User ID is: $user</p>”;echo “<p>Your name is: <fb:name uid=\”$user\” useyou=\”false\”/></p>”;

echo “<p>You have several friends: </p>”;$friends = $facebook->api_client->friends_get();echo “<ul>”;foreach ($friends as $friend) {echo “<li><fb:name uid=\”$friend\” useyou=\”false\” /></li>”;}echo “</ul>”;?>

Page 28: Facebook Developer Garage Cyberjaya

Creating a Simple Facebook App

• Save the file and copy it to the application folder via FTP on your Web server.

• Enter the canvas page URL for your application in your browser. (http://apps.facebook.com/dummies.)

• That’s all ….

Page 29: Facebook Developer Garage Cyberjaya

Thank You All

Email : [email protected] : mehedi895.wordpress.com