Sencha Ext JS Framework (EXTJS)

Programming, JavaScript

Participants gain hands-on experience building large JavaScript applications, learning practical techniques for app structure and development workflow. The course explains the Ext JS framework, its main classes and components and how to combine them.

Through guided examples and documentation practice participants learn to reuse code, create custom components and read the Ext JS docs effectively. The course covers debugging, testing, using sample apps and techniques to build maintainable, scalable applications.

Location, current course term

Contact us

Custom Customized Training (date, location, content, duration)

The course:

Hide detail
  • Concept of Ext JS
    1. The right editor and toolchain
    2. Many folders and files…
    3. Bundling files and delivering to the client, browser-based development
    4. Architectures for individuals and teams
    5. First simple application
    6. Ext JS documentation and how to use it
  • Where to find MIT-licensed code for Ext JS?
    1. Sencha Market
    2. Pimcore CMS, Koala web framework, Aero SQL
  • Layouts for admin applications in Ext JS
    1. Window and overlay dialog system (pros / cons)
    2. Border layout (splitting space into adaptable docks)
    3. Fit layout (auto-fitting)
    4. HBox layout (horizontal)
    5. VBox layout (vertical)
    6. Accordion layout
    7. Others – absolute, table and anchored layouts
    8. Layout browser
  • Code architecture
    1. Integration with jQuery, Prototype, etc.
    2. Building Ext JS apps with MVC architecture
    3. Event-driven architecture – buttons, toolbars, menus, context menus
    4. Automating AJAX operations
    5. Models, validation and data stores
  • Working with forms
    1. Form Panel component
    2. Basic fields: text, number, combo box, date, checkbox, radio
    3. Special fields – slider, date picker, multiselect with search, custom fields
    4. Events and client/server form validation
  • Components
    1. Windows
    2. Tree structure – simple tree, tree store, tree nodes
    3. Tree operations – adding/removing nodes and special cases
    4. Grid / item list (GridPanel) – basic setup, columns, cell and row editors, sorting and filtering, data binding (models and stores)
    5. Grid – server integration and CRUD operations
    6. Grid – AJAX proxy, JSON reader, XML reader
    7. Toolbar
    8. TabPanel – basic config, dynamic add/remove, dynamic content, overflow, tabs in forms, special cases
    9. Combining components
  • Drag and drop
    1. Creating draggable items
    2. Creating drop targets and handling dragged objects
  • Charts and diagrams
    1. Chart types
    2. Legends
    3. X and Y axis configuration
    4. Advanced charts and configuration
    5. Connecting charts to components and animations
Assumed knowledge:
Use Windows or Mac OS, abstract thinking, good HTML/CSS and excellent JavaScript; English or a C‑style language is a plus.
Recommended previous course:
JavaScript for Beginners (JVS1)
Schedule:
2 days (9:00 AM - 5:00 PM )
Language: