Autoplay
Autocomplete
Vidéo précédente
Terminer et continuer
Angular 2+ par la pratique
Installation du start kit Angular 2 et architecture
Installation d'un starter kit et architecture d'une application Angular 2 (14:19)
Gérer l'affichage des fichiers TypeScript (masquer les .js et .map) (1:31)
A propos d'Angular 4
Prendre en main le framework en modifiant l’existant
Modifier un component existant (4:06)
Créer une classe TypeScript (4:34)
Parcourir une collection à l’aide de la structural directive *ngFor (7:00)
Passer à la vitesse supérieure en créant module, component et service
Créer notre premier module supplémentaire (5:01)
Créer un component (5:38)
Créer un service et l’injecter (11:14)
Effectuer une requête http
Reactive programming dans le contexte de requêtes http + operators map() et do() (10:27)
S'abonner à un Observable à l'aide de sa méthode subscribe() (8:49)
Implémenter le routage
Créer notre nouveau module home.module (6:35)
Mettre en oeuvre le routage (10:03)
Afficher nos randonnées dans “hike-list-component.html” (3:16)
créer un lien avec routerLink et un menu de navigation avec twitter bootstrap (8:48)
Le routage avancé
Créer une route avec un paramètre et le récupérer via le service ActivatedRoute (11:10)
Créer un lien incluant un paramètre (4:26)
Créer un lien incluant un paramètre (suite) + ECMAScript 2015 template literals (3:10)
Naviguer grâce au service "Router" + créer un event handler via l'"event binding" (6:02)
Utiliser les pipes existants et créer un custom pipe
Utiliser un pipe fourni par Angular 2 (1:10)
Le two way binding à l'aide de [(ngmodel)] (5:34)
Créer un custom pipe à l'aide du décorateur @Pipe et de l’interface PipeTransform (11:52)
Créer et gérer un formulaire
Créer notre nouveau module “contact.module.ts” (11:11)
Création d'un formulaire (HTML + twitter bootstrap) (6:54)
Récupérer les saisies de notre formulaire (8:34)
Valider les champs de notre formulaire (4:11)
Comprendre les propriétés untouched/touched, pristine/dirty et valid/invalid (1:57)
Tester la validité d'un champ et gérer l'affichage d'un message à l'aide de *ngIf (4:38)
Utiliser "[class]" pour ajouter conditionnellement une classe CSS (3:06)
Tester la validité de tout un formulaire + activer conditionnellement le bouton submit (4:47)
Gérer l'événement de soumission du formulaire (3:36)
Créer un service de gestion de formulaire (5:38)
Gérer la communication entre components parents et enfants
Création d'un component "hike-summary" correspondant à notre domaine métier (5:38)
@Input pour passer des données d'un component parent vers un component enfant (7:01)
@Output pour passer des données d’un component enfant vers un component parent (11:15)
Ajouter un style à un component avec les propriétés styles et styleUrls (5:11)
Les animations
Principe des animations + création d'un div ouvrant et fermant (10:39)
Gérer le délai d'attente avant animation + transition à partir de l'état void (2:47)
Les divers types de easings (1:41)
Synchroniser le texte d'un bouton avec l'état d'une animation (1:57)
Animations plus complexes à l'aide des keyframes (9:11)
Animations plus complexes à l'aide des keyframes + création d'une galerie animée (12:18)
Evénements propres aux animations (3:38)
Google Maps via la librairie angular2-google-maps
Installer et configurer la librairie angular2-google-maps (2:51)
Création de notre module "map" + création d'une première carte et d'un marqueur (9:28)
Gérer les événements propres à google maps via des output decorators + récupérer dynamiquement des coordonnées GPS (7:43)
Créer un service qui permettra de geocoder une adresse vers un couple lat/lng (9:15)
S'abonner à une méthode de MapService qui retourne un Observable (4:29)
Ajouter des markers à partir de lat/lng récupérées par geocoding (6:57)
ApplicationRef tick() pour forcer la détection de changement (3:03)
Créer un pseudo formulaire à l'aide de ngModel (4:34)
Trouver un lieu à partir de sa lat/lng (11:04)
Trouver un lieu à partir de sa lat/lng (suite) + ajout d'un marker personnalisé (6:18)
Tracer un itinéraire à l'aide de l'API Polyline (5:05)
Tracer un itinéraire à l'aide de l'API Polyline (suite) (6:12)
Effacer un itinéraire existant (2:14)
Reactive Programming avec RxJS
RxJS : pour créer des flux et les combiner (plus) facilement (2:02)
Savoir ce que sont Observable, Observer et operators (2:02)
Créer un Observer de toutes pièces (7:50)
Laisser RxJS créer un Observer pour vous à partir de 3 callbacks (3:03)
Créer un Observable : approche bas niveau à l'aide d'Observable.create() (3:32)
Gestion des erreurs à l'aide d'observer.error() (1:40)
Introduction aux operators de création (1:31)
Qu'est-ce qu'un operator (3:38)
Le marble diagram (4:44)
L'operator de création from() (5:50)
Les operators de transformation map() et mapTo() (3:31)
Les operators interval() et take() (5:17)
L'opérator de création fromEvent() (5:38)
L'opérator do() (2:12)
L'operator filter() (3:42)
L'operator concat() (2:11)
L'operator merge() (5:44)
Cas pratique : créer un compteur de likes (7:32)
Création d'un cache
Le problème : la page hikes fait systématiquement un appel au service web (0:58)
Conception de notre cache (2:05)
Implémentation de notre cache (7:42)
HikeService : création de la méthode getHikeById() (5:09)
Consommer le service web HikeService pour afficher le détail d'une randonnée dans hike-details.component.html (3:35)
Consommer le service web HikeService pour afficher le détail d'une randonnée dans hike-details.component.html
Contenu verrouillé
Si vous êtes déjà inscrit
vous devrez vous connecter
.
S'inscrire à la formation pour déverrouiller