Facebook Pages for Business Tutorials | Web Page Design Tutorials Home

Building Canvas Facebook Apps

Part 2 - How it works

A Facebook Apps allows developer to use or integrate many features of Facebook, for example, News Feed, Notification, etc… Actually, all of the core Facebook Platform technologies are available to Apps on Facebook.

How Facebook Apps Works?

The concept is very simple.  The Facebook App simply loaded into a Canvas Page as shown in the diagram below:

Facebook Canvas Pages

In other words, the Canvas Page is a blank canvas within facebook that allow developers to run their own apps.

How Contents Load into Blank Canvas Page?

When a developer create a new app on Facebook Developer Center, he/she needs to provide a Canvas URL. The Canvas URL is actually a web page address hosting outside Facebook servers. This is the Canvas URL that makes up the contents of the Canvas Page. The process can be  illustrated in the diagram below:

How Facebook Canvas Apps Works

The Canvas URL may contains HTML, JavaScript, jQuery, PHP and CSS. In short, this is the Canvas URL that really make up the contents of Canvas Page, and thus the Facebook app. That’s why I like to use Facebook Canvas App rather than Facebook App.

The width of canvas is 760px by default by time of writting this tutorial.

Now we knows the basic concepts of how a Facebook app works. We can start creating a new Facebook app in the next tutorial.