Pin Me

How to Create a Facebook Application

written by: S. R. Obbayi•edited by: Amy Carson•updated: 11/5/2010

Have you ever wondered how to create a Facebook app and felt that it must be a complicated multi-step process? It's not so, and this guide will demystify this notion and point you in the right direction.

  • slide 1 of 4

    Getting Started

    Before you learn how to create a Facebook app, its good to understand what a Facebook app is. In simplest terms it's a web page that is viewed from within a particular section of the Facebook pages known as the canvas. You interact with your Facebook app using these points of integration:

    • Stream publishing – this is what you see whenever you log into Facebook
    • Requests – this is how users invite their friends to use a certain Facebook app
    • Bookmarks and Counters – automatic links to your Facebook app
    • Profile tabs – these are dedicated tabs on profile pages of which the contents must come from your canvas URL.
    • Like button – used for sharing your app content

    I am going to assume you already know how to create an HTML document and therefore focus on the integration parameters which are required to get your Facebook app talking with Facebook.

  • slide 2 of 4

    Registration And Integration

    Once you have an idea for a Facebook app you will then need to register and integrate it with Facebook. You do this by going to this link and filling out the web form provided. Descriptions of each field are provided.

  • slide 3 of 4

    Creating The Facebook App

    First facebook app hello world Facebook provides template code which you can copy and paste into your app to get some common desired features into your Facebook app. Now even though putting up a web page may be simple, building a Facebook app in itself can be quite lengthy due to the extensive Facebook APIs which require in depth reading into and is well beyond the scope of this tutorial.

    In this example we create a very basic Facebook app which will not do much other than display text on the Facebook canvas. You will need to create an HTML document with the following content.

    <html>Hello World, from Sobbayi</html>

    call it something like index.html and place this file on your server in a folder created for your Facebook app so that you can access it via a link like this.

    http://www.yourserver.com/your_app_folder/

    Pass that link to the Canvas URL field on the Facebook Create App form under the Facebook Integration Tab. Other files you may want to create are the ones for terms and conditions of your Facebook app and for the privacy policy of your Facebook app. This can be done under Web Site Tab. For learning purposes you can use the same file you created above.

    Once you pass the URL, give your app a name and fill the details on the Facebook form. You will then be able to access your app using a link similar to this.

    http://apps.facebook.com/your_app_name/

    Your should see something similar to the illustration above. I named my Facebook app appbinoo.

    Depending on what fields you filled in on the Create Facebook Apps Form, your app should be available in different sections of Facebook as described above in the list of points of integration. Believe it or not, that is all it takes to make a valid Facebook app.

  • slide 4 of 4

    Finally

    Facebook apps carry a purpose and personality traits. A Facebook app like the one we just created will be of no use. To make useful apps for Facebook you need to have some level of integration such as allowing users to log into the app, allowing the app to access user data so on. Now this is a very extensive topic that cannot be covered in detail in one or even two articles.

    The Facebook developer page has got plenty of examples that give you documentation on how to use the Graph API and it provides some Software Development Kits (SDK) for various programming languages since developing interactive Facebook apps varies depending on the language you choose to develop in. A good place to start getting your hands dirty on the Facebook platform is the Facebook developer documentation. There you will fast resources to get you up to speed on the Facebook platform and how to create Facebook apps.

    You may find some addition web development resources to help you such as the best resources for web design elements and a list of the top ten xHTML authoring tools.