PLB CONSULTANT : 4.1. Solutions Open Source - Développement Front End - Angular

Objectifs pédagogiques :

Tandis que la première version d’Angular s’était imposée pour développer des applications web facilement en JavaScript, ses successeurs Angular 2, 4, 5 et 6 dont les versions stables sont maintenant disponibles (et déjà utilisées en production sur certains produits Google), va encore plus loin : meilleures performances, utilisation de la nouvelle version de JavaScript (ES6/ES2015), meilleurs outils de développement, server-side rendering…Toutefois, la syntaxe a beaucoup changé. Que vous utilisiez déjà ou non Angular, passez à la vitesse supérieure pour vos développements JavaScript avec Angular.

Concrètement, à l'issue de ce cours, les participants auront acquis les connaissances et compétences nécessaires pour :

• Construire une application Angular (version 2 et plus)
• Programmer avec le langage Typescript
• Anticiper les problématiques liées au déploiement dans le SI

Public :

Cette formation Angular s'adresse aux Développeurs JavaScript ayant déjà de l’expérience.

Pré-requis :

Pour suivre ce stage il est nécessaire de connaître JavaScript. La connaissance d'HTML/CSS est un plus. Connaitre EcmaScript 2015 est également exigé.

Structure d’une application Angular

Le langage TypeScript

Première application avec Angular Cli

Évolutions et disparitions depuis Angular JS

Les composants

Principes généraux d'Angular

Templates, nouvelles syntaxes

Styles du composant

Nouvelles directives du framework

Cycle de vie des composants

Injection de dépendances

Principes du mécanisme d’injection

Annotations et décorateurs

Configuration de l’injecteur dans Angular

Syntaxe du template Angular

Interpolation

Réutilisation de composants

Les bindings

Les directives structurelles

Gestion des événements

Les Pipes

Les formulaires Angular

Formulaires Template-driven

Formulaires Model-driven

La directive ngModel

Validation personalisée

Autres apports du module @angular/forms

Accès au réseau

Les Observables dans Angular

Les Promises

Gestion de la sécurité

Dévelopement et déploiement avec ou sans CORS

Le routage Angular

Déclarer ses routes

Configuration du routeur

Application Universelle côté serveur

Introduction aux tests

Le moteur de tests Karma

Le framework Jasmine

Tests de composants

Tests End to End

Études de cas

Réalisation d’une application de gestion de tâches (Todo List) améliorée, collaborative et temps réel à la Trello.

• Création, suppression, mise à jour et modification d’une tâche (CRUD)
• Partage des tâches en équipe, collaboration sur les tâches
• Gestion de droits de lecture et écriture

Réalisation d’une application de réseau social simplifié à la Twitter.

• Affichage temps réel et mise à jour du flux d’informations
• Publication, réactions aux messages
• Ajout / Suppression / modification d’entrée dans l’agenda
• Détection de collision d’événements
• Personnalisation du style de l’agenda