Bleext

Ext JS 4 introduces a file upload system on demand, something that was sorely missing in previous versions, if you need to use this new class loading system there are certain rules and conventions that we need to follow in order to make our lives easier.

Here are the conventions to consider when defining a class if we want to use the Ext Loader class to load our classes dynamically.

Classes and files with the same name

When trying to load a class we do it by its name, which is why it is very important that both, the name of the class and the name of the file are identical. That is, if we create a class called “User” we must create a file called “User.js” that will contain the code.

// User.js
Ext.define("User",{
    name  : "John"
});

Using “Camel case” for class names

We recommend using “camel case” to define the class name, this will allow us to easily differentiate between a class and a package, for example User, Role, UserRole.

Ext.define("UserView",{
    name  : "John",
    // ...
});

Ext.define("UserGrid",{
    name  : "John",
    // ...
});

Namespaces in lowercase

The packages should be name in lowercase to easily differentiate between classes and packages:

Ext.define("Bleext.users.controller.UserController",{
    // ...
});

Ext.define("CRM.security.groups.view.GroupsGrid",{
    // ...
});

Packages as folders

Usually when we create a class we define it in a “namespace” (if you still do not: do it!), it is recommended that for every “dot” there must be a physical folder, for example, if we have a class called “Bleext.users.controller.UserController” there should be a file in the path “Bleext/users/controller/UserController.js”, this is very important so the Loader can work properly.

// Bleext/users/controller/UserController.js
Ext.define("Bleext.users.controller.UserController",{
    // ...
});

// CRM/security/groups/view/GroupsGrid.js
Ext.define("CRM.security.groups.view.GroupsGrid",{
    // ...
});

Avoid using numbers in the names

Avoid the use of numbers in package names or class names like Users4Roles, Class2 and similar names should be avoided. Let’s try to assign meaningful names and properly packaged. Avoid using acronyms in class is also recommended.

But there’s always an exception to the rule, since there are algorithms such as MD5 or SH4 we can use for a class name and the some acronyms like HTTP can be used if necessary.

Avoid using underscores

Avoid using the underscore (_) to separate words in the name of a class or package; User_Role, User_Grid are examples of names that we should avoid using.

//evitar esto
Ext.define("Bleext.users.controller.User_Controller",{
    // ...
});

These are only conventions, nobody is obliged to follow them but if we use them we can use the Loader in a very simple, in the following tutorial I will talk about it more.

We’re planning to write more tutorials about Ext JS, follow us on twitter, subscribe to our mailing list or our feeds if you want to receive our updates.

Comments