• Choose a category
• All
• Classic-Fiction

By Root 4182 0

and a template system. Our garment store example also demonstrated the way in which design patterns and refactoring go hand in hand. Creating a perfectly designed piece of code the first time round is difficult, but refactoring an ugly-but-functional bit of code such as listing 3.4 to gradually bring in the benefits of design patterns is possible, and the end results are every bit as good.

Finally, we looked at third-party libraries and frameworks as another way of introducing order to an Ajax project. A number of libraries and frameworks are springing up at present, from simple cross-browser wrappers to complete widget sets to end-to-end solutions encompassing both client and server. We reviewed several of the more popular frameworks briefly, and we will return to some of them in later chapters.

In the following two chapters, we’ll apply our understanding of refactoring and design patterns to the Ajax client and then to the client/server communication system. This will help us to develop a vocabulary and a set of practices that will make it easier to develop robust and multifeatured web applications. 3.7 Resources

Martin Fowler (with coauthors Kent Beck, John Brant, William Opdyke, and Don Roberts) wrote the seminal guide to refactoring: Refactoring: Improving the Design of Existing Code (Addison-Wesley Professional, 1999).

Erich Gamma, Richard Helm, Ralph Johnson, and John Vlissides (also known as “The Gang of Four”) wrote the influential Design Patterns (Addison-Wesley Professional, 1995). Licensed to jonathan zheng

116

CHAPTER 3

Introducing order to Ajax

Gamma later went on to become architect for the Eclipse IDE/platform (see appendix A), and discusses both Eclipse and design patterns in this recent interview: www.artima.com/lejava/articles/gammadp.html. Michael Mahemoff has recently set up a website devoted to cataloging Ajax design patterns: www.ajaxpatterns.org.

Licensed to jonathan zheng

Part 2

Core techniques

Now that you know what Ajax is all about, we’ll cover the core techniques for designing an application. Our goals are to design code that is flexible, maintainable, and fun to work with. Chapter 4 looks at ways of getting the client code in shape, and keeping the CSS, HTML, and JavaScript out of each other’s hair. Chapter 5 looks at ways of interacting with the server, and how to manage communication between the client and server tiers.

Licensed to jonathan zheng

Licensed to jonathan zheng

The page as

an application

This chapter covers

■

Organizing complex user interface code

■

Using the Model-View-Controller pattern

with JavaScript

■

Separating presentation from logic for

maintainable code

■

Creating a flexible event-handling mode

■

Generating the user interface directly from

your business objects

119

Licensed to jonathan zheng

120

CHAPTER 4

The page as an application

In chapters 1 and 2 we covered the basic principles of Ajax, from both a usability and a technology perspective. In chapter 3 we touched on the notion of creating maintainable code through refactoring and design patterns. In the examples that we’ve looked at so far, this may have seemed like overkill, but as we explore the subject of Ajax programming in more depth, they will prove themselves to be indispensable tools.

In this chapter and the next, we discuss the details of building a larger, scalable Ajax client, and the architectural principles needed to make it work. This chapter looks at the coding of the client itself, drawing heavily on the ModelView-Controller (MVC) pattern that we discussed in chapter 3. We’ll also encounter the Observer and other smaller patterns along the way. Chapter 5 will look at the relationship between the client and the server.

4.1 A different kind of MVC

In chapter 3, we presented an example of refactoring a simple garment store application to conform to the MVC pattern. This is the context in which most web developers will have come across MVC before, with the Model