Formation ExtJS
Présentation formation ExtJS
En complément de nos tutoriaux ExtJS en libre accès , initiez-vous efficacement au développement des interfaces ergonomiques et rapides basées sur le framework ExtJS dont l’efficacité, et les nombreux widgets prêts à intégrer en ont fait une référence pour le développement d’applications riches/Ajax professionnelles.
Découvrez en profondeur l’architecture d’ExtJS, les composants clés, la gestion évènementielle , la manipulation DOM, les Templates, la création de formulaires évolués et les techniques d’accès aux données avec GidPanel ExtJS. Comprenez les nouveautés ExtJS 4 , dont la structuration du code (architecture MVC) et la nouvelle architecture d’accès aux données. Créez progressivement une application ExtJS professionnelle mettant en oeuvre les meilleures pratiques de développement alliant performance et lisibilité du code source.
| Dates (3j) | Tarif (Euros HT) | Audience | Pratique | Financement | Contact | Inscription |
|---|---|---|---|---|---|---|
|
16-18 jan. (Paris) 14-16 mai (Par) 21-23 juin (Paris) |
Inter : 1890 Intra : 5500 |
Développeurs Javascript | 70% |
Opportunités financement |
04 78 29 37 26 | Bulletin inscription |
Logiciels utilisés
ExtJS 4
Firebug
Wamp
Vous allez apprendre à :
Concevoir une application ExtJS 4 avec pattern MVC
Vous initier aux outils : JSBuilder, SDKtools, Ext-Designer, Spket
Migrer une application ExtJS 3 vers ExtJS 4
Comprendre la valeur ajoutée d’ExtJS sur Dojo, Yui, jQuery, Gwt
Comprendre l’architecture d’ExtJS
Maîtriser la notion d’Objet config Extjs
Maîtriser la gestion DOM ExtJS
Maîtriser la gestion d’évènements ExtJS (Observable)
Mettre en oeuvre Template et XTemplate ExtJS
Maîtriser les notions de conteneur, layout
Manipuler plusieurs conteneurs : viewport, Panel, Window
Comprendre le xtype : valeur ajoutée, cas d’utilisation
Mettre en oeuvre BorderLayout
Créer et valider des formulaires Ajax
Créer des menus et barre d’outils professionelles
Créer des appels Ajax avec transport données XML / JSON
Maîtriser le composants de données GridPanel
Maîtrisez la communication entre les composants de vos écrans
Découvrir les nouveautés et le périmètre ExtJS4
Programme détaillé
Introduction
Rappels Javascript
Rappels Ajax : DOM, XML, CSS, JS, XMLHttpRequest, JSON
Historique : de Yui à ExtJS
Installation & Documentation
Modèle de licence
valeur ajoutée d’ExtJS sur Dojo, Yui, jQuery, Gwt
Application Hello ExtJS
Internationalisation I18N
Méthode : conteneur + layout + items + listeners
Objet config
Comprendre la notation
Valeurs par défaut
Lisibilité
Ordre paramètres
Avantages
Architecture MVC
Ext.application
Organisation répertoires & fichiers du projet
clés : name, appFolder, launch
Controlleur : init, control,
Vue
Model
ExtJS 4
+ rapide, + flexible, + facile à apprendre
Thèmes à avec Compass , Saas
modèle MVC
migration Ext3 vers Ext4
Graphes : plus de flash !
nouveaux composants
déploiement : compression
SdkTools
coexistence code Ext3 et Ext4
Manipulation DOM façon ExtJS
Rappel DOM
Différences DOM IE et DOM Firefox
DOM bas niveau : document.getElementById
Méthodes additionelles DOM ExtJS
Type Ext.Element
DOM ExtJS : Ext.get
Différence Ext.get et Ext.fly
Effets spéciaux
Habillage CSS dynamique
Template ExtJS
Notion de template ExtJS
Arbre DOM prédéfini
Compilation template
notion de Template
XTemplate
balise tpl if, tpl for
Gestion Evènement DOM façon ExtJS
Différences gestion évènements IE / Firefox
Unification ExtJS gestion évènements
Ext.util.Observable
addEvent, fireEvent
el.on, el.un
Architecture ExtJS
Module ’Core’
Module Composants UI
Module Services accès données
Module Accès distant (Remoting)
Module Utilitaires
Module Glisser déposer
Conteneur ExtJS
Modèle de composant ExtJS
Différence entre composant et conteneur
Notion de Conteneur
Parent/enfant
Panel, TabPanel, Viewport, Window
xType
Layout ExtJS
Notion de Layout & valeur ajoutée
relation Conteneur / Layout
BorderLayout , Layout accordéon
attributs : region, fit, strech
Hbox, Vbox
Gestion Evènements ExtJS
Bonnes pratiques
Ext.util.Observable
el.on, el.un
addListener
removeListener
addEvents
fireEvents
scope
capture, bubble
Composants
Modèle de composant ExtJS
Ext.Component
Lazy rendering
ComponentMgr
renderTo, applyTo
Cycle de vie
Formulaires ExtJS
Combobox
Champ / zone texte
CheckBox, Boutton radio
zone texte, Editeur de texte
Validation personnalisée
vtype
soumission formulaire
success, failure
handler, listeners
chargement formulaire
Accès données ExtJS
Template, XTemplate
Accès local et distant
Comprendre le GridPanel
Record, Reader
Proxy, Reader, Record
store, ColumnModel
EditorGridPanel
DataView, ListView
