Ajax:java Pet Store 2.0 Application Introduction

Using AJAX to create Web 2.0 Web applications for seamless data interaction is a complex task, and Ajax is a technology that includes, but is not limited to, asynchronous JavaScript and XML. To help you understand exactly what Web 2.0 is, and how Ajax improves the user experience, the Java Blueprints Program team has developed a Java Pet Store 2.0 Reference Application. By exploring the use case, design, and implementation of the Pet Store 2.0 application, you will learn more about building applications with similar functionality.

The Java Pet Store 2.0 Demo program provides a contact scene for pet buyers, sellers, and pet lovers who just want to see a pet. This program demonstrates how to use the Java Platform, Enterprise Edition 5 (Java EE 5) to develop AJAX-enabled WEB 2.0 applications. It also comes with the complete source code to obtain the Bsd-style license, so you can use it to experiment and use it in your own application.

At the same time, the Java Pet Store 2.0 demo program also demonstrates Ajax-enabled JavaServer Faces component libraries and Java Persistence APIs, Model-view-controller (MVC), and other design patterns, as well as The use of mashups, where mashups are Web applications that combine data from multiple sources. Try the Live Java Pet Store 2.0 application and download it.

This article outlines many of the features in the Java Pet Store 2.0 Demo program and demonstrates how they are user-driven, organized, and controlled.

WEB 2.0 Overview

The Java Pet Store 2.0 demo program is a WEB 2.0 application. What exactly is Web 2.0?

Historically, the Web site was initially used as a collection of HTML pages, providing only information about companies or topics. Many such sites are actually advertising. Over time, Web sites evolve to include dynamic pages that allow users to enter information or requirements and render them in a form. The information is passed to the server, and the server then returns a page to the user. The user's browser page is reloaded to include the requested information. Some popular dynamic features include polling, surveys and product search. Applets and similar applications also allow users to play games online and chat with others. No matter how dynamic the majority of such sites are, their content is always controlled by the site owner, and navigation is arranged in a way that the owner feels best suited to Web features.

The Web 2.0,web site is converted to user-driven rather than owner-driven. Users can add their own content, mark what they and others add--and the data is organized according to the needs of the public. In addition, the use of Ajax technology, the page does not need to completely reload, improve the user experience. The data fragment is transmitted asynchronously in the background, so that only a small portion of the page can be refreshed, giving the user an experience that is closer to the desktop application.

The blueprints team used WEB 2.0 to create the Java Pet Store 2.0 Reference Application: All content is user-driven and allows users to mark data in ways that make sense to them. In addition, the Java Pet Store demo program uses an Ajax user interface (UI) throughout the program to provide a richer user experience similar to desktop applications. Finally, the Java Pet Store demo program contains dynamic Data and mashups for the active service. This article defines all of these features and explains the techniques involved.

Rich Web GUI with Ajax

You may have visited a Web site where you need to reload the entire page each time you click a menu item or link. This not only slows down the application, but also stimulates the eyes and sometimes makes you overwhelmed, especially when you're looking at a page that contains a lot of data. To overcome some of these problems, all pages in the Java Pet Store demo program use Ajax to create a smoother user experience and avoid annoying overall page overloads.

Ajax uses JavaScript technology in HTML pages to invoke the server asynchronously and retrieve the data. The JavaScript technology can then use this data to update or modify the Document Object model of the HTML page (model,dom). Initially, developers used Ajax and XML documents to represent data, but they gradually switched to other formats.

Ajax interaction allows explicit separation of presentation logic from the data. HTML pages can update only a small subset of the data needed without reloading the entire page as each change is displayed. A different server-side architecture is needed to support this interaction pattern. Traditionally, server-side Web applications are used primarily to generate HTML documents for each client event that causes a server call. The client then refreshes and renders the full HTML page for each response. Rich Web applications, such as the Java Pet Store 2.0 demo program, focus on the client crawl of an HTML document, which is used as a template or container for injecting content based on client events, using data obtained from server-side components.

When you use this Java Pet Store application, you will see that the content on the page is changed seamlessly without reloading the entire page. The application also uses Ajax for other features. Figure 1 shows some of the special features.

Figure 1. Java Pet Store 2.0 Home Screen