[wpms_breadcrumb reverse="0"]
PHP

Angular JS fondamentaux

Reference : ANGJS01

3

jours - Nous consulter Télécharger la fiche
Prochaines sessions
    Angular JS fondamentaux
    Objectifs

    • Appréhender la philosophie et le fonctionnement du framework AngularJS,
    • Développer une application Web avec AngularJS,
    • Maîtriser les impacts du choix d’une architecture incluant une application web riche.

    Pré requis

    • Connaissance de HTML, CSS et bon niveau JavaScript (les notions fondamentales seront abordées en rappels)

    Modalités et délais d’accès

    Bulletin d'inscription à retourner complété

    Pré-inscription

    Programmes de Angular JS fondamentaux

    Rappels & mise en route

    • Rappels sur JavaScript : prototype, portée des variables, fonctions, contextes, etc.
    • Rappels HTML5 : balises sémantiques, forms
    • Présentation du design pattern MVVM
    • Définition d’une application « single page »
    • Déclaratif vs impératif
    • Installation d’un environnement de travail : node.js, éditeur, navigateur

    Une application web sans manipuler le DOM

    • Data binding bi-directionnel
    • La gestion des vues et le moteur de template
    • Qu’est-ce qu’une expression AngularJS  ?
    • Définition d’un contrôleur
    • Association vue et contrôleur
    • Comprendre les contextes AngularJS ($scope)
    • Appréhender les événements utilisateurs
    • Formulaire : interaction et validation
    • Utilisation des filtres (dans la vue, dans le contrôleur et combinaison)
    • Écriture d’un filtre

    Travaux pratiques

    • Présentation de l’application fil rouge : ngDoodle
    • Création d’un événement
    • Noter ses disponibilités

    Test et debug d’une application AngularJS

    • Environnement de test
    • Choix d’un framework de test
    • Tests unitaires et karma
    • Batarang : voir fonctionner AngularJS depuis le navigateur
    • Design Patterns appliqués à une application web
    • Notion de routing
    • Configuration avec $routeProvider
    • Route et gestion de l’historique de navigation
    • Initialisation avant routage
    • Découplage grâce aux services
    • Injection de dépendances
    • Présentation ou rappel sur les promesses
    • Les promesses avec Angular JS
    • Des services « standard » $http $resource : utilisation d’une API REST
    • Créer ses propres services : plusieurs façon d’y arriver

    Travaux Pratiques

    • Re-Organisation de notre application (Refactoring time)
    • Création, utilisation et affichage
    • Création d’un service
    • Communication avec un serveur via une API REST

    Découpler pour mieux tester

    • Test d’un service AngularJS
    • Simuler le résultat d’une requête http

    Étendre et augmenter HTML pour qu’il réponde à vos besoins

    • Plongée dans le coeur de Angular JS : fonctionnement interne
    • AngularJS pour les pros : les directives
    • Fonctionnement des directives
    • Directive et événements utilisateurs
    • Intégration d’un contrôleur dans une directive

    Pratique

    • Création d’un fiche récapitulative
    • Affichage calendaire

    Trucs & astuces

    • Organisation du code selon la taille de votre application
    • Bonnes pratiques
    • Automatisation avec Grunt

    AngularJS 2.0

    • Présentation générale
    • Concepts et langages
    • Impacts et approche vis à vis de cette nouvelle version