At the Forge - OpenSocial and Google Gadgets

Thinking about developing an OpenSocial application? First, you'll need to understand Google Gadgets.

The past few months, I've written about the Facebook API, which allows third-party developers to integrate their applications into Facebook. A large number of such applications exist already, and more are being created and released every day.

However, Facebook isn't the only social-networking site out there. Indeed, Facebook isn't even the largest social-networking site—although it is the fastest-growing and seems to have a great deal of momentum. This is due in no small part to developers' ability to create and integrate new applications into Facebook. And, although most Facebook applications are (I think) pretty silly, that hasn't stopped people from trying them and even using them on a regular basis.

Facebook's offer of a developer API definitely was a good thing for Facebook users. But, it was bad news for at least three other groups of people. First, users of other social-networking systems suddenly were faced with the prospect of using a less-popular system. (In the world of social networking, a less-popular system also is less desirable.) Second, the people running non-Facebook social-networking sites, such as LinkedIn and MySpace, suddenly were faced with the prospect of their users leaving for Facebook. Finally, software developers began to look at Facebook as the most-desirable platform for which they should develop, because it had the largest user base. Even if one or more of the competing sites were to unveil an API, and even if it were as rich as the Facebook API, it probably wouldn't reach enough users to make the doubled effort worthwhile.

So, I was fascinated to learn, via Marc Andreessen's blog, that a number of social-networking sites were responding to Facebook in a way that satisfied all three of these populations. They announced an API that would allow an application to work across many different social-networking sites. This API, known as OpenSocial, can be added to any site (“container”) or application. If you write a Facebook application, it'll work only on Facebook. But, if you write an OpenSocial application, it'll work under Ning, MySpace, Orkut and nearly a dozen other systems.

Of course, OpenSocial isn't exactly the same as the Facebook API. And, in fact, it has some disadvantages when compared with the Facebook API. Also, as I write these words in mid-December 2007, OpenSocial still is stuck in an early beta release.

However, OpenSocial is interesting from a few perspectives. First, it's an interesting shot across Facebook's bow, and one that deserves our attention, if only because it demonstrates the lengths to which companies now will go to attract developers and users. But, it's also interesting because it's the first application standard I can think of that is based on HTTP, JavaScript and HTML. That is, I believe OpenSocial is the first Web development API that is completely client-side, rather than server-side. If nothing else, this shows how important JavaScript has become to Web developers.

This month, we start looking at OpenSocial from the perspective of an application developer. OpenSocial builds on work done at Google; thus, it's based on several technologies developed at Google, including Google Gadgets. So, let's begin our discussion of OpenSocial by looking at Google Gadgets and how we can create and use them. Next month, we'll look at how to turn a simple gadget into a social gadget and connect it with OpenSocial containers.

Google Gadgets

An OpenSocial application is, at heart, a combination of XML and JavaScript, using a special version of Google Gadgets. The code is written in JavaScript, and preferences and guidelines for the gadget are set using XML. The simplest possible gadget, taken from Google's on-line documentation, is the following:

<?xml version="1.0" encoding="UTF-8" ?>
  <ModulePrefs title="Hello world" />
  <Content type="html">
       Hello, world!


The above gadget, as you can imagine, doesn't do very much. The first line shows that it's an XML document and that it's encoded using UTF-8. This means we can write gadgets in any language we like, and they should work correctly. The gadget is then contained inside <Module> tags, apparently because gadgets were called modules when they were under development. The content of a gadget sits inside a <Module>.

There are three potential sections inside a gadget:

  • ModulePrefs: defines the settings for a particular gadget.

  • Content: contains the HTML that is displayed for the user, as well as any JavaScript code with which the user will interact.

  • UserPrefs: used to store user preferences.

The above test gadget doesn't contain any UserPrefs, and its Content section contains only HTML, but it still is valid.

To see this gadget in action, you need to create an iGoogle page. This requires having a Google login. (I'm familiar with the privacy concerns that are increasingly raised about Google. OpenSocial will not be tied to Google; thus, it doesn't require a Google login. However, for the time being, it's easiest to create a gadget for an iGoogle page.) Go to your personal iGoogle page:

On the right side of the screen is a link called Add stuff. This is how you add new gadgets to your personal iGoogle page. By default, it shows the most popular gadgets, and you're obviously welcome to add as many or as few of these gadgets as you want. However, if you're going to be developing gadgets, add the My Gadgets gadget, which gives you some additional control and functionality. Use the search box to find My gadgets, and when you find it in the search-result listing, click on the add it now link. You will be brought back to your iGoogle page, with this new gadget now available.



Comment viewing options

Select your preferred way to display the comments and click "Save settings" to activate your changes.


amol's picture

Thanks the article was really insightful