Programmation événementielle et interface Homme-Machine
Réf. 187007
- Durée : 12 semaines
- Effort : 48 heures
- Rythme: ~4 heures/semaine
- Langues: NA
Ce que vous allez apprendre
À la fin de ce cours, vous saurez :
- Être familier de Typescript, savoir écrire des programmes dans ce langage ;
- Connaître le principe du patron de conception Observateur/Observable, savoir reconnaître sa mise en œuvre dans le DOM et dans la bibliothèque RxJS. Être capable de mettre soi-même en œuvre ce patron de conception à l'aide du DOM et/ou de RxJS ;
- Connaître le principe du patron de conception MVP et savoir le mettre en œuvre pour programmer un composant. Comprendre le lien entre les patrons de conception MVP et Observateur/Observable ;
- Connaître le principe du patron de conception Observateur/Observable, savoir reconnaître sa mise en œuvre dans le DOM et dans la bibliothèque RxJS. Être capable de mettre soi-même en œuvre ce patron de conception à l'aide du DOM et/ou de RxJS ;
- Connaître le principe du patron de conception MVP et savoir le mettre en œuvre pour programmer un composant. Comprendre le lien entre les patrons de conception MVP et Observateur/Observable ;
- Connaître et savoir utiliser les bases du framework Angular pour programmer des systèmes interactifs : composants, directives, services, injections de dépendances.
Description
Nous apprendrons à développer des systèmes interactifs. Nous nous concentrerons principalement sur la partie « interface » de ces systèmes et utiliserons pour illustrer cela l’espace technologique web.
Nous commencerons par une introduction du langage Typescript (qui n’est autre que du Javascript avec du typage statique) que nous utiliserons dans la suite du cours. Nous rappellerons comment la programmation événementielle est gérée au niveau du DOM et nous introduirons la bibliothèque RxJS qui permet de formaliser la programmation réactive de manière plus propre et structurée.
En utilisant RxJS, nous étudierons le patron de conception Observateur/Observable et comment celui-ci sert de base au patron de conception MVP que nous utiliserons pour structurer le code des systèmes interactifs.
Enfin, nous présenterons le Framework Angular en montrant comme il s’inspire du patron de conception MVP et ce qu’il y apporte. Nous développerons de petits systèmes interactifs à l’aide de ce Framework qui fait partie de ceux utilisés dans l’industrie (avec React et VueJS).
Ce cours est mis à disposition des universités partenaires du projet THEME et de la MIAGE, ainsi que toute autre université.
Format
Une séance de cours par semaine et une séance de TD/TP par semaine.
Prérequis
Vous savez programmer dans un langage de type impératif (C, Python, ...) ;
Vous devez être familier du langage Javascript, avoir déjà développé au moins des petits programmes avec ce langage ;
Il est souhaitable que vous ayez des notions de programmation objets (mais ça n'est pas primordial) ;
Il est souhaitable que vous ayez déjà développé des petits programmes interactifs.
Evaluation et Certification
Au travers de projets notés et de QCM.
La pondération est laissée à la discrétion de l'enseignant réutilisateur ou de l'enseignante réutilisatrice.
Plan de cours
- Quelles différences avec Javascript ?
- Les fonctions et leurs types
- Les objets
- Types moins usuels
- Tableaux et fonctions d'ordre supérieur
- Les événements
- Abonnement aux événements et propagation
- Délégation de traitement et contrôle de la propagation
- Le patron de conception MVC/MVP
- Mini-projet : Le jeu de Reversi
- Présentation générale
- Composant simple et data-binding en Angular
- Directives structurelles et services
- Observables dans la Vue
- Entrées et sorties de composants
- Mini projet : La liste des choses à faire
