Ext JS

From Organic Design

Ext JS 4 (actually a part of the Sencha bundle now) is a major step forward for web frameworks. Building on Ext JS 3.3, our latest release adds over 350 new APIs, 50 new classes, and 65% more documentation. Ext JS 4 also brings an entirely new data package that enables developers to use a model-view-controller architecture when building their app. The new MVC enables apps to leverage features like Infinite Scrolling a Grid to build an entirely new level of interactivity in to web apps.


There has been some controversy over the license as it's not properly libre now, there are restrictions on commercial usage.


Ext JS 4 comes with a new application architecture that not only organises your code but reduces the amount you have to write.

Our application architecture follows an MVC-like pattern with Models and Controllers being introduced for the first time. There are many MVC architectures, most of which are slightly different from one another. Here's how we define ours:

  • Model is a collection of fields and their data (e.g. a User model with username and password fields). Models know how to persist themselves through the data package, and can be linked to other models through associations. Models work a lot like the Ext JS 3 Record class, and are normally used with Stores to present data into grids and other components
  • View is any type of component - grids, trees and panels are all views.
  • Controllers are special places to put all of the code that makes your app work - whether that's rendering views, instantiating Models, or any other app logic.

The ExtJS MVC guide takes you through creating a very simple application that manages User data. By the end you will know how to put simple applications together using the new Ext JS 4 application architecture.

The application architecture is as much about providing structure and consistency as it is about actual classes and framework code. Following the conventions unlocks a number of important benefits:

  • Every application works the same way so you only have to learn it once
  • It's easy to share code between apps because they all work the same way
  • You can use our build tools to create optimized versions of your applications for production use

See also