Click to search on your search term.

Ext JS 6 Build Your Own Bootcamp

ExtJS 6 Bootcamp is an instructor-led course designed to introduce you to the fundamental concepts of building cross-browser compatible mobile and desktop apps using Sencha Ext JS 6.2+. The 600 page coursebook was developed by Fig Leaf Software and is based on our deep-experience with Ext 6 application development and Sencha Architect.

Please note the following:

  • This course is for on-site, private engagements only.
  • You may select from any of the topics listed in the outline.
  • The course can run from a minimum of 3 to a maximum of 15 days (8 days of instructor-led training, followed by up to 8 days of additional labs and mentoring).
  • Price is $3500 USD per day + Travel and Expenses for up to 12 students.


Duration: 5 days

Price: 3500.00
Online Price: Not Available

Course Prerequisites

To realize the maximum value from this bootcamp, prospective students should have:
  • Intermediate-level experience with JavaScript
  • Intermediate-level experience with CSS / HTML 5
  • Familiarity with full-stack web application development concepts

Course Objectives

  • Rapidly develop applications for multiple browsers, form factors, screen resolutions, and devices.
  • Load data from remote servers.
  • Output structured data into different views- including grids, trees, charts, custom markup, and tab-based forms.
  • Render and manipulate PDF, image, and spreadsheet file assets.
  • Efficiently handle user interactions.
  • Implement drag & drop interfaces.
  • Save data to a database
  • Upload files to an application server
  • Persist user settings between sessions.
  • Theme your applications with custom icons, colors, and backgrounds.
  • Use responsive configurations to change the layout of your application based on form factor.
  • Create optimized production builds of your apps.
  • Create and run automated test scripts to identify bugs in your app.
  • Generate world-class searchable and cross-indexed documentation for your source code.
  • Extend the capabiliities of the Ext JS 6 framework

Course Outline

Unit 1: Introducing the Course - [CLICK HERE TO DOWNLOAD UNIT 1 (PDF)]

Unit 2: Getting Started with the Ext 6 Classic Toolkit

  • Introducing Sencha Ext JS 6.x
  • Reviewing Application Architecture
  • Introducing the Class System, MVC, and MVVM Architectures
  • Generating App Scaffolding with Sencha Cmd
  • Sharing Code Between the Classic and Modern Frameworks
  • Using the API Docs
  • Debugging and Troubleshooting Your App
  • Getting Help from the Sencha Network

Unit 3: Defining Views

  • Deep-Diving Into the Sencha Class System
  • Creating Component Views
  • Working with Containers
  • Working with Panels, Toolbars, Buttons, and Menus
  • Introducing ViewControllers
  • Working with Tab Panels
  • Instantiating Views from Routes / Supporting the Browsers "Back" Button
  • Implementing Windows and Floating Components
  • Implementing a Dashboard with Draggable Portlets

Unit 4: Interfacing with an App Server

  • Initiating Background Data Requests
  • Implementing User Authentication and Authorization
  • Binding to a ViewModel
  • Defining Data Models
  • Defining Data Connections
  • Loading Multiple Records into a Store

Unit 5: Implementing Grids

  • Viewing Stores in Grids
  • Exporting Data from Stores/Grids
  • Using Grid Widgets
  • Handling Large Datasets
  • Grouping Grid Data
  • Using Grids to Edit Data

Unit 6: Generating Markup from Data

  • Working with XTemplates
  • Generating Markup from Stores with the DataView
  • Handling Multimedia
  • Animating the DataView

Unit 7: Using Trees to Manage Hierarchies

  • Working with Tree Models and Tree Stores
  • Implementing a Tree Grid
  • Working with Heterogeneous Node Types
  • Implementing Editable Trees

Unit 8: Visualizing Data in Charts

  • Getting Started with Charts
  • Generating Bar, Column, and Line Charts
  • Generating Gauges

Unit 9: Maintaining State

  • Introducing State Management
  • Adding State Management Capabilities to Non-Stateful Components

Unit 10: Implementing Data Entry Forms

  • Introducing Ext JS 6 Forms
  • Integrating the TinyMCE 4 WYSIWYG Editor
  • Synchronizing a Grid to a Form
  • Applying Data Validation on the Client and Server
  • Submitting Data to the App Server
  • Handing File Uploads

Unit 11: Theming Your Application

  • Introducing Theming, Sass, and Compass
  • Working with Variables and Rules
  • Using Mixins
  • Implementing Responsive Design

Unit 12: Going into Production

  • Documenting your App with JSDuck
  • Unit Testing your App with Jasmine and Siesta
  • Creating Testing and Production Builds

Unit 13: Special Topics in Ext JS

  • Patching and Extending the Library
  • Building Custom Components with Ext.Element

Unit 14: Building Mobile Apps with the Modern Framework

  • Leveraging code from the Classic Framework
  • Using Modern Framework View Components
    • Viewport
    • Tab Panel
    • Titlebar
    • NavigationView
    • List
    • Carousel
    • Grid
    • Forms and Input Fields
    • Video
  • Theming your Modern Framework App

Unit 15: Using Sencha Architect to Improve your Productivity

  • Creating a Project
  • Creating Views
  • Adding Custom Code
  • Theming your App

Lab A - 4 Day Lab Building a Simple Universal App (Congressional Earmarks)

Lab B - 5 Day Lab Building a Complex Universal App (ProposalManager)

Fig Leaf has provided training in the following cities:

Alexandria VAAmsterdamArlington VAAtlantaAustinBaltimore
BangaloreBostonCharoltteChicagoColumbusDallas
DenverDes MoinesDetroitDubaiEdmontonGeneva
HoustonIndianapolisJacksonvilleLas VegasLondonLos Angeles
MadridMiamiMilwaukeeMinneapolisNew HavenNew York
OttawaPhiladelphiaPhoenixRaleigh / DurhamRestonRome
SacramentoSan AntonioSan DiegoSan FranciscoSan JoseSeattle
SingaporeSpringfieldState College PATallahasseeTorontoWashington DC