jsTraining

Day One – For beginners

CSS
· CSS selectors
· Floats and CSS positioning
· CSS styling and shortcuts
· CSS specificity
JavaScript
· Basics Overview (variables, conditionals, operators, loops)
· Arrays and Objects
· Functions
· Closures
· setTimeout and setInterval
· this and object binding
· Dynamic function calls
· Asynchronous javascript and callbacks
· Error handling
Manipulating the DOM
· DOM API
· innerHTML
· Document fragments

Debugging and Tools
· Aptana
· Firefox
· Firebug
· Internet Explorer Developer Toolbar
· Safari Console

Day Two – For Basic ExtJs
Fundamental Classes
· Ext.Element
· Ext.CompositeElement
· Ext.DomHelper
· Ext.DomQuery

Event Handling
· Events in Ext
· DOM Events
· Observable classes
· Custom Events
· Event Handlers
· Delegated Event Handling

Component Model
· Overview
· Component Manager
· Deferred Rendering
· Component vs. Element
· Component configuration

Containers and Layout Management
· Containers
· Layout Managers

Ajax
· Creating a Request
· Using Success & Failure callbacks
· Ext.Updater

Ext.data Package
· Connection
· Readers
· Proxies
· Records
· Stores
Templates & DataView
· Template
· XTemplate
· Storing Templates in Markup
· Member formatting functions
· Using Templates with a DataView

Persisting UI State
· Stateful Components
· Provider vs. Manager
· Setting a Provider
· Application Specific State Management

Utility Functions
· Ext.apply & Ext.applyIf
· Function’s defer and createDelegate
· Ext.util.Format

Creating & Extending Classes
· Creating a Class
· Extending a Class
· Extending a Component
· Ext.extend
· Ext.override

Internationalization
· Enabling Locale Support
· Supported Locales
· Globalizing your Components

Hands-on Experience with Common Components
· Viewport
· TabPanel
· GridPanel
· TreePanel
· FormPanel

Day 3 – For Advanced ExtJs Concepts

Custom Components
Do you have a widget that you need but is not already in the Ext JS framework? Work with the trainer to gather requirements about your widget and how to use Ext JS as the underlying foundation to develop your widget.
Building a Theme
Translate your designer’s dream into a full-blown theme for any Ext JS application. You will learn how to create custom themes for use with any project you develop in Ext JS. It includes creating and using sprites and how to override the relevant CSS to generate a skin for each widget.
Drag & Drop
Looking for a custom Drag & Drop implementation? Learn how to implement custom drag and drop for your application.
Application Architecture
Learn how to design or refactor an existing application to adhere to best practices. Creating a solid application architecture is critical in larger applications, particularly when many developers are involved in a single project. By following a consistent architecture you will write cleaner code which is easier to maintain. We will explore the development life-cycle of your project from whiteboard to implementation.
Building Ext and your Project
Learn how to setup, maintain and deploy the JavaScript & CSS for your project. Boost the loading time of your application by generating a single compressed version of your JavaScript & CSS. You will also learn how to slim down Ext JS by removing components which you are not using to maximize performance.

Other resources for learning

http://www.xs4all.nl/~ppk/js/

BrainJar.com, Experiments in Web Programming
http://www.brainjar.com/

The Document Object Model: an Introduction, by Peter-Paul Koch
http://www.digital-web.com/features/feature_2001-5.shtml

JavaScript: The Definitive Guide, 4th Edition
Chapter 17: The Document Object Model
http://www.oreilly.com/catalog/jscript4/chapter/ch17.html

Traversing an HTML Table with JavaScript and DOM Interfaces
http://www.mozilla.org/docs/dom/technote/tn-dom-table/