How to Create OpenSocial Application – Part 1

Good or bad, I got bitten by opensocial bug few weeks ago. I don’t remember how it started. May be some article praising the virtues of opensocial. Few months ago, Orkut announced that it was implementing opensocial few months ago. I didn’t pay much attention then. Three weeks ago, I wanted to try it out. I started my journey to develop an application for Orkut.

I haven’t coded for many months. I wanted some tips to start with. My first stop was OpenSocial Articles. This page from Google is a good starter for anyone that wants to develop opensocial applications.

Caveat: If you are new to web development OR never worked in object oriented programming and XML, none of these articles is going to help you. You need basic understanding of OOP, XML, Javascript and web development.

Google made it somewhat easy with the tutorial to develop an application that gives “gifts” to your friends. There is also a video tutorial in this page that could walk you thru.

Just reading the tutorial or watching the video was not enough. I wanted to try it out. I had to apply for an account in to build the application for Orkut. Now, you don’t need to apply for an account. If you have an Orkut account, you automatically have permission to play in sandbox. If you are puzzled about what is sandbox, click here to learn more.

My application for Orkut sandbox was approved in a day. I was very excited when I saw the approval email. By that time I read the gifts tutorial few times. Still, I was not very clear about many concepts of opensocial. Hello World application (in seemed to be pretty easy and doable. This tutorial page didn’t mention anything about a wonderful application called “Code Runner”.

I came to know about Code Runner from a group discussion. This is a good application to play with the code and see the results instantly. You don’t need to save your code in your server to test the sample applications like Hello World. If you want to install Code Runner in your sandbox, go to Orkut applications directory and search for “coderunner”. My initial instinct was to search for “Code Runner”. Orkut didn’t find that. You need to enter “coderunner” in the search box. If you want to save few seconds, you can use this URL to run the search query. Once you find the app, install it in your sandbox.

Code Runner application has text area where you can enter your code and click “Execute” button in the right top. Code Runner displays the default code to display your name. Don’t change anything in the box, just click “Execute” button, you will see your name in the black box below text area.

Click the image above to see it in full view.

When this code is executed, request() function is called. It makes initial opensocial data request for the “Viewer”. You are the viewer that views this application. So, the application requests information about you. Then it calls response() function with the resultant “data”. Once you get the data, you can do simple request like getData().getDisplayName() to get the application display your name.

When I wanted to know how this opensocial APIs work, my first thought was to check out the opensocial API specification. It was not very helpful to understand the basics. If you want to how the newDataRequest() function works and to see related material, check out OpenSocial Dev Guide. This gives you good intro about basics. Not much, but at least something to start with.

Google Gadget document will give you good intro about tags like Module, ModulePrefs, etc.,

Ok, now I got the Hello World application working. I also got the Code Runner to display my name correctly. Now, I want to test whether Code Runner can display my address/location correctly.

Part 2 | 3 | 4 | 5

Related Posts Plugin for WordPress, Blogger...
Bookmark and Share
Tagged on: , , ,

Leave a Reply

Your email address will not be published. Required fields are marked *