28 Sep 09 How-To: Develope Facebook Application for Begineers

With more than 300 million active users and 50% of them using it every day (source), Facebook can be an interesting way to make some viral marketing.

One of the most effective ways is developing an application users (and users friends – and friends of users friends – and…) will use every day.

This tutorial will guide you through the creation of a simple application that will display how many male and female friends do you have.

Requirements

To develop a Facebook application with this tutorial, you will need:

* An active Facebook account
* An hosting plan supporting php

Getting started

Go todevelopers areaand click on Set Up New Application

Give a name to your application and agree terms.

Then, Facebook will create an API key and a secret key. Write them down (well, it’s not necessary since you will always find them in this page, but having something to write down makes me feel like I’m dealing with something important).

At this time the application is ready to run, but you can add more information and icons.

When done, go toCanvaspage

Here, you will b asked for aCanvas Page URLthat is the unique url of your application. Being obviously unique, all best names have been already taken (just like.comdomains). InCanvas Callback URL, you have to enter the URL of the page on your server that will host the application. Then setRender MethodtoFBML

FBMLmode lets you quickly start building an application from scratch, which is good for a absolute beginners. We’ll see it more in depth during next tutorials

At this time your application is ready to be executed.

Download the client libraryand copy the content offacebook-platform->phpto the Facebook application directory in your server – the same path ofCanvas Callback URL.

Your directory now should look like this:

Now, t’s time to create the application itself:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35

<?php

require_once ’facebook.php’;

$appapikey = ’xxxx’;
$appsecret = ’xxxx’;

$facebook = new Facebook($appapikey, $appsecret);

$user_id = $facebook->require_login();

$friends = $facebook->api_client->friends_get();

echo "<p>Hello <fb:name uid=’"$user_id’" useyou=’"false’" linked=’"false’" firstnameonly=’"true’"></fb:name>, you have ".count($friends)." friends";

foreach($friends as $friend){
     $infos.=$friend.",";
}

$infos = substr($infos,0,strlen($infos)-1);

$gender=$facebook->api_client->users_getInfo($infos,’sex’);

$gender_array = array(); 

foreach($gender as $gendervalue){
     $gender_array[$gendervalue[sex]]++;
}

$male = round($gender_array[male]*100/($gender_array[male]+$gender_array[female]),2);
$female = 100-$male;

echo "<ul><li>Males: $male%</li><li>Females: $female%</li></ul>";

?>

Line 3: including Facebook library

Lines 5-6: Declaring variables with API key and secret code… yes, the two codes seen before

Line 8: Initializing a Facebook API

Line 10: Requiring the user to be logged into Facebook before using the application. If they are not logged in they will first be directed to a Facebook login page and then back to the application’s page. Then save the user unique id into$user_idvariable

Line 12: Storing in the$friendsarray the unique id of all friends of yours

Line 14: This is the firstFBMLtag we see:Fb:namerenders the name of the user specified byuidattribute. In this case, it will display your name. More information aboutFb:nameatthis page. You can see all available tags atthis page

Lines 16-20: Creating a string with all of your friends ids separated by comma, such asuid1,uid2,uid3,...,uidn

Line 22:users_getInforeturns a wide array of user-specific information for each user id passed. As you can see, I pass the whole list of friends and I only want to know their sex. More information aboutusers_getInfoatthis page

Line 24: Creating an array where I will store all genders

Line 26-31: Determining the % of each gender (male or female) in my friends list. You can see some additional math becausesexvalue can be blank

Line 33: Displaying the results

Now that your application is completed, you can submit it to the Application directory. Before you are able to do it, your application must have at least 5 total users or 10 monthly active user.

Take a look at the “finished” application.

It should output something like that

Hello Kirenia, you have 49 friends
Males: 53.66%
Females: 46.34%

Warning: During the latest day there is a known bug calledfacebook auth_token loopthat won’t allow you to run the application. If you experience problems, simply check back later.

Related Posts

1. Facebook Integrate With WordPress
2. 20 Tips and Tricks for Facebook
3. Voice Chat On Facebook Is Coming Soon
4. Getting the application URL
5. LogMyTask: Web-Based Time Tracking

Tags: application, facebook