Ext

Ext JS in Action

Author: Jesus D. Garcia, Jr.
Discount code: extjs40 (40% off until April 1)
Description:

• Part 1: Introduction to Ext JS
  • A framework apart
  • An Ext JS primer
  • A place for components
  • Organizing components
• Part 2: Ext components
  • Building a dynamic form
  • The venerable Ext DataGrid
  • Taking root with Ext Trees
  • Toolbars and menus
  • Advanced element management
  • The Ext toolbox
  • Drag and drop
• Part 3: Building a configurable composite component
  • Developing object-oriented code with Ext
  • Building a composite widget
  • Applying advance UI techniques

The author, Jesus Garcia is a long-time member of the Ext JS forums with a well-documented history of helping others in his 7600+ posts. His book, Ext JS In Action, will make an excellent companion to Learning Ext JS below, since it takes a more-technical bottom-up approach to teaching Ext JS. Mr. Garcia demonstrates a thorough understanding of low-level DOM manipulation and event-handling, including the differences between browsers.

The book contains many excellent diagrams primed for printing and posting beside your monitor, like the following illustration of the Ext class hierarchy depicting common descendants of Ext.Component:

Though still in development, this excellent book for both Ext JS new-comers and advanced developers alike is currently available through the Manning Early Access Program. Says Steven Hong of Manning Publications:

“I’ve taken the liberty of setting up a discount code for your readers to use. Until April 1, your readers can use the code extjs40 at www.manning/garcia to receive 40% off the retail value of the book”

We at Ext JS thank Manning Publications for their generous offer to our community.

Learning Ext JS

Authors: Shea Frederick, Colin Ramsay, Steve “Cutter” Blades
Description:

• Chapter 1 introduces you to the process of installing the required Ext JS library files, and setting up a basic page that displays an alert-style message. This provides us with a way to test whether your setup was done correctly, and whether you’re ready to play with some code. We also cover how to set up other base libraries such as jQuery, YUI, and Prototype, to work in conjunction with Ext JS.
• Chapter 2 covers how to interact with the web page and the user. With example code that uses simple components, we quickly start to see the level of user interactivity that Ext JS provides right out of the box. We assemble a series of dialogs that appear and modify the existing pages depending upon the users’ inputs.
• Chapter 3 launches us into using the first major widget—forms. We start by creating a simple form with three fields, explore the different form field types, and then add some simple validation to our form. From there we move on to creating custom validation and database-driven combo-box’es and handling form submissions.
• Chapter 4 provides an overview of how to use toolbars and buttons within your
  application. These components are typically undervalued, yet they provide crucial user interface functions. We jump straight into creating toolbars with buttons, split buttons, and menus, along with adding mechanical elements such as spacers and dividers. Next, we cover customizing the toolbar with stylized icon buttons and form fields.
• Chapter 5 covers grids—the most widely-utilized component in the Ext JS library. In
  this chapter, we learn how to set up a grid panel using both local and remote data, and in both in XML and JSON formats. We also discuss how to prepare different data types and how to create renderers that will style and format the data to your preference. Using the selection model and paging are among the many interesting points covered in this chapter.
• Chapter 6 dives into editor grids. Here, we learn how to set up an editor grid using
  different form field types, and how to save changes made in the grid back to the server or database. We also discuss tactics for adding and removing rows of data to and from our data store, and the server or the database.
• Chapter 7 explores the concept of using the layout component to bring all the portions of your application together into a cohesive web application. We start by using a viewport with a border layout to contain the many parts of our application. From there we are able to add other layout features such as tab panels, accordions, and toolbars. We finish up by learning how to nest layouts and make dynamic changes to the layout components.
• Chapter 8 discusses the presentation of hierarchical information using the Ext JS Tree support. Using real-world examples of hierarchical data, you will discover how to display and manipulate a Tree view. You will use AJAX techniques to persist the modifications to a server and learn how to tweak the Tree to support advanced scenarios.
• Chapter 9 demonstrates how Ext JS can provide attractive user prompts that can either present information or accept input. We then discuss the extension of these dialogs in the form of Ext.Window, a fully-fledged means of creating customizable pop-up windows.
• In Chapter 10, we take a tour of the visual effects available in the Ext JS effects package. You will learn how to apply animations to create smooth transitions and notifications to enhance the user experience.

Well-written and well-produced, Learning Ext JS takes a top-down approach to teaching Ext JS, which might be daunting for those having little experience with the framework. However, this approach will certainly immerse the reader quickly into a number of common techniques used througout the framework, like XType, configuration objects and common component configuration parameters.

After starting off with an excellent tutorial on how to download and include the library’s JavaScript & CSS assets, the authors quickly jump full-force into Ext forms in the third chapter and beyond, guiding the reader through all of Ext’s high-level widgets using an evolving “movie database” application with server-side code examples in both php and ColdFusion.

var store = new Ext.data.GroupingStore({
  url: 'movies.json',
  sortInfo: {
    field: 'genre',
    direction: "ASC"
  },
  groupField: 'genre',
  reader: new Ext.data.JsonReader({
    root:'rows',
    id:'id'
  },fields);
});
var grid = new Ext.grid.GridPanel({
  renderTo: document.body,
  frame:true,
  title: 'Movie Database',
  height:400,
  width:520,
  store: store,
  autoExpandColumn: 'title',
  columns: // column model goes here //,
  view: new Ext.grid.GroupingView()
});

In the final chapters, the authors provide some excellent material in more advanced topics, like Ext’s data package, extending Ext core classes with Ext.extend, overriding initComponent & onRender in your extensions and organizing your extensions into separate files. If you’ve already got experience with Ext JS, this book will do wonders in focusing your skills.

Ext JS Projects with Gears

Author: Frank Zammetti
Description (by the author)

• Nine chapters in total. The first is your typical “Intro to Ext JS”. I start with a few pages on RIA development, the evolution of web development in general, etc. I talk about how there’s now a lot of choices in toolkits and of course wind up saying that Ext JS is the best of the bunch IMO I then quickly give a basic first application with Ext JS (not much more than “hello world”). Then it’s on to some details… things like Ext JS’s overall structure, the stuff added to intrinsic classes, then the stuff directly under the Ext namespace. I then go into Ext.util in some detail.
• Chapter 2 is the more “advanced” introduction… I cover the inheritance model behind widgets, the basics of widget usage, then details about the concept of layout and layout managers. I then cover most of the core widgets in some detail. I also talk about the data subsystem, templating capabilities, drag-and-drop and state management. I also talk a bit about plugins and some of the great user extensions out there. This chapter also introduces Gears, which although the lesser player in the game is a big part of the chapters to follow.
• Chapters 3-9 are the project chapters. Each of them presents a sovereign, unique, full application using Ext and Gears. This is the meat of the book (the “practical projects”!). The idea here is learn-by-example (and learn-by-doing because the end of each chapter presents suggested exercises to the reader).

In the Ext forum-post where Mr. Zammetti introduced Ext JS With Gears, he stresses:

“Keep in mind that this book is in no way trying to be an exhaustive, detailed look at Ext… I purposely had to leave some things out, but I tried my best to cover everything that I thought was most relevant to a modern web developer.”

Frank Zammetti is a prolific writer at Apress, authoring five books there so far.