I had a really difficult time trying to develop a simple page on the Facebook platform. It demanded lots of time and effort. It was like i was in a whole new world of re-organised programming platform. Talk about Facebook Markup Language, Facebook Query Language, Facebook JavaScript, the API itself, etc.
You can get really knocked out as to why they have to define their own way for programmers to follow. But hey, i respect their architecture. You can't just play around with people's publicly personal accounts. (lol!!).
After about 3 weeks of battling with the platform, i finally got the modus operandi. As i always do, when i get knowledge, i share.
I've written this post to guide newbies (or dummies, if you're one) on how to create a Facebook Application.
As usual, i assume you already have some basic skills in programming especially Javascript, PHP, or even the ASP.NET languages (C#, VB.NET).
Ok, let's start. I'm going to do 6 things.
1. Briefly introduce you to the Facebook platform
2. Crawl with you through the pre-requisites
3. Walk you you through your application setup and settings
4. Run with you through an example code
5. Fly with you through 1 or 2 high level intricacies.
6. Kick you outta here to start your own application.
1. Intro
Facebook's developer platform enables developers to use any programming language to query their API via REST calls. As such, you can develop both desktop and web applications to do practically the same thing; update status, comment on status, view friend's profiles, it even goes to reading mails, uploading multimedia and send SMS. Awesome init?
2. Let's crawl
Of course, you need to have a Facebook account before you can develop/host your application on their framework. So, after you login, go to the bottom of the page and click on 'Developers'.
3. Walk with me:
Are you on the developer's page? Ok, now click on 'Start Building for your site'.
A wizard-like setup page appears. Enter your details as shown. Click 'Next Step'
You can safely ignore step 2 (Try it if you're that curious)
That's it.
Do you see a page similar to the one shown below?
Great!! Copy your API Key and Secret. They are the the lifeblood of your application. Click on 'Developer Dashboard'. Allow access to the next page. As you might a little confused, the page you are entering is in itself a Facebook Application. It is a sort of control panel for all your applications (yeah, i said applications; you can setup more than 1).
Ok, now click your application name. (shaded yellow in the image below)
The next page is the actual control panel for your new application.Click on 'Edit Settings'.
The next page presents you with a host of options. You can perform 1001 customizations on your application. Go through it, be curious!! One important page is on 'Canvas'.
The portions shaded yellow are those i deem important. The first textfield requires you to specify just a URL name for your application. The next textfield is where you have to enter the exact URL to your index page (e.g. http://www.mytextApp.com). This page would be automatically loaded to the Facebook platform when a user visits your application.
The next step is to specify the render method. As far as i know, Facebook renders your application as either iFrame or FBML. I like FBML;it enables you to use FBJS and FBML tags that would be intepreted and nicely rendered on your page. Read more
here. Save your changes.
4. Ready to run?
Honestly writing, the only example i got was on the main dashboard. Click on 'Back to my Applications' at the top. Scroll down and click on the hyperlinked text 'example code'.
This pops up a dialog containing PHP codes. Yipeeeee!! Are we done? NO!! When you inspect the code, do you see 'require_once facebook.php' and a line of code that reads $facebook = new Facebook($appapikey, $appsecret);
Where did they get that? It's a PHP client library and it's freeeee!!. You can get on the same page. Scroll down and click on 'Download the Client Library'.
What about .NET folks? Get yours here.
5. Let's fly
Be patient!! Facebook offers high-level security to their account holders. Before you can do anything, the user needs to grant permission for your application. That permission can either be temporal or permanent.
Let me explain.
Anytime a user visits your page, Facebook transfers a session ID to your application. You can use this to get user's status update, list friends, groups or events. You can even use this to access the user's account offline. However, the user again needs to grant that permission; and this means you have to save it to a database.
Read on permissions here.
Get more info on using session IDs here or there.
6. I encourage you to be more curious. Play with the platform. It's fun.