Skip to main content

Create dynamic Firefox user interfaces

Build an RSS reader that downloads data using Ajax and then creates XUL elements dynamically using XSLT

Adam Pilkington, Software Engineer, IBM Japan
Photo of Adam Pilkington
Adam Pilkington is a Java™ Performance Analyst within the IBM Java Technology Centre, focusing on WebSphere® Application Server performance with Java Version 6. Prior to joining IBM in 2006, he was a Java 2 Platform, Enterprise Edition (J2EE) technical architect for a large U.K. financial services organization. He holds a degree in mathematics and computer science.

Summary:  When you create browser-based applications that display XML data feeds, you often need to code the data-retrieval mechanism and the user interface. Mozilla Firefox provides an infrastructure that frees you from these tasks, so you can concentrate on your application's functionality. Learn how to use Asynchronous JavaScript + XML (Ajax) to download XML data from a Web server, and discover how you can use Extensible Stylesheet Language Transformations (XSLT) to transform it dynamically into Firefox user-interface elements expressed in XML User Interface Language (XUL). You can apply these techniques to any application that uses XML data sources.

Date:  08 Jan 2008
Level:  Intermediate PDF:  A4 and Letter (185 KB)Get Adobe® Reader®

Activity:  516 views
Comments:  

Before you start

Learn what to expect from this tutorial and how to get the most out of it.

About this tutorial

This tutorial walks you through a sample application as it illustrates how you can combine XUL, XSLT, and Ajax to produce dynamic user interfaces. By the end of the tutorial, you'll be able to apply the techniques to any XML-based data source used to drive a Firefox application.


Objectives

  • Define a skeleton user interface that populates dynamically.
  • Use Ajax to download XML data into Firefox.
  • Use XSLT to create XUL elements that you then add to the application.

Prerequisites

You need to have a basic understanding of XML and XSLT, and you should be comfortable applying simple transformations to XML data. You also need to be familiar with XUL, the language you'll use to define Firefox user interfaces. Finally, you should be able to write or understand JavaScript, as it's the glue that binds all these technologies together.


System requirements

You'll need Firefox Version 2 and a PHP-capable Web server to run the sample application developed in this tutorial.

1 of 10 | Next

Comments



Trademarks  |  My developerWorks terms and conditions

Help: Update or add to My dW interests

What's this?

This little timesaver lets you update your My developerWorks profile with just one click! The general subject of this content (AIX and UNIX, Information Management, Lotus, Rational, Tivoli, WebSphere, Java, Linux, Open source, SOA and Web services, Web development, or XML) will be added to the interests section of your profile, if it's not there already. You only need to be logged in to My developerWorks.

And what's the point of adding your interests to your profile? That's how you find other users with the same interests as yours, and see what they're reading and contributing to the community. Your interests also help us recommend relevant developerWorks content to you.

View your My developerWorks profile

Return from help

Help: Remove from My dW interests

What's this?

Removing this interest does not alter your profile, but rather removes this piece of content from a list of all content for which you've indicated interest. In a future enhancement to My developerWorks, you'll be able to see a record of that content.

View your My developerWorks profile

Return from help

static.content.url=http://www.ibm.com/developerworks/js/artrating/
SITE_ID=1
Zone=XML, Web development
ArticleID=278300
TutorialTitle=Create dynamic Firefox user interfaces
publish-date=01082008
author1-email=apilkington@uk.ibm.com
author1-email-cc=dwxed@us.ibm.com

My developerWorks community

Tags

Help
Use the search field to find all types of content in My developerWorks with that tag.

Use the slider bar to see more or fewer tags.

Popular tags shows the top tags for this particular content zone (for example, Java technology, Linux, WebSphere).

My tags shows your tags for this particular content zone (for example, Java technology, Linux, WebSphere).

Use the search field to find all types of content in My developerWorks with that tag. Popular tags shows the top tags for this particular content zone (for example, Java technology, Linux, WebSphere). My tags shows your tags for this particular content zone (for example, Java technology, Linux, WebSphere).

Special offers