разделение кода extjs приложения
 

добрый день , подскажите плз , как привильно\можно разделить код extjs приложения, то читаемость кода уже почти нулевая, что хочу.
есть сейчас файл index.html в нем

Ext.onReady(function () {
});

где все реализовано, а хочу всё разделить по отдельным файлам.
require припиан

Ext.require(['*']);

подскажите плз

я думаю, что уже поздновато писать....
но какая версия ExtJS?

4.2.1, а почему поздновато?

Привет!
Если вопрос всё ещё актуален, напишу как делаю я. Сам только что начал освоение ExtJS, версия 4.2.1

В корне статических файлов проекта: index.html, app.js, папка app с моим кодом и папка extjs с библиотекой.
В заголовке index.html строки:

<link rel="stylesheet" type="text/css" href="extjs/resources/css/ext-all.css" />
<script type="text/javascript" src="extjs/ext-all.js"></script>
<script type="text/javascript" src="app.js"></script>

В файле app.js:

Ext.Loader.setConfig({
    enabled: true
});

Ext.application({
    name: 'Docu', // имя проекта
    autoCreateViewport: true,
    views: ['DocWindow', 'ClsPanel', 'SearchWindow', 'GeneralPanel']
});

В папке app лежит подпапка view, в которой находятся файлы с определениями моих окошек и панелей:
DocWindow.js
ClsPanel.js
SearchWindow.js
GeneralPanel.js
а кроме того, там же лежит файл Viewport.js, который просто ссылается на мою GeneralPanel:

Ext.define('Docu.view.Viewport', {
    extend: 'Docu.view.GeneralPanel',
    renderTo: Ext.getBody()
});

Более полное и подробное описание организации файлов проекта можно посмотреть в документации или в русском переводе здесь:
Архитектура приложения и MVC