DEMANDE ET WEB DÉVELOPPEMENT
Programmation angulaire 15
LONGUEUR 5 jours
VERSION 15
POURQUOI ÉTUDIER CE COURS
Cette formation Angular 15 intensive et complète fournit aux participants des compétences qu'ils peuvent utiliser immédiatement dans leur travail. Vous apprendrez les principes fondamentaux du développement Angular 15, tels que les applications de navigateur à page unique, les applications réactives websites Web et applications mobiles hybrides.
Ce cours est une combinaison d'apprentissage théorique et de laboratoires pratiques qui comprend une introduction à Angular, suivie de TypeScript, des composants, des directives, des services, du client HTTP, des tests et du débogage.
Note: Nous pouvons également dispenser des formations sur d'autres versions d'Angular. Veuillez nous contacter pour faire une demande ou enregistrer votre intérêt.
ANGULAIRE CHEZ LUMIFY WORK
CE QUE VOUS APPRENDRE
Après avoir réussi ce cours, vous aurez les connaissances nécessaires pour :
- Développer des applications angulaires d'une seule page à l'aide de Typescript
- Mettre en place un environnement de développement angulaire complet
- Créer des composants, des directives, des services, des canaux, des formulaires et des validateurs personnalisés
- Gérer les tâches avancées de récupération de données réseau à l'aide d'Observables
- Consommer des données depuis REST web services utilisant le client HTTP angulaire
- Gérez les connexions de données push à l'aide du WebProtocole de socket
- Travailler avec des tuyaux angulaires pour formater les données
- Utiliser les fonctionnalités avancées du routeur de composants angulaires
- Tester et déboguer les applications angulaires à l'aide des outils intégrés
- Travailler avec la CLI angulaire
Mon instructeur était formidable de pouvoir insérer des scénarios dans des instances du monde réel liés à ma situation spécifique.
J'ai été bien accueilli dès mon arrivée et la possibilité de m'asseoir en groupe en dehors de la classe pour discuter de nos situations et de nos objectifs a été extrêmement précieuse.
J'ai beaucoup appris et j'ai senti qu'il était important que mes objectifs en participant à ce cours soient atteints.
Excellent travail de l'équipe Lumify Work.
AMANDA NICOL
RESPONSABLE DES SERVICES DE SUPPORT INFORMATIQUE – HEALTH WORLD LIMITED
SUJETS DE COURS
- Présentation d'Angular
• Qu'est-ce qu'Angular ?
• Caractéristiques centrales du framework angulaire
• Cas d'utilisation appropriés
• Éléments constitutifs d'une application angulaire
• Architecture de base d'une application angulaire
• Installation et utilisation d'Angular
• Anatomie d'une application angulaire
• Exécution de l'application
• Création et déploiement de l'application
• Angular pour les applications mobiles natives - Introduction à TypeScript
• Langages de programmation à utiliser avec Angular
• Syntaxe TypeScript
• Éditeurs de programmation
• Le système de types – Définition des variables
• Le système de types – Définition de tableaux
• Types primitifs de base
• Saisissez les fonctions
• Inférence de type
• Définir des classes
• Méthodes de classe
• Contrôle de la visibilité
• Constructeurs de classe
• Constructeurs de classe – Forme alternative
• Champs non initialisés
•Interfaces
• Travailler avec les modules ES6
• var contre laisser
• Fonctions fléchées
• Syntaxe compacte de la fonction flèche
• Chaînes de modèle
• Les génériques en classe
• Génériques en fonction - Composants
• Qu'est-ce qu'un composant ?
• Un example composant
• Création d'un composant à l'aide de la CLI angulaire
• La classe de composants
• Le décorateur @Component
• Enregistrement d'un composant dans son module
• Modèle de composant
• Example: Modèle HelloComponent
• Example : La classe HelloComponent
• Utilisation d'un composant
• Exécutez l'application
• Hiérarchie des composants
• Le composant racine de l'application
• Le bootstrap File
• Crochets de cycle de vie des composants
• Example Lifecycle Hooks
• Styles CSS - Modèles de composants
• Modèles
• Emplacement du modèle
• La syntaxe Moustache {{ }}
• Définition des propriétés des éléments DOM
• Définition du texte du corps de l'élément
• Liaison d'événement
• Gestionnaire d'événements d'expression
• Empêcher la gestion des défauts
• Directives d'attribut
• Appliquer des styles en modifiant les classes CSS
• Exampfichier : ngClass
• Application directe de styles
• Directives structurelles
• Modèle d'exécution conditionnelle
• Example: ngIf
• Boucler à l'aide de ngFor
• ngPour les variables locales
• Manipulation de la collection
• Example – Supprimer un élément
• Suivi des articles avec ngFor
• Échange d'éléments avec ngSwitch
• Regroupement d'éléments
• Variable de référence du modèle - Communication inter-composants
• Bases de la communication
• L'architecture des flux de données
• Préparer l'enfant à recevoir des données
• Envoyer des données du parent
• En savoir plus sur la définition des propriétés
• Déclenchement d'un événement à partir d'un composant
• @Output() Ex.ample – Composant enfant
• @Output() Ex.ample – Composant parent
• Reliure bidirectionnelle complète
• Configuration de la liaison de données bidirectionnelle dans Parent - Formulaires pilotés par modèles
• Formulaires basés sur des modèles
• Module d'importation de formulaires
• Approche de base
• Configuration d'un formulaire
• Obtenir la contribution de l'utilisateur
• Omission de l'attribut ngForm
• Initialiser le formulaire
• Liaison de données bidirectionnelle
• Validation du formulaire
• Validateurs angulaires
• Affichage de l'état de validation à l'aide de classes
• Types d'entrée supplémentaires
• Cases à cocher
• Sélectionner des champs (listes déroulantes)
• Options de rendu pour la sélection (liste déroulante)
• Champs de dates
• Boutons radio - Formes réactives
• Formulaires réactifs terminésview
• Les éléments de base
• Importer un module de formulaires réactifs
• Construire un formulaire
• Concevoir le modèle
• Obtenir des valeurs d'entrée
• Initialisation des champs de saisie
• Définition des valeurs du formulaire
• Abonnement aux modifications d'entrée
• Validation
• Validateurs intégrés
• Affichage d'une erreur de validation
• Validateur personnalisé
• Utilisation d'un validateur personnalisé
• Fourniture de la configuration au validateur personnalisé
• FormArray – Ajouter dynamiquement des entrées
• FormArray – La classe Component
• FormArray – Le modèle
• FormArray – Valeurs
• Sous-Groupes de formulaires – Classe de composants
• Sous-groupes de formulaires – Modèle HTML
• Pourquoi utiliser des sous-groupes de formulaires ? - Services et injection de dépendances
• Qu'est-ce qu'un service ?
• Création d'un service de base
• La classe de service
• Qu'est-ce que l'injection de dépendances ?
• Injection d'une instance de service
• Injecteurs
• Hiérarchie des injecteurs
• Enregistrement d'un service auprès de l'injecteur racine
• Enregistrement d'un service avec l'injecteur d'un composant
• Enregistrer un service avec un injecteur de module de fonctionnalités
• Où enregistrer un service ?
• Injection de dépendances dans d'autres artefacts
• Fournir une implémentation alternative
• Injection de dépendances et @Host
• Injection de dépendances et @Optional - Client HTTP
• Le client HTTP angulaire
• Utilisation du client HTTP – Terminéview
• Importation de HttpClientModule
• Service utilisant HttpClient
• Faire une demande GET
• Que fait un objet observable ?
• Utilisation du service dans un composant
• Le composant client PeopleService
• La gestion des erreurs
• Personnalisation de l'objet d'erreur
• Faire une requête POST
• Faire une requête PUT
• Faire une demande DELETE - Canaux et formatage des données
• Que sont les tuyaux ?
• Tuyaux intégrés
• Utilisation de tuyaux dans un modèle HTML
• Tuyaux de chaînage
• Tuyaux internationalisés (i18n)
• Chargement des données de paramètres régionaux
• La date Pipe
• Le numéro Pipe
• Tuyau de devises
• Créer un canal personnalisé
• Tuyau personnalisé Example
• Utilisation de canaux personnalisés
• Utiliser un canal avec ngFor
• Un tuyau filtrant
• Catégorie de pipe : pure et impure
• Ex de tuyau purample
• Tuyau impur Example - Introduction aux applications à page unique
• Qu'est-ce qu'une application à page unique (SPA) ?
• Traditionnel Web Application
• Flux de travail du SPA
• Application avancée d'une seule pagetages
• API d'historique HTML5
• Défis SPA
• Implémentation de SPA à l'aide d'Angular - Le routeur de composants angulaires
• Le routeur de composants
• View Navigation
• L'API du routeur angulaire
• Création d'une application compatible avec un routeur
• Hébergement des composants routés
• Navigation à l'aide de liens et de boutons
• Navigation programmatique
• Passage des paramètres d'itinéraire
• Navigation avec les paramètres d'itinéraire
• Obtention des valeurs des paramètres d'itinéraire
• Récupération du paramètre d'itinéraire de manière synchrone
• Récupération d'un paramètre de route de manière asynchrone
• Paramètres de requête
• Fourniture des paramètres de requête
• Récupération des paramètres de requête de manière asynchrone
• Problèmes avec le manuel URL entrée et mise en favoris - Client HTTP avancé
• Options de demande
• Renvoyer un objet HttpResponse
• Définition des en-têtes de requête
• Création de nouveaux observables
• Création d'un observable simple
• La méthode des constructeurs observables
• Opérateurs observables
• Les opérateurs de cartographie et de filtrage
• L'opérateur flatMap()
• L'opérateur tap()
• Le combinateur zip()
• Mise en cache de la réponse HTTP
• Effectuer des appels HTTP séquentiels
• Passer des appels parallèles
• Personnalisation de l'objet d'erreur avec catchError()
• Erreur dans le pipeline
• Récupération d'erreur - Modules angulaires
• Pourquoi des modules angulaires ?
• Anatomie d'une classe de module
• Propriétés @NgModule
• Modules de fonctionnalités
• ExampStructure du module
• Créer un module de domaine
• Créer une paire de modules de routage/routage
• Créer un module de service
• Création de modules communs
• Utiliser un module à partir d'un autre - Routage avancé
• Module de fonctionnalités activé pour le routage
• Utilisation du module de fonctionnalités
• Chargement paresseux du module de fonctionnalités
• Création de liens pour les composants du module de fonctionnalités
• En savoir plus sur le chargement différé
• Modules de préchargement
• Liaison routerLinkActive
• Itinéraire par défaut
• Chemin d'itinéraire générique
• rediriger vers
• Itinéraires enfants
• Définition d'itinéraires enfants pour les itinéraires enfants
• Liens pour les itinéraires enfants
• Gardes de navigation
• Création d'implémentations de garde
• Utiliser des gardes sur un itinéraire - Applications angulaires de tests unitaires
• Tests unitaires d'artefacts angulaires
• Outils de test
• Étapes de test typiques
• Résultats de test
• Suites de tests Jasmine
• Spécifications Jasmine (tests unitaires)
• Attentes (affirmer les ions)
• Matcheurs
• Exampleçons d'utilisation des Matchers
• Utilisation de la propriété not
• Installation et démontage dans les suites de tests unitaires
• Exampfichier des fonctions beforeEach et afterEach
• Module de test angulaire
• Example module de test angulaire
• Tester un service
• Injection d'une instance de service
• Tester une méthode synchrone
• Tester une méthode asynchrone
• Utilisation d'un client HTTP simulé
• Fourniture d'une réponse standardisée
• Test d'un composant
• Module de test des composants
• Création d'une instance de composant
• La classe ComponentFixture
• Tests des composants de base
• La classe DebugElement
• Simulation de l'interaction utilisateur - Débogage
• Surview du débogage angulaire
• Viewutiliser du code TypeScript dans le débogueur
• Utilisation du mot-clé du débogueur
• Journalisation du débogage
• Qu'est-ce qu'Angular DevTools ?
• Utilisation des outils de développement angulaires
• Angular DevTools – Structure des composants
• Angular DevTools – Exécution de détection de changement
• Détecter les erreurs de syntaxe
À QUI S'ADRESSE LE COURS ?
Ce cours s'adresse à toute personne ayant besoin d'apprendre les bases du développement Angular 15 et de les appliquer immédiatement à la création. web candidatures.
Nous pouvons également proposer et personnaliser cette formation pour des groupes plus importants, ce qui permettra à votre organisation d'économiser du temps, de l'argent et des ressources. Pour plus d'informations, veuillez nous contacter par email au ph.training@lumifywork.com
CONDITIONS PRÉALABLES
- Web une expérience de développement utilisant HTML, CSS et JavaScript est requise pour tirer le meilleur parti de ce cours Angular
- La connaissance du navigateur DOM est également utile
- Aucune expérience préalable d'Angular ou d'AngularJS n'est requise
La fourniture de ce cours par Lumify Work est régie par les conditions générales de réservation.
Veuillez lire attentivement les termes et conditions avant de vous inscrire à ce cours, car l'inscription au cours est conditionnelle à l'acceptation de ces termes et conditions.
https://www.lumifywork.com/en-ph/courses/angular-15-programming/
ph.training@lumifywork.com
lumifywork.com
facebook.com/LumifyWorkPh
linkedin.com/company/lumify-work-ph
twitter.com/LumifyWorkPH
youtube.com/@lumifywork
Documents / Ressources
 |
LUMIFY WORK Programmation angulaire 15 [pdf] Guide de l'utilisateur Programmation angulaire 15, Programmation |
