...

Formation Sencha Ext-JS 5, développer des applications multiplateformes en JavaScript


Objectifs
  • Développer des applications Web riches (RIA) et interactives pour mobiles ou Desktop
  • Savoir créer des applications MVC / MVVM
  • Savoir créer et mettre en oeuvre des composants graphiques
  • Pouvoir gérer des données
  • Etre capable d'élaborer des thèmes
Participants
  • Développeur Web
Approche Pédagogique
  • Cas pratiques
  • Remise d’outils
  • Echanges d’expériences
  • Durée : 3 jours
  • Réf. : WEB59

Dates de Formations

24 au 26 Avril 2019

19 au 21 Juin 2019

07 au 09 Aout 2019

23 au 25 Oct. 2019

25 au 27 Déc. 2019

Programme
  • 1/ Philosophie et premiers pas avec ExtJS 5
    • • Philosophie et concepts
    • • Positionnement dans le monde des RIA (Flex, Silverlight, GWT, etc.)
    • • Valeur ajoutée de ExtJS sur d'autres Framework (Dojo, Yui, jQuery, Gwt, ...)
    • • Installation et paramétrage
    • • Ou trouver de l'aide ?
    • • Structure générale d'une application utilisant ExtJS
  • 2/ Le modèle MVVM avec ExtJS 5
    • • Vocabulaire et concepts
    • • Qu'est-ce qu'une vue (view) ?
    • • Rôle de l'élément ViewModel (databinding avec la View)
    • • Rôle de l'élément Model (méthodes et événements avec le ViewModel)
    • • Classes extJS permettant la mise en oeuvre du modèle MVVM (View, ViewModel, Model)
    • • Organisation des fichiers et des répertoires
    • • La gestion des événements dans Ext JS (contrôleur, listener, ...)
    • • Analyse détaillée du cycle de vie de l'ensemble de l'application (chargement, événements utilisateurs, accès serveur, affichage, etc.)
    • • Exemple de mise en oeuvre
  • 3/ Communication avec le serveur (XML, JSON, Ext Direct)
    • • Ajax dans le contexte de ExtJS
    • • Accéder aux données du serveur par flux XMl ou JSON
    • • Config object et JSON
    • • Règles syntaxiques des objets JSON
    • • Transformer une chaîne JSON en objet, tableau, etc.
    • • Quel intérêt d'utiliser Ext Direct ?
    • • Quelques exemples de synthèse
    • • Le gestionnaire de session (Ext.data.Session)
  • 4/ Gérer les données avec ExtJS 5
    • • Accès local et distant
    • • Manipulation des données statiques
    • • Template et Xtemplates
    • • Tri et regroupement
    • • Utilisation d'un Proxy pour accéder aux données
    • • Associer des modèles de données (Ext.data.Model, Ext.Data.Store)
    • • Graphe des objets du modèle métier
    • • La validation des données
  • 5/ Construire une interface (conteneur, panel, layout)
    • • Différences entre composant et conteneur
    • • Les conteneurs et les panels
    • • Un layout pour gérer la disposition des panels
    • • Variantes avec les layouts (fit, absolute, accordion, ...)
    • • Personnaliser un layout
    • • Exemples de combinaisons
  • 6/ Les composants de base (fenêtre, formulaire, etc. )
    • • Fenêtres
    • • Création d'un formulaire
    • • Cycle de vie d'un formulaire (chargement, validation, etc. )
    • • Les fondamentaux (champs, toolbar, checkbox, bouton radio, etc. )
    • • Les styles CSS
    • • Composants personnalisés
    • • Navigation entre les composants
    • • Le drag and drop
  • 7/ Présentation avancée (grille, arbre, etc. )
    • • Affichage de données structurées dans une grille
    • • Formatage et mise en forme de cellule
    • • Evénements et cellules
    • • Manipulation de la grille
    • • Treeview et variantes (multiple trees)
    • • Chargement de données dans un arbre
    • • Filtrage et édition des données
    • • Graphiques et dessin
    • • Ajouter un composant dans les cellules d’une grille pour la visualisation des données
  • 8/ Professionnaliser son application avec Ext JS 5
    • • La charte du développeur
    • • Conseils sur l'organisation du code
    • • Recommandations sur les types de données
    • • Anticiper les problèmes classiques avec les différents navigateurs
    • • Internationaliser son application (traduction)
    • • Localisation (langue, fuseau horaire)
    • • Quel format pour le livrable ?
    • • Le déploiement
    • • La gestion des URL dans le routage
    • • La mise en commun d’un core pour les programmes ExtJS et Touch
  • 9/ Le développement mobile pour ExtJS 5
    • • Le support des plateformes tactiles avec ExtJS 5
    • • Classes et composants utilisés
    • • Comment gérer une mise en page « responsive » ?
    • • Une charte graphique optimisée pour les équipements mobiles