developer.com
Search EarthWeb
CodeGuru | Gamelan | Jars | Wireless | Discussions
Navigate developer.com
Architecture & Design  
Database  
Java
Languages & Tools
Microsoft & .NET
Open Source  
Project Management  
Security  
Techniques  
Voice  
Web Services  
Wireless/Mobile
XML  
New
 
Technology Jobs  

   Developer.com Webcasts:
  The Impact of Coding Standards and Code Reviews

  Project Management for the Developer

  Defining Your Own Software Development Methodology

  more Webcasts...




Return in early January to see which technologies and products won.




Developer Jobs

Be a Commerce Partner














 


Developer News -
Cisco Lawsuit: A Test for the GPL?    January 5, 2009
Shifts for Enterprise Linux, Green Networks in '09    December 26, 2008
Gifts for All in Linux 2.6.28    December 24, 2008
Merb Merges With Rails    December 24, 2008
Free Tech Newsletter -

Introducing the Google AJAX APIs
By Chris Schalk

Go to page: Prev  1  2  3  4  5  6  Next  

A HelloWorld AJAX Feed Example

In a similarly simple fashion, learning how to use the AJAX Feed API is best done using a HelloWorld type example. As with the AJAX Search API, there also exists plenty of code examples at the AJAX Feed API homepage at http://code.google.com/apis/ajaxfeeds/. Here is a simple example using the AJAX Feed API's FeedControl.

<html>
   <head>
   <script type="text/javascript" src="http://www.google.com/
                 jsapi?key=YOUR-KEY"></script>
   <script type="text/javascript">

   google.load("feeds", "1");

   function initialize() {
      var feedControl = new google.feeds.FeedControl();
      feedControl.addFeed("http://www.digg.com/rss/index.xml",
                          "Digg");
      feedControl.addFeed("http://feeds.feedburner.com/Techcrunch",
                          "TechCrunch");
      feedControl.draw(document.getElementById("feedControl"));
   }
   google.setOnLoadCallback(initialize);

   </script>
   </head>

   <body>
      <div id="feedControl">Loading</div>
   </body>
</html>

As you can see, using the AJAX Feed FeedControl to pull down and display Internet feeds is done in a very similar manner as adding searchers to the AJAX Search control. When rendered on a web page, the AJAX Feed FeedControl renders feed items onto a page in a nicely formatted manner. If more than one feed is specified, their items can be stacked (as shown below) or placed in separate tabbed pages.

ajax feed helloworld

Figure 3: The AJAX Feed API in action

Before diving into more examples of how to use these rich AJAX solutions, it's helpful to first review the underlying architecture of Google's AJAX APIs that make these solutions possible.

The Architecture of Google's AJAX APIs

In short, the Google AJAX APIs serve as an enhanced conduit to several of Google's most popular hosted services. The hosted services such as Google Search or Google Maps can be accessed directly, but with AJAX APIs comes the ability to integrate these hosted services into anyone's custom web pages.

AJAX APIs Architecture

Figure 4: The AJAX APIs architecture at a glance

The way the AJAX APIs work is by allowing any web page that is hosted on the Internet access to Google search (or feed) data through JavaScript code. The core JavaScript code that fetches the search or feed data can be as simple as Search.execute( ) or Feed.load( ). As the request is made to Google's worldwide servers, a response of either Search data or prepared AJAX Feed data is streamed back to the Web page in either JSON (JavaScript Object Notation) or XML formats. Parsing of this data can either be done manually or automatically by using one of the provided UI controls that are built upon the lower level AJAX APIs. In fact, the AJAX APIs in general are architected in a layered fashion.

Go to page: Prev  1  2  3  4  5  6  Next  


Tools:
Add www.developer.com to your favorites
Add www.developer.com to your browser search box
IE 7 | Firefox 2.0 | Firefox 1.5.x
Receive news via our XML/RSS feed


Architecture & Design Archives






internet.comearthweb.comDevx.commediabistro.comGraphics.com

Search:

Jupitermedia Corporation has two divisions: Jupiterimages and JupiterOnlineMedia

Jupitermedia Corporate Info

Legal Notices, Licensing, Reprints, Permissions, Privacy Policy.
Advertise | Newsletters | Tech Jobs | Shopping | E-mail Offers