Cours
PrestaShop

Newsletter

Angular

Développer une application Angular 6 avec Angular Material, Angular CLI 6 et RxJS 6

Ou s'abonner pour un accès illimité sans engagement à tout Skilleos pour 19,90€/mois. En savoir plus
chapitre

Chapitres

40

chrono

Durée

04h59 de cours en ligne

chrono

Prérequis

acces

Accès

24h/24 et 7j/7
PC/Mac, tablette et smartphone

certificat

Certificat

Délivré à la fin de la formation

1for1

1 For 1

Un abo ou un achat sur Skilleos = Un cours offert à un bénéficiaire

Samir Medjdoub

Samir Medjdoub

Développeur depuis 2003 dans des entreprises clientes publiques (SNCF, URSSAF, EDF...) et privées (Iron Mountain, Jouve, CDiscount...), avec comme comme fil conducteur la conscience qu’il est bien plus facile de rester sur la vague que de tenter de remonter après s’être laissé submerger. Fidèle à cette stratégie, Samir Medjdoub a ainsi pris la vague Angular 2 dès les versions alpha et bêta fin 2015, celle de Node.js il y a sept années de cela et a eu la chance d'évoluer dans des sociétés qui avaient été parmi les premières en France à adopter MongoDB, conjointement aux bases de données relationnelles. Les développeuses et développeurs JavaScript (Front, Back ou Fullstack !) ont de très beaux jours devant eux : investissez dans les frameworks, plateformes et librairies JavaScript qui vous ouvriront de belles opportunités en 2019.

Vous souhaitez apprendre Angular et le faire de façon pratique en créant une application ? Le développement est un savoir faire, pas seulement une théorie : montez en compétence ou progressez en développement Angular à l'aide de ce cours orientée projet.

Ce cours sur Angular vous permettra d'apprendre à utiliser ce framework de Google et vous permettra aussi de prendre en mains les nouveaux outils proposés par la version V6 (mai 2018). Vous découvrirez Angular en créant l'application baptisée "restaurangular". Cette application pourrait correspondre à la commande d'un client propriétaire de restaurant. Nous la créerons ensemble, ce qui vous permettra de voir ou revoir la programmation web à l'aide du framework Angular.

Contenu du cours

  • Support du code source fourni sur un repo github

À la fin du cours, vous serez capable de :

  • Créer un menu latéral à l'aide de la nouvelle commande "ng add" apparue avec Angular CLI 6
  • Présenter sous forme de table permettant tri et pagination les plats proposés à la carte
  • Générer un dashboard, le personnaliser et le peupler à l'aide d'un service
  • Créer des interfaces graphiques à l'allure professionnelle
  • Créer un module de réservation qui illustrera la création de formulaires de type template driven form et reactive form
  • Apprendre avec le support du code source fourni sur un repo github

Chapitres

INTRODUCTION
1
01:10
Introduction
2
07:22
Génération de notre application Angular avec Angular CLI
3
09:52
Tour du propriétaire de l'application générée par Angular CLI
4
05:24
Tour du propriétaire de l'application générée par Angular CLI (suite)
ANGULAR MATERIAL
5
06:08
Installation d'Angular Material
6
09:54
Installation de Material Sidenav
LE ROUTAGE
7
06:04
Génération de components
8
10:08
Implémentation du routage
ANGULAR MATERIAL (SUITE)
9
09:50
Utilisation d'une Angular Material Card
10
10:35
Génération d'un Material Dashboard
11
02:13
Personnalisation du Material Dashboard
12
06:36
Génération d'une Material Data Table
13
09:03
Ajout d'un prix au data source et implémentation du tri sur le prix
CRÉATION D'UN SERVICE ET D'UN MODèLE
14
06:18
Création du service quick-lunch.service.ts
15
07:49
Création du modèle "Food"
16
08:26
Consommation de notre service
17
07:37
Afficher le contenu propre à chaque type de nourriture
18
10:56
Formatage du prix à l'aide du pipe "currency" et utilisation du séparateur "mat-divider"
19
05:53
Afficher le contenu de chaque type de nourriture
LES FORMULAIRES
20
06:00
Imports et variables requises par Reactive Forms
21
08:20
Liaison d'un FromGroup à un formulaire côté template
22
08:25
Angular Material datepicker
23
01:31
Datepicker en français
24
06:06
Angular Material Select
25
09:18
Template driven form
26
05:47
Soumission du formulaire
27
05:04
Flag contrôlant l'affichage successif des formulaires
RXJS 6
28
10:52
Présentation de RxJS
29
12:03
Utiliser les opérateurs
30
09:03
Tapandmapcallingcustommethod
31
12:10
HttpClient
32
07:20
L'opérateur switchMap() pour aplatir un Observable d'Observable
33
06:09
Filtrer
34
08:24
Typer fortement les requêtes Http
35
02:40
Générer une Material Card par EveningEvent
COMMUNICATION ENTRE COMPONENTS
36
11:49
Communication parent vers enfant à l'aide de @Input()
37
07:40
Finalisation du template du component enfant
38
12:00
Communication enfant vers parent à l'aide de @Output()
39
07:25
Output() fin
40
00:26
Conclusion

Angular

49.00 €

close if for show price

  • langues fr