Facebook Windows 8 HTML5 Sample

Windows 8 Store Apps written in HTML5 run in a special sandbox provided by WinRT and the Chakra rendering engine, establishing a security context where the application runs.

The Facebook JS SDK was created with a browser context in mind, so using it for a Windows Store App is not straight forward.

This sample shows an alternative way to work with Facebook APIs by using the Open Graph API. The sample showcases the following technical challenges:

  • Login
  • Showing profile information
  • Showing a page wall posts
  • Allow a user to like a wall post
  • Allow a user to comment on a wall post

With the sample, adding a facebook login button is as simple as:

<div class="loginButton" data-win-control="FacebookWinJS.Login" data-win-options="{appId: yourappid}"></div>

It also showcases some special Windows 8 scenarios such as:
  • Bing Maps integration (including walking directions)
  • Update a Live Tile with a profile information (coming soon)
  • Search content within the application (coming soon)
  • Share content throu the Share charms (coming soon)

 

The current drop holds two versions of the sample:

  • A basic version that uses a Facebook application to list the content of facebook page.
  • A full version including the use of Bing Maps sdk for positioning the restaurant in a map, and showing how to get there. See Developing a Windows Store App to learn how to use the Bing Maps AJAX Control to add Bing Maps to your Windows Store app.

Creating an app based on facebook APIs, usually requires you to create a Facebook Application.

By the way, the sample is based on my friends restaurnt GreenCurry. If you happen to be in Buenos Aires, make sure you pay them a visit! :)

Last edited Nov 26, 2012 at 7:59 PM by miguelsaez, version 9