Être rappelé(e)

Formation Angular

Développer des application web avec Angular

  • Utilisez votre CPF
  • Eligible OPCO
  • Eligible Pôle Emploi
  • Objectifs Créer et mettre en place des applications web SPA (Single Page Application) avec le Framework Angular. Maîtriser les concepts et les outils du frameworks pour créer des interfaces utilisateurs performantes et déployer votre application Angular.
  • Public Développeurs, chef de projet, agence web ou webmaster blabla
  • Niveaux requis Maîtriser HTML/CSS, avoir des notion de javascript
  • Durée 4 jours

Programme

Rappels sur javascript ES6/7 et orienté objet

  • Les class et l'instanciation d'objets
  • L'accessibilité des membres, l'encapsulation et les accesseurs, l'héritage
  • Savoir créer un modèle de données via les class
  • Les principales implémentations ES6/7 (Arrow functions, Spread operator, Paramètres rest, Template strings, Import et Export)

Typescript

  • Qu'est-ce que Typescript ?
  • Utiliser les types natifs
  • Créer vos modèles de données avec les interfaces
  • Interface ou class pour typer vos donnnées ?

Components, data-binding, template, directives et events

  • Le component racine, déclaration et structure - définition du décorateur de class
  • data-binding, property-binding et change detection, comment ça marche ?
  • A l'abordage du template HTML et des syntaxes
  • Gérer les événements utilisateur
  • Les directives de structure *ngIf et *ngFor
  • Les directives ngClass et ngStyle
  • Le cycle de vie d'un component
  • Travaux pratiques : créer un component enfant, afficher des données, gérer des évènements et utiliser les directives de structure

Les pipes

  • Qu'est-ce qu'un pipe et comment il fonctionne ?
  • Travaux pratiques : utilisation des pipes natifs Angular
  • Travaux pratiques : création d'un Custom pipe

Les services

  • Pourquoi et quand utiliser les services ?
  • Comment utiliser un service dans un component grâce à l'injection de dépendance ?
  • Travaux pratiques : partager l'accès aux données entre les components
  • Travaux pratiques : partager des fonctionnalités entre les components
  • Notion de gestion d'état dans une application front-end

Pratique : création d'une application web

  • Créer un nouveau projet et ajouter Bootstrap (les 3 méthodes)
  • Scaffolder une application en components et en services via le CLI Angular
  • Communiquer de l'information entre les components avec @Input et @Output
  • Communiquer de l'information entre les components avec un Service
  • Utiliser HttpClient pour Faire des requêtes de type GET/POST/PUT/DELETE
  • Mise en place du routing avec la class Router

Gestion des formulaires

  • FormControl et FormGroup
  • TDF versus DDF : Template Driven Form et Data Driven Form
  • Validation et gestion d'erreur personnalisée
  • Gestion de l'envoi des données du formulaire
  • Travaux Pratiques : ajout d'un formulaire dans l'application

Notions avancées : state, performance et conception modulaire

  • Qu'est-ce que le state d'une application et pourquoi le gérer ?
  • Mettre en place une stratégie de gestion du state
  • Travaux pratiques : gérer simplement le state de l'application avec RxJS et les services
  • Les autres solution existantes pour gérer l'état de l'application
  • Conception modulaire d'une application, pourquoi ?
  • Le lazy-loading versus le eager-loading
  • Travaux pratiques : créer un nouveau module et mettre en place du lazy-loading

Bonnes pratiques, déploiement, rappels généraux et QCM

  • Rappels sur les étapes de développement de la création au déploiement
  • Compiler une application Angular pour la production et la déployer
  • Rappels des bonnes pratiques
  • QCM online
  • Session questions/réponses avec le formateur
Et obtenez votre certification !

Ils me font confiance