Programming with Facebook, Mobile, and HTML

The most standard way that you can write your code once and have it work across multiple devices is by using HTML5. In fact, you can even use platform environments like Appcelerator's Titanium to build your application in simple HTML and JavaScript and have the platform compile to native iOS or Android code. Whatever way you choose to develop your mobile app using HTML, you'll find that integration with Facebook on mobile devices is similar to the way that you build any traditional Web app with Facebook.

To get started, you need to know some basic things that may make this experience just slightly different than a traditional Web app:

  • FB.ui does not seem to work well on mobile devices. Instead, redirect to a dialog box URL.
  • For dialog boxes, use the “wap” or “touch” display types to indicate that you want to format the experience for a mobile device.
  • Be sure that you're formatting the rest of your user experience to be the exact height and width of the device you're building for. Frameworks like Titanium can make this process fairly simple.

To build the basics of your Web application, you need some simple scaffolding to initialize your Facebook JavaScript SDK libraries and allow you to make calls to get data about the user. That simple code looks like this:

<html> <head> <title>Sample HTML App</title> </head> <body> <div id="fb-root_25_chapter-13"></div> <script src="http://connect.facebook.net/en_US/all.js" /> <script> FB.init({ appId:'APP_ID_GOES_HERE', ...

Get Facebook® Application Development For Dummies® now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.