Page 203 - CATALOGUE AGINIUS 2020
P. 203
Développement et Méthodes Développement et Méthodes
Javascript pour le développement Web Développement JavaScript avec JQuery Développement AJAX Ext JS
3 jours 3 jours 3 jours 3 jours
Objectifs Ref. 4-JA-SCRI Objectifs Ref. 4-JA-JQU Objectifs Ref. 4-AX-DEVE Objectifs Ref. 4-JS-EXT
• Écrire et déboguer des programmes JavaScript • Rédiger facilement et de manière maintenable les interactions JavaScript • Savoir développer des applications en utilisant la technologie Ajax • A l’issue de notre formation «ExtJS», vous serez en mesure de:Savoir
• Ajouter l’interactivité et des graphiques dynamiques à votre site Web de vos page Web à l’aide de jQuery : animations, validation, AJAX et autres utiliser ExtJS pour développer et créer des applications Mobile et Web
• Créer des formulaires interactifs pour saisir et valider informations entrées fonctionnalités caractéristiques du Web 2.0 Public • Utiliser Sencha Cmd 6 pour concevoir la structure d’une application ExtJS 6
pour les utilisateurs • Maîtriser l’accès aux données via Model / Proxy / Store
• Personnaliser des pages en utilisant les cookies Public • Développeurs Web • Modifier conteneurs et layouts
• Comprendre et vous approprier les composants de données GridPanel
Public • Chef de projet, développeur Prérequis Public
• Développeurs, administrateurs de systèmes, webmaster Prérequis • Formation initiale ou expérience en développement informatique requise, • Développeurs
connaissance et pratique régulière de Javascript et XML.
Prérequis • Formation initiale ou expérience en développement informatique requise Moyens pédagogiques Prérequis
• Formation initiale ou culture générale en développement informatique • Connaissances préalable du langage HTML et notions de base de Ja- • Connaître JavaScript est un plus
vaScript
requise Moyens pédagogiques • Formateur expert dans le domaine
• Mise à disposition d’un ordinateur, support de cours remis à chaque
Moyens pédagogiques participant, vidéo projecteur, tableau blanc et paperboard Moyens pédagogiques
• Formateur expert dans le domaine • Feuille de présence signée en demi-journée, évaluation des acquis tout au
• Formateur expert dans le domaine • Mise à disposition d’un ordinateur, support de cours remis à chaque long de la formation, questionnaire de satisfaction, attestation de stage • Formateur expert dans le domaine
• Mise à disposition d’un ordinateur, support de cours remis à chaque
• Mise à disposition d’un ordinateur, support de cours remis à chaque participant, vidéo projecteur, tableau blanc et paperboard participant, vidéo projecteur, tableau blanc et paperboard
participant, vidéo projecteur, tableau blanc et paperboard • Feuille de présence signée en demi-journée, évaluation des acquis tout au • Feuille de présence signée en demi-journée, évaluation des acquis tout au
• Feuille de présence signée en demi-journée, évaluation des acquis tout au long de la formation, questionnaire de satisfaction, attestation de stage long de la formation, questionnaire de satisfaction, attestation de stage
long de la formation, questionnaire de satisfaction, attestation de stage
Programme
1. Introduction 9. La gestion Evènement DOM façon
Programme Programme Programme • ExtJS 6 : Web & Mobile ExtJS
• Les différences gestion
• La mise en oeuvre Objet Config
2. L’architecture application ExtJS 6 évènements IE / Firefox
• Les modes: Modern & Classic • L’unification ExtJS gestion
1. Le modèle de programmation JavaScript 1. Introduction 1. Introduction à Ajax • Les répertoires évènements
• Conventions de formatage et de codage • Présentation de jQuery • Les objectifs • Les fichiers modern.json, classic. • Ext.util.Observable
• addEvent, fireEvent
• Imbrication de JavaScript dans HTML • Intérêts de jQuery • Ajax et l’accessibilité json • el.on, el.un
• Problèmes de la sécurité et règles de sécurité des navigateurs • Installation, accès • Principes de fonctionnement • L’architecture MVVM 10. Le conteneur ExtJS
2. La syntaxe JavaScript • La « philosophie » de jQuery • Des exemples de développement Ajax : Gmail, GMaps, google Suggest... 3. La méthodologie création écrans • La classe Ext.container.Container
dans ExtJS
• Déclaration des variables et des tableaux • Où placer son code jQuery • Environnements de développement Ajax • Choisir son conteneur • Le modèle de conteneur ExtJS
• États, opérateurs et expressions relationnelles 2. L’objet jQuery 2. Rappel XML • Choisir son Layout • La différence entre composant et
conteneur
• Les conditions avec if et else • Les objets jQuery et $ • La structure XML • Choisir son composant • Parent/enfant
• Exécution de boucles avec while et for • Les méthodes et propriétés • La syntaxe XML • L’insertion des composants (items) • Panel, TabPanel, Viewport, Window
• Définition et invocation de fonctions • Enchaînement des méthodes • La validation des documents, comment créer des documents XML valides • Création d’un gestionnaire • xType
d’évènement
3. Utilisation d’objets intégrés • Fonctions, callbacks, et fonctions imbriquées 3. XML et JavaScript • L’association composant / 11. Layout ExtJS
• L’objet String et manipulations de chaînes • Bien différencier les objets DOM et jQuery • Présentation XSLT gestionnaires • La notion de Layout & valeur
• L’ensemble des objets Mathématiques 3. Sélection • Le format RSS • L’analyse classes Container, ajoutée
• Manipulation des dates avec l’objet Date • L’intérêt d’une sélection efficace • La classe XMLHttpRequest Component • La relation Conteneur / Layout
4. Utilisation d’objets des navigateurs • Sélection CSS : id, class, parenté, position, ... • Dialogue synchrone et asynchrone avec JavaScript 4. Le modèle de classe ExtJS • Layout clé : BorderLayout
• Les attributs : region, fit, stretch
• Interaction avec le navigateur • Sélection d’un objet DOM 4. Les patterns Ajax • L’instanciation • Hbox, Vbox
• Ext.define, Ext.require
• Utilisation de boîtes de dialogue pop-up et guide de saisie utilisateur • Sélection par attribut : sélectionné, visible, survolé, ... • Threads et traitements asynchrones • La gestion dépendances 12. La gestion des évènements ExtJS
• Ouverture, fermeture et écriture de nouvelles fenêtres navigateur • Sélections booléennes : tout sauf, non, ... • Sécurité • Mixins, Config • La classe Ext.dom.Element
• Manipulation de frames 4. jQuery et le DOM 5. Travaux pratiques • La création getters/setters • L’évènement sur un noeud DOM :
• Écriture de la ligne d’état du navigateur • Parcourir le DOM • Création d’un site Web avec Ajax et PHP • Les méthodes Statics méthodes on(), un()
• Détermination du type et de la version du navigateur • Modifier le DOM : ajouter, remplacer, supprimer 5. L’accès aux données ExtJS • L’évènement sur un composant
ExtJS : clé ‘listeners’
5. Traitement des événements des navigateurs • Manipuler le texte et les attributs • Définir Model / Proxy / Store • La propagation d’un évènement :
• Interception des traiteurs d’événements JavaScript • Lire et modifier les classes • Model : associations, validation capture, bubble
• Proxy : client , server, reader, writer
• Déclenchement de l’interaction par des actions des utilisateurs 5. jQuery et les CSS • Store : filtre, tri, grouping • Scope
• Ordonnancement de tâches futures avec la synchronisation événements • Attributs simples : couleurs, bords, etc • La clé ‘api’de store 13. Les composants ExtJS
6. Utilisation des cookies pour la persistance • Manipulation à l’aide des classes • Les opérations CRUD • Le modèle de composant ExtJS
• Le fonctionnement des cookies • Taille et positionnement • HTML5 : webStorage, • Ext.Component
SessionStorage
• Lazy rendering
• Création, lecture et manipulation et limite des cookies • Opacité 6. Le composant GridPanel ExtJS • ComponentMgr
7. Sécurité de JavaScript • Déplacements, replis, fondus, ... • La clé ‘store’et ‘columns’ • renderTo, applyTo
• Animations, transitions
• Protection des données privées de l’utilisateur • Effets : menus, carrousels, zooms, etc • La notion de ‘features’: • Le cycle de vie
• JavaScript et ActiveX authentifiés par une authorité de confiance 6. Gestion des évènements SummaryFeatures 14. Les formulaires ExtJS
• Explications des attaques de type spoofing et DoS • La notion de ‘plugins’: • La validation des champs
RowEditorPlugin
8. Validation des formulaires côté client • Réagir sur un évènement • La gestion évènements • Le remplissage Combo avec Ajax
• La soumission du formulaire
• Clavier, souris
• Manipulation des champs des formulaires • Gérer dynamiquement les gestionnaires d’évènements • Infinite Grid • handler, listeners
• Vérification à la volée des champs des formulaires 7. La manipulation DOM façon ExtJS • Le chargement du formulaire
• Validation des entrées des utilisateurs sans CGI 7. Échanges avec le serveur : AJAX • DOM bas niveau : document. • fieldDefaults
• Accès aux boîtes de sélection d’options • Le concept d’échanges asynchrones avec HTTP getElementById • anchor : 100%
• Contrôle de la soumission des formulaires • Les formats échangés : XML, JSON, JS, HTML, ... • DOM ExtJS : Ext.get, Ext.fly • labelWidth
9. Ajout de l’interactivité aux formulaires • Méthodes GET / POST • Le type Ext.Element • frame intégration
• Les fonctions AJAX de jQuery
• Les effets spéciaux
• Affectation de fonctions JavaScript aux éléments des formulaires • Traitement des données des formulaires avec jQuery • L’habillage CSS dynamique
• Utilisation de formulaires pour créer des dialogues interactives 8. Plugins jQuery 8. Le template ExtJS
• Interception des événements des formulaires
• Utilisation de plugins • Présentation
• Intérêts et pièges de l’utilisation de plugins • L’arbre DOM prédéfini
• La compilation template
• Aperçu de jQuery-UI • XTemplate
• La balise
• tpl if, tpl for
200 FORMATIONS 2020 FORMATIONS 2020 201