Home arrow JavaScript arrow Creating the Front End of a Headlines System with AJAX

Creating the Front End of a Headlines System with AJAX

In this first part of a two-part series, I will show you how to develop a small application which uses AJAX as its workhorse. The application will display dynamic headlines, previously fetched from a simple XML file, on a web page.

Author Info:
By: Alejandro Gervasio
Rating: 5 stars5 stars5 stars5 stars5 stars / 11
September 19, 2006
  1. · Creating the Front End of a Headlines System with AJAX
  2. · Defining the application's front end
  3. · Creating the (X)HTML markup and CSS rules of the headlines application
  4. · Defining the behavioral layer of the headlines application
  5. · Listing the full client side source code

print this article

Creating the Front End of a Headlines System with AJAX
(Page 1 of 5 )

A downloadable file for this article is available here.


These days, the number of websites that use AJAX for the driving technology to build richer Web applications is really remarkable. To see an illustrative example in action, you must take a look at the progressively popular Google's Gmail service, which demonstrates how an excellent implementation of JavaScript-based HTTP requests can be used for creating a full-featured web-based email application.

However, there's no need to examine only the Gmail service to realize the deep impact that AJAX-driven applications have had in the vast terrain of Web development. As you've probably seen, the Web includes plenty of sites that utilize AJAX  to provide visitors with a richer and more interactive experience. Many of them introduce this technology particularly for creating small applications.

Speaking more specifically, there are numerous websites (most of them are online newspapers) that use a huge variety of AJAX-based systems to display their breaking news and headlines on the front page. This is very handy since these mechanisms also have additional features, like navigational buttons, cool image pre loaders, sound controls, and so forth.

To be frank, I don't want to be that ambitious with reference to the subject of this series, but since I found the above mentioned applications interesting, I propose to build a headlines system with AJAX, which can be easily extended with only minor hassles. In addition, one of the best features offered by this news-displaying mechanism is its ability to read all the headlines from a single XML file, something that speaks for itself about the versatility of the system.

Having introduced the theme of this two-part series, it's time to leap forward and learn how this AJAX-based headlines system can be created in a few simple steps. Let's get started!

blog comments powered by Disqus

- Project Nashorn to Make Java, JavaScript Wor...
- JavaScript Virus Attacks Tumblr Blogs
- Google Releases Stable Dart Version, JavaScr...
- Khan Academy Unveils New JavaScript Learning...
- Accessing Nitro? There`s an App for That
- JQuery 2.0 Leaving Older IE Versions Behind
- Fastest JavaScript Engine Might Surprise You
- Microsoft Adjusting Chakra for IE 10
- Brendan Eich: We Don`t Need Google Native Cl...
- An Overview of JavaScript Statements
- An Overview of JavaScript Operators
- Overview of JavaScript Variables
- More of the Top jQuery Social Plugins
- The Top jQuery Social Plugins
- More of the Top jQuery Slider Plugins

Watch our Tech Videos 
Dev Articles Forums 
 RSS  Articles
 RSS  Forums
 RSS  All Feeds
Write For Us 
Weekly Newsletter
Developer Updates  
Free Website Content 
Contact Us 
Site Map 
Privacy Policy 

Developer Shed Affiliates


© 2003-2019 by Developer Shed. All rights reserved. DS Cluster - Follow our Sitemap
Popular Web Development Topics
All Web Development Tutorials