Web 2.0 To My Liking

Gspace firefox extension - Gmail as your storage device

2008-07-11T12:26:00.005+05:30

After series of wild click stream,I found myself on firefox addons page and like every time I was wondering/gaping at the versatility of the firefox platform. The plugins architecture, means to build those et al.Anyways I found Gspace which helps you convert your gmail account into a online file system,now I knew of such utilities on windows but I seldom use windows and hence moved on.Being able to do so from a browser truly is Web 2.0 and pwnage of Desktop as platform.You'll need to install the add on like any other add on and restart your firefox upon which you see the status pop up window icon in the status bar. You can register your gmail accounts with Gspace from manage accounts and create directories (This does not actually create a directory on gmail server, rather its a internal way to simulate filesystem using subject field of the emails). After dealing with account registration you move on to Tools->Gspace which should open a new Window (can also be reached by typing chrome://gspace/content/gspaceWindow.xul on ff2) here you can upload files to the simulated directories which after complete transfer appear in your gmail account as a mail from yourself, Its best to filter these mails and apply a label to it.
Other cool features include ability to stream music from your gmail account right into browser using the google flash player, also you can view photos. This you choose in File Transfer Mode in tools->Gspace.

Tips And Tricks:

Do not upload more than 500 files a day, may result in temporary ban from google, which can be upto 24 hrs
Its best to create a new gmail account to keep all your files at one place, also in case you DO suffer a ban, it doesn't block your daily mails and primary gmail id
I have already mentioned filtering Gspace Mails eh ?
Do not even try to store files weighing more than 20 megs, you are wasting your bandwidth, google bounce mails with attachment over 20 mbs
Share account with trusted friends to save network resources (like in case of music)

Disclaimer : Its not supported/endoresed by google but a individual innovative hack and hence do mind the 24 hrs block and check your daily transfer to google.

Google Appengine

2008-07-10T13:10:00.001+05:30

Google launched a application engine for web application developers to take advantage of the "Google" Infrastructure. This would mean that application programmers can now write engaging applications without worrying about hosting, responsiveness and all other maintenance related issues, Ah but there is a catch!! you qualify as a developer if you can read and write python, which is a interesting and fun to learn language but it also means that you are supposed to throw all that PHP, Perl, Java experience in trash and come unto Lord's feet. Appengine comes preloaded with django 0.96 which is a powerful python web framework quite popular for its clean implementation of MVC, but you can also upload and use a different framework best suited for your application. Appengine comes with a admin panel for each application where it shows many statistics about data transfer, url's visited, popular url's etc. Google Appengine is an attempt to answer Amazon's EC2 and S3 if at all its an attempt to answer anything. Amazon webservices on the contrary are not free but support any framework/language, where S3 is more like a data grid independent of EC2.
Some Facts and Figures About Google Appengine:

3 Apps per developer
limit of 1000 files each being maximum of 1 mb although limit on overall application storage is 500 megs :P
In and out Data transfer of 10,000 megs each per day
2000 e mails per day
650,000 Http Requests per day
CPU limit of 200,000,000 Mega Cycles per day
GQL (read SQL for Google data store) is used which do not use joins, hence is the structure of Big Table (Google Technology to store data in database) but you can do all you would want to do with joins and also get the performance which SQL joins suck out of your applications.
User System is based only on Google Accounts, which means if someone needs to access a user specific feature, then he/she needs to authenticate with his/her google account.
Type of Content hosted/served is bounded by Terms of Service
Not all python libraries are supported, A full list can be found out here

So all get started . Well not all, but those of you who can talk python . There has been demand in past that google provide hosting on its reliable and bleeding edge infrastructure, but this was not what we expected .

Drupal 6.0 is a beast

2008-02-13T20:46:00.003+05:30

Drupal 6.0 was released an hour ago today and Damn !! its a beast ... Drupal 6.0 improves on theming part, allowing you to start with a HTML template of ur choice.There is a new theme developer module to assist you in theming, I have no doubt 7 will bring MVC completely and we can finally get rid of PHP and my colleague (Designer) would stop yelling for me :). Drupal 6 is super funkier with Drag and Drop menu's,book pages and lotsa jQuery.Performance and optimization is noteworthy and interesting to watch for, I am particularly looking forward to Batch API.Action triggers,one click install,security,performance,AJAX are some buzz words which will describe drupal 6.
Oh I am gonna drink to Drupal 6.0 and my time in irc's ... And post drinking will install D6 and play a little.More on Drupal 6 soon as I am lucky enough to taste it as part of my job.

BTW for a comprehensive and more authentic gene story of drupal 6 read Drupal 6 released

Friendfeed -- Another webapp with a promise

2008-02-12T15:37:00.004+05:30

Friend Feed is a web 2.0 aggregator which tracks your activities on social media sites,blogs and present as a single feed, You can also track what people are doing on web 2.0, subscribe to your friend's feed
and then his activities start showing up on friend feed, although you always have option to see your own isolated field at My feed.Friendfeed also have a concept of imaginary friend which you can create if you know username/id of that person on any of the services supported by friendfeed. John resig is my imaginary friend as I know his twitter username :) (Oh, yeh I am digging him lately). Friend feed create a unique url for that imaginary friend in web 2.0 space.

27 services are supported by Friend feed currently

You also can share links from friend feed page via share link widget, I normally use it to share blog links I find interesting so that appears on my blog via the friendfeed widget, which reminded me of the widget friendfeed provides to put on your website/blog so that people who read your content know whats going on with you, read your changing Gtalk messages or track you on twitter or know of your music taste on last.fm.

Friendfeed is started by 4 ex-googlers with gmail,gmap,Google reader fame and that shows the potential it has, there was a buzz in blogosphere of kevin fox ( Gmail UI designer) joining friendfeed ( Actually he has joined Friendfeed ) and thats awesome for its UI prospects. I wonder how silicon valley startups are managed, with 4 ex googlers as co founders and Gmail UI designer with them .. Thats like so much Line of Code per square feet .. I will be tracking friendfeed and its development and for the mean time you can be friends with me on friendfeed.

Type rest of the post here

Twitter -- My current fav web 2.0 app

2008-02-10T07:55:00.000+05:30

I've been hearing twitter/twitter for long time now, but never cared much about it as I am already fed up of orkut, facebook from social media point of view ( just interested in its developer framework now !!). So, yeh why bother myself with another blah application which forces me to login, interact ( I am antisocial, if you have not noticed ) and then login back to follow up or worse get a shit load of garbage in my e mail. I was listenin to pantera, readin this Jquery book and surfing ( Alt + tab :P ) when I came across john resig's post about how he is hooked to twitter and how he was dejected to social networks (kind of same emotions more or less, only mine r pretty much aggressive) So, I decided to check it out and Damn!! its one of the most intelligent, convenient application I have seen.
Few Things that impressed me straight away were :
> Clean And Simple design with lots of decent AJAX/Javascript ( not gaudy and jumping )
> The event notification is just fundooo !!
> The XMPP support for notification on gtalk, jabber
> I dont have to login into twitter, I can set my status/microblog from gtalk
> Or even my phone (only that its 3rs/sms :( )
> Most amazing thing is twitter tracking .. I can track keywords in twitter universe via gtalk .. It doesnt give me daily digest of web alerts ... Something google should pick up from twitter, and stop sending me those e mails but notify me on IM (or atleast gimme a option )

What I will like to see in Twitter Or atleast I dont know how to make it work :
> reply to track keywords via gtalk .. that way I make frens based on my dynamic interests and not going to a community and fan club which i join once and forget abt next day..
> More IM protocols supported, partner with yahoo prolly and release a plugin or something ..
> I don't feel the need of firefox plugin for twitter although a quick search show many .. Gtalk is much more convenient
> I still can't figure out a way to reply to twitter updates of ppl I am following, I wanted to ask john resign about his new book and give him some tips maybe [:P]
> Twitter framework is ready to increase its SNS activities as I mentioned before I could meet people with my changing interest via twitter tracker ..

All in All a great app ...

Follow me on twitter :)

Yahoo Acquires Zimbra

2007-09-18T12:36:00.000+05:30

Zimbra, one of the trade mark applications of web 2.0 paradigm is taken .. According to zimbra.com yahoo has bought zimbra for $350m .. neat eh ?

We are excited to announce today that Yahoo! is acquiring Zimbra to extend its email leadership to the University, Business and ISP markets.. In order to focus on this effort, the Zimbra team will report to the communications group where we will remain fully committed to the community and to our customers and partners while leveraging opportunities to enhance their current experience.

Well it maybe a great step to regain ground in mail section, which it is loosing to gmail, Also I think its a measure to counter gmail for enterprises market, Google is doing good with Google apps and yahoo needed to counter that and zimbra might actually pull that off. Zimbra is an open source framework which allows developers and enterprises to integrate their services with zimbra services, Organizations have integrated zimbra with ERP and Inventory systems.. Ask me "How open source ppl earn money" And I might have an answer for you this time :)..

FireBug -- The Wonder Tool

2007-08-26T20:09:00.000+05:30

For the ajaxkarma devotees [:P]:
" Firebug has been around for quite some time now and just because it is mentioned for the first time here, doesn't make it a new in the market beta tool "
For quite sometime I have been planning to write a short tutorial on how to debug javascript and basically "how to be a javascript developer and still be non suicidal", Javascript can really get to your nerves and haunt you at nights with malformed pop ups .. But then its like friction "A necessary evil" you cant make any ajax request or display creamy web widgets without javascript .. For the optimism I have in me ,I am gonna cut short the gloomy airs around JS. Joe Hewitt like a mesiah came to our rescue and made this wonder tool firebug .. Firebug is a javascript, CSS, HTML analyzer which reports almost everything you can imagine about a web page.
This 250kb extension to firefox is better than any debugger, profiler tool you would have worked on your IDE's. It allows you to change DOM in real time allowing you to see changes live, and so CSS and other property you can think of, It contains a script engine to test javascript before incorporating into your page. As I ramble on, I am realizing that nothing I say would aptly describe this tool, So you need to hear it from the man himself, Watch this excellent video which explains the ins and outs of FireBug.

And We Are Back

2007-08-16T19:45:00.000+05:30

Ok, I have used backspace some 20 times trying to figure out something funny to write after my trip to caves in guatemala [:)] (have been reading a lot about xibalba and stuff), So yeh I am back again with some changes, I plan to keep this blog as a journal of web 2.0 related activities which i find interesting and worth mentioning. I am planning to have a separate web site for the tutorials and the knowledge base of web 2.0 for which i pledge to work [:P] I do I do .. No kidding !!!

An Interesting study of Digital Text

2007-07-01T21:17:00.000+05:30

We Sure have advanced a lot !! Application is faster than the speed of thought and really its hard to predict the face of web and the way we communicate.

&pT=]]>&pB=]]>&pD=">

Dojo 0.9 Beta scheduled for today

2007-06-28T21:16:00.000+05:30

Love Dojo ? Well you have a reason to jump off the roof (in ur swimming pool of course) and get back to ur work stations to adapt your skills to a very different but lightning fast version of dojo. Yes today is the beta launch day of dojo 0.9 and dojo guys have worked very hard on saving your Kb's and CPU cycles. Well those of you who thought that dojo is hard to learn, will be buying food for ever hungry dojo hackers!! 0.9 book is not finished and is a work in progress but those of you who need a porting guide, can smile a little as porting guide is presentable and if you are a quick learner then sufficient.
So get ready with your local test site !!

Remember The Milk -- The Bob Story

2007-06-09T14:20:00.000+05:30

Google loves to surprise both its user and developer community, gd7 delivered more than expectation when it came to powering the developer with ammunition. With gd7 came Google gears, Mapplets and Mashup editor (very much in Beta). One of the early adapters of Google gears is Remember the Milk (Bob the monkey) website. They have a impressive UI and their integration with google services look very sturdy, remember the milk is an impressive example of web 2.0 which brings a fanktacular UI and reliable functionality.
Remember The milk is a web application which helps you manage your TODO list in a fun way,It notify of your events and tasks via IM, e mail etc ... Do check it out !! Maybe it acts as a panacea to your procrastination problem ...
Great Work BoB !!!

Google Gears and Dojo Offline

2007-06-04T02:19:00.000+05:30

Google launched Google gears which helps a developer to make its web application work offline, Google Gears is a set of API which works in tandem with a Local Server, Database and a Worker Pool to enable a web application to work offline. Dojo launched a simillar kind of toolkit called Dojo Offline about a month ago, Its time to watch out performance of both the developer toolkits, though Google has the Big G factor to it .. I am particularly impressed by dojo toolkit which AJAXify your web app in a click of a thumb and also gives you a very rich web 2.0 UI with really sweet widgets to cutify your website. Dojo Offline has this edge of being open source and hassle free IP issues which makes it a better contender to provide a complete solution to the offline paradigm. Its two of my favorites competing and I am gonna be hurt anyway. If I get time to work on google gears (which I have to manage with my placements coming), I will publish some tutorials and examples on ajaxkarma, so keep looking !!

Dijit Form Widgets Tutorial -- TextBox, CheckBox, Button

2007-05-26T00:44:00.000+05:30

Lets quickly see these simple Dijit Form Elements, so that we will have more time to invest on fancier one's.
BOOTSTRAPPING:
BootStrapping is still done with good old dojo.js by sourcing this script file in our environment. It does all the work at the background to give u the dojo object.
<script type="text/javascript" src="www_root/js/dojo/dojo.js"></script>
This you will need in any dojo enabled page and dojo.js contain the most important and frequently functions.
DOJO REQUIRES:
To make dijit work You will need to import corresponding Widget Script File in your environment. To parse the widgets you need a parser JS file which can be obtained by
dojo.require ("dijit.util.parser");
This is needed in almost all markup based widget creation, where you create widgets by calling them in html tags.

GETTING STARTED WITH TEXTBOX, CHECKBOX AND BUTTONS:
To make Textbox, checkbox or Button work you will have to dojo require the appropriate JS file in your environment..

Lets see how to define a TextBox in a input tag ...
<input dojoType="dijit.form.Textbox" type=text name="name">

You can set following properties:

trim : Removes leading and trailing whitespace if true. Default is false.
ProperCase: Converts the first character of each word to uppercase if true.
upperCase : Converts all characters to uppercase if true. Default is false.
lowerCase:
Size: Size of the text Box

Following event handlers work as in normal textbox:

onfocus
onblur
onkeyup

Lets see how to use above info ...

<input dojoType="dijit.form.Textbox" type=text name="name" trim="true" propercase="true">

Similarly the obove eventhandlers can be used to call appropriate functions..

Some Functions of TextBox object are
getTextValue
getValue
setTextValue
setValue

Note: You can acess these functions when you create TextBox programatically

Making a TextBox Programatically :
function create_textbox()
{
var parameters = {
name:"email",
trim:"true",
propercase:"true"
};

var text = new dijit.form.Textbox(parameters,dojo.byId("hello"));
text.setTextValue("Value set by setTextValue");
}

<form >
<button dojoType="dijit.form.Button " onClick="create_textbox"> Textbox Programatically
</button>
</form>
</div>
<div id="hello"></div>

BUTTON:
Button is a very rich widget of dijit in terms of looks, functionality and flexibility, As button is used very often in pages the versatility is very much appreciated by developers.
Types of Button We can create are :
1> Normal Cickable Button
2> Drop Down Button ( Using DropDownButton and Menu Widget)
3>Combo Button (Using ComboButton and Menu Widget)

Normal Cickable Button:
We can create a Paser based mark up button as follow:

We need to dojo require the Button Js file by
dojo.require("dijit.form.Button ");

<button dojoType=" dijit.form.Button" onClick="create_textbox">
Click Me!
</button>

Other Attributes of Button are :
Caption: Set caption on button

Function Available to Override:
setCaption: set the caption on button
buttonClick: internal handling of button click

CallBack Funtion:
onClick: Called When button is Clicked

You can have image on button by using <img> tag before closing the button or input tag.

Creating Normal Clickable Button Programatically:
function create_button()
{
var parameters = {
caption:"I m programatically created. Please Click Me",
onClick:"call"
};

var but = new dijit.form.Button(parameters,dojo.byId("hello"));
}

You can call it as callBack handler on onClick or any other way you choose to.

Drop Down Button:
Drop Down Buttons are rendered with the help of Menu Widget and as the Drop Down Button class is in the same JS file as Button class therefore we dont need explicit dojo.require for it. It will come with dojo.require("dijit.form.Button").

Lets see how to create a Drop Down Button quickly ..

<button dojoType="dijit.form.DropDownButton" menuId='FileMenu'>
File </button>

<div dojoType="dijit.PopupMenu" id="FileMenu" toggle="fade" toggleDuration="500" style="display: none;">
<div dojoType=" dijit.MenuItem" caption="New" accelKey="Ctrl+N" onClick="new" </div>
<div dojoType="dijit.MenuItem" caption="Open" accelKey="Ctrl+o" onClick="loadFile"></div>
<div dojoType="dijit.MenuItem" caption="Save" accelKey="Ctrl+s onClick="send"></div>
</div>

dijit.PopMenu and dijit.MenuItem are sourced into environment by dojo.require("dijit.Menu");

Combo Button:
<button dojoType="dijit.form.ComboButton" menuId='FileMenu' onClick=file>
File </button>

and PopMenu can be defined as above in drop down Menu ..

CHECKBOX:
Checkboxes can be used simillarly, we need dojo.require("dijit.form.Checkbox")
They have the same properties as normal Html Checkboxes like

value
checked

<input dojoType="dijit.form.Checkbox" type="checkbox" name="vote" checked="true" value="on" onClick=alert( this.value)>

Other Callback Handlers are:

onChecked
mouseOver
mouseOut

RadioButtons:
<input dojoType=" dijit.form.RadioButton" type="radio" name="album" checked="true" value="snm" onClick=alert(this.value)>

<input dojoType="dijit.form.RadioButton" type="radio" name="album" value="load" onClick=alert( this.value)>

<input dojoType="dijit.form.RadioButton" type="radio" name="album" value="master of puppets" onClick=alert(this.value)>

Closing:
Whew !! Well I have covered almost all aspects of these widgets in accordance to nightly build of 23 May !! We will next see other form elements which are unique to dojo like InlineEditbox,
dateTextBox, CurrencyTextBox, Autocompleter etc ... Keep Checking this blog !!

Dojo 0.9 M2 is out !!

2007-05-25T07:22:00.000+05:30

Well Many of You already know that Dojo is on its way of a major release which is gonna affect our knowledge of applying dojo in our solutions. Dojo 0.9 Milestone 2 release is out and can be obtained from here.

Dojo Widget has its own new Name and will be called "Dijit" officially, Dojo core is slimmer and faster as per Alex Russel . I downloaded 24th May's nightly build and started looking in it and ran some tests, which were impressive and convincing for the widgets supported till now by dijit. I will start writing on small How To's here to show the usage of Dijit widget which is easier to understand and less clumsier than the overall bash of dojo 0.4 .

I will first cover form widgets of dijit and ways to use them in your pages and then we can move on to more fancy one like Editor and Tree's or we can mix the order, It all depend on the mood and time constraints.

FeedControl update to Google AJAX Feed API

2007-05-14T17:50:00.001+05:30

FeedControl was added recently by google to AJAX feed API which works like GSearchControl in Google AJAX Search API. This class makes it easier to add multiple feeds and to draw them up by basic predefined google CSS which can be overidden as needed.

FeedControl constructor doesnt take any argument and has three methods associated with it

addFeed(url,title)
draw(element,options)
setNumEntries(num)
setLinkTarget(Target)

There are already very good examples given by google AJAX API group which covers almost all methods and options of this new class. I specially liked to see the tabbed feed drawoption one, which looked very fancy and can be used effectively in creating neat and clean mashups.

Please look at the reference of this class to find out more on these methods but I will give a brief introduction of these methods although they dont require much explaination.

addFeed(url,title) : to add a new feed to your feedcontrol object and the second argument is used to give it a label which is displayed accordingly by the CSS attached to it.

draw(element,options): To load the feed and draw on the page, It takes the DOM element as its argument which will act as the container of the feed and also it takes a optional second argument which can instruct of other options of drawing, currently there is one option called DrawMode which can take two value

google.feeds.FeedControl.DRAW_MODE_TABBED

google.feeds.FeedControl.DRAW_MODE_LINEAR.

setNumEntries(num): Num of entries to be pulled when draw is called.

setLinkTarget(target): where should the link open when clicked. Default is the same window, Pl check the documentation for possible values.

ADVANTAGES:

few advantages that can be observed by addition of feedControl in feed API are:
>Simpler programming model
>Drawing is done by the API itself, which can be controlled by overidding the CSS
>Title now contains the link to the entry too :)
>Default CSS which can be used where no sophisticated layout is needed.

3 Examples are given by the Google team, which can be accessed from here

Programming Mashups using Google Ajax Feeds API -- Part 2 of 2

2007-05-04T21:48:00.001+05:30

Deviating from default:
In the previous part we learned how to pull a feed into a mashup using bare bones of the AJAX feed API.In this part we will see what customization is possible in the API and how !!

Things That can be changed:

Number of entries in default pulling is 4, this can be changed
Result format by default is JSON, this can be changed to XML

Changing Number Of Entries:
This can be changed by calling setNumEntries method of feed object. the argument of this methods is number of entries you wanna pull in each result object. This is a important method and would come in handy in almost all mashup programming.

feed.setNumEntries(7);

This method should be called before calling load.

Changing Result Format:
Like Number of entries this can also be changed by calling a method on the feed object, Method of interest in this regard is setResultFormat(format). Format can take one of the three values
1> google.feeds.Feed.JSON_FORMAT (default)
2> google.feeds.Feed.XML_FORMAT
3> google.feeds.Feed.MIXED_FORMAT

feed.setResultFormat(google.feeds.Feed.XML_FORMAT)

Example Mashup:
In this example we will try to use all the concepts learned till now, This will contain a mashup of 2 feeds, one pulled as JSON and other pulled as XML. More of number of entries will also be different in both the feeds. This should suffice the usage of all API's present in the armour.

Function to pull a feed with result in JSON format:

function pull_json(feed_url,container_id,num_entries)
{
var feed = new google.feeds.Feed(feed_url);
feed.setNumEntries(num_entries);
feed.load(function(result) {
if (!result.error) {
var feed_container = document.getElementById(container_id);
for (var i = 0; i <= result.feed.entries.length; i++) {
var entry = result.feed.entries[i];
var div = document.createElement("div");
var link = document.createElement("a");
link.href=entry.link;
link.innerHTML=entry.title;
div.appendChild(link);
div.appendChild(document.createElement("br"));
div.appendChild(document.createTextNode(entry.contentSnippet));
feed_container.appendChild(div);
}
}
});
}

Function to pull a feed with result in XML Format:

function pull_xml(url,container_id,entries)
{
var feed = new google.feeds.Feed(url);
feed.setNumEntries(entries);
feed.setResultFormat(google.feeds.Feed.XML_FORMAT);
feed.load(function(result) {
var feed_container = document.getElementById(container_id);
if (!result.error) {
var items = result.xmlDocument.getElementsByTagName("item");
for (var i = 0; i < items.length; i++) {
var titleElement = items[i].getElementsByTagName("title")[0];
var title = titleElement.firstChild.nodeValue;
var linkElements = items[i].getElementsByTagName("link")[0];
var link_url = linkElements.firstChild.nodeValue;
var descElements = items[i].getElementsByTagName("description")[0];
var desc = descElements.firstChild.nodeValue;
var div = document.createElement("div");
var link = document.createElement("a");
link.href=link_url;
link.innerHTML=title div.appendChild (link);
div.appendChild(document.createElement("br"));
div.appendChild(document.createTextNode(desc));
feed_container.appendChild(div);
}
}
});
}

Full Source with minimal layout can be found here
Sample Demo Of above mashup can be viewed here

Conclusion:
Mashup programming is made easy by Google AJAX Feed API, and we learned how !! This 2 article series covered the API with examples and I will soon put a cool sample mashup using google AJAX API as soon as I get time.

Programming Mashups using Google Ajax Feeds -- Part 1 of 2

2007-04-26T20:21:00.001+05:30

Mashups
Mashups are information rich portals which pull data from different sources and present at one logical accessible place like a website. Mashups can be ideally created from feeds which follow RSS/Atom Specification. RSS/Atom is a XML stream or file which can be parsed by a SAX or DOM parser to obtain the content desirable for your site.
Google AJAX Feed API:
Google some days ago launched AJAX feed API which does all the dirty work behind the scenes for you to retrieve feeds and make the data available in JSON or XML format in a feed object. This object can be iterated over to extract information and display on your web site. You can pull more than one feed and place in different containers governed by your CSS style, Hence giving birth to a mashup.
Preliminaries of AJAX Feed API:
The API has only one public class called google.feeds.Feed, Constructor of this class take the feed url as parameter. The object returned contains the feed information and elements in the field. The default format for the feed content is JSON but it can be set to XML as we will see later. We associate a callback function to handle the XmlHttpResponse with feed object by calling load function which takes a callback function as the argument.

To summarise preliminaries of AJAX Feed API:

Feed Object is created by passing the feed url as parameter to the feed class.
CallBack Function is Associated with feed by calling google.feeds.Feed.load(callback())
Data Format can be shifted between JSON and XML, by default its JSON.

Example: Retrieving Google News Using AJAX Feed API:
Lets do some pulling with the Feed API. In this example we will pull data from google news
and display it on our portal, This is a bare bone skeleton example that should get you started on using the Feed API. Designers should apply their creativity to layout data from different feeds to attract users. We Will use the default JSON format to represent data but that is implicit to the feed object.

Here is the Code To get You started:

<html>
<head>


<script type="text/javascript" src=" http://www.google.com/jsapi?key="Key_u_got_from_google"
</script>


<script type="text/javascript">
// This is Google AJAX API function which says that you
// that you are loading the feed API and the version of the API is 1
google.load("feeds", "1");
// Function that needs to be called when the AJAX request returns
function newsInit() {

var feedurl = "http://news.google.com/?output=rss&amp;ned=:ePkh8BM9E8JmByvQDgMWHLYAAJLIBto " ;

// make the feed object var newsFeed = new google.feeds.Feed(feedurl);

// Assign a Callback function
newsFeed.load(function(feed_result) {
if (!feed_result.error) {
var feed_container = document.getElementById("newsFeed");
// Display by Manipulating DOM
for (var i = 0; i < feed_result.feed.entries.length; i++)
{
var entry = feed_result.feed.entries[i];
var div = document.createElement("div");
var link = document.createElement("a");
link.href=entry.link;
link.innerHTML=entry.title;
div.appendChild(link);
div.appendChild(document.createElement("br")); div.appendChild(document.createTextNode(entry.contentSnippet)); feed_container.appendChild(div);
}
}
});
} google.setOnLoadCallback(newsInit);
</script>
</head> <body>
<div id="newsFeed"> </div>
</body> </html>

This Should fetch 4 entries from google news. You can layout newsFeed div element to display news feed nicely and cleanly.

Note: Google uses feedFetcher to crawl and pull feeds at the backend, accoring to google policy it refreshes the feed value in about an hour, therefore the websites whose feed changing frequency is pretty high, the entries will not be refreshed.

In next Part I will show how to configure options of retrieval and how to use XML as a data model. We Will also create a web Page with more than 2 feeds pouring in data.

What is web 2.0 ?

2007-04-26T14:48:00.001+05:30

Web 2.0 is a term coined to explain conceptual amalgamation of technologies, specialised applications, community collaboration and overall change of user experience on Internet observed by everyone. Right from Google Maps to Wikipedia or WordPress to Drupal come under the umbrella of Web 2.0. They share the fraternity under the fatherhood of web 2.0. This term has nothing to do with any updates in technological specification of WWW or HTTP, Its just a term to express advancements in internet applications which has definately changed the way Internet is used and perceived by us.

Web 2.0 as a Amalgamation of Technologies:
AJAX has been a buzz word since 2005 and has really proved its potential in bringing out the paradigm changes to User Interfacing. Web Portals are no Longer some dead pages with some business logic at backend waiting for a user request, It has transformed into a complete software killer applications deployed over the Internet. Best Example I can think of such kind of transform is google docs and spreadsheets and all this is made possible by AJAX and other supporting technologies.

Why Amalgamation ?
AJAX is not a technology in itself, but a collection of other technologies arranged in a way to deliver stunning highly responsive GUI applications on Internet.

Component Technologies of AJAX :
Javascript
XMLHttpRequest or ActiveX Object capability of browsers
DOM Manipulation (By JavaScript)
CSS Manipulation (By JavaScript)

RSS/Atom is another technology which eases information dissemination and has become dominant on internet in the name of feeds.Businesses can reach potential customers using these feeds which serves as a boradcast message.RSS/Atom is based on XML which is open standard and human readable, Feeds can be used to create mashups based on your interest or the interest of your potential users. You can mix and match and really make a information rich web portal.

Web 2.0 as an amalgamation of special applications:
Wiki, CMS, blogs, forums,social networking are special internet applications which have changed the way user look for information on internet. Moreover these are easily pluggable applications which attach themselves to your web site and help the administrator to maintain large information base in a clean way. Most of these applications are open sourec and can be integrated for free with little or no configuration, some of the good examples being drupal, wikimedia, wordpress, joomla etc. Community Wiki's can be exploited to create a large information base of some particular area and hence create specialised wiki's. Please read here to find out how wiki works.

Web 2.0 from the perspective of Clustering information:
Social bookmarking, tagging (folksonomy), permalink etc are ways to give an order to information spread across internet. A single institution can not do it, so the job is taken up by common users who tag information into labels that interest them. These labels help bring order to the information on internet, Sometimes these tags can also be used to search information on internet. Users also share there information in terms of bookmarks which is now popularly called social bookmarking (del.icio.us) .These tags can be very useful when you are looking for information on internet.

I hope it gives you some information as to what are we looking at !! Puprose of this blog is to expose ways of creating such applications practically and to use all aspects of web 2.0 to create a information rich and attractive web portal. We would look at technologies like AJAX, RSS/Atom web services in great depth and from practical point of view .