Angular 4, Node.js et JWT par la pratique
4.5 (44 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
310 students enrolled
Wishlisted Wishlist

Please confirm that you want to add Angular 4, Node.js et JWT par la pratique to your Wishlist.

Add to Wishlist

Angular 4, Node.js et JWT par la pratique

Fullstack JavaScript en Angular 4 et Node.js
4.5 (44 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
310 students enrolled
Created by Samir Medjdoub
Last updated 6/2017
French
Current price: $10 Original price: $105 Discount: 90% off
5 hours left at this price!
30-Day Money-Back Guarantee
Includes:
  • 7 hours on-demand video
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
What Will I Learn?
  • Apprendre à utiliser Angular et Node conjointement ainsi qu' Angular-CLI.
View Curriculum
Requirements
  • Connaître les fondamentaux d'Angular à partir de la V2. Idéalement, avoir suivi Angular 2 par la pratique.
Description

Apprenez à créer une application web en utilisant JavaScript côté client et serveur. Côté client, nous utiliserons Angular 4, côté serveur, Node.js et le célèbre framework Express.js.

Nous créerons un Jobboard simple mais suffisant pour être confronté à des problèmes réalistes que nous résoudrons ensemble. Par exemple ? Autoriser un client Angular à requêter une API REST (oui, les problèmes de Cross Origin seront traités), créer un formulaire côté Angular dont les données postées seront gérées côté serveur avec un middleware Express, créer des routes statiques et dynamiques comportant un puis plusieurs paramètres, sans oublier l'implémentation d'un système de login avec JWT. 

Cette formation sera l'occasion de revoir dans un nouveau contexte l'essentiel de ce qui avait été abordé dans Angular 2 par la pratique et Node.js par la pratique mais plus rapidement, afin de pouvoir acquérir des connaissances complémentaires très utiles. Ainsi, la création de formulaires se fera selon la façon 'template-driven' forms ET 'reactive'. De nouveaux types de custom pipes Angular seront créés. RxJS sera de nouveau utilisé pour créer nos requêtes Ajax mais outre Observables et opérateurs, nous aurons l'occasion de découvrir et d'utilser les Subjects de RxJS dans un cas concret.
Côté serveur, création d'une API REST, de custom middlewares et d'un système de recherche sont au programme.

Comme toujours, cette formation sera l'occasion de voir ou revoir les nouveautés d'ES6 dans un contexte pratique plutôt que scolaire, afin de bien s'en imprégner sans effort.

Who is the target audience?
  • Développeuses et développeurs souhaitant faire du Fullstack JavaScript.
Students Who Viewed This Course Also Viewed
Curriculum For This Course
54 Lectures
07:01:08
+
Créer la partie Frontend avec Angular 4
11 Lectures 01:31:21
Effectuer une requête Ajax à l'aide de RxJS
09:50

Intégrer (twitter) bootstrap
03:41

Créer le service job-service
09:43

Créer le modèle d'un formulaire de type 'reactive forms'
07:57

Créer la vue d'un formulaire de type 'reactive forms'
11:47

Générer un menu déroulant
05:54

Générer des boutons radio
13:21

Gérer les dates à l'aide de date-fns et créer le pipe 'daysAgo'
08:40

Utiliser un input de type date
02:13

Faire communiquer des composants frères à l'aide d'un Subject RxJS
12:38

Créer un panel à l'aide de (twitter) bootstrap
05:37
+
Le routage côté Frontend
3 Lectures 24:51
Mettre en oeuvre le routage
06:56

Créer un menu de navigation
06:47

Afficher les données existantes et ajoutées
11:08
+
Créer un backend Node et interagir avec un client Angular 4
12 Lectures 01:21:19
Créer une API REST avec Express.js
09:59

Envoyer un tableau d'objets via notre API REST
04:15

Créer un middleware autorisant l'accès de notre API à tous les clients
05:24

Gérer le POST
11:47

Gérer le POST (suite)
06:14

Vider un formulaire après soumission
01:29

Créer une route comportant un paramètre permettant un GET par id
06:17

Créer un lien dynamique
03:29

Gérer les requêtes visant à obtenir le détail d'un objet
11:06

Créer le pipe toShortDate
09:40

Créer une page de détails
06:50

Créer un pipe de formatage de monnaie
04:49
+
Implémenter la recherche en Node et Angular
4 Lectures 31:11
Implémenter la recherche côté serveur
10:00

Implémenter la recherche côté client
11:23

Afficher les résultats de recherche à l'aide d'un subject RxJS
08:01

Désactiver le bouton de soumission du formulaire de recherche
01:47
+
Implémenter un système de création de comptes et de login avec JWT
12 Lectures 01:38:03
Créer le composant 'authentication'
08:52

Gérer le login côté Frontend et Backend
12:36

Générer un token JWT
07:56

Persister le token reçu du serveur dans localStorage
05:37

Afficher une vue spécifique à l'état "authentifié"
06:16

Gérer la déconnexion (le logout)
05:50

Créer le composant 'register'
09:13

Création du nouvel utilisateur côté Backend et Frontend
09:04

Décoder le token et l'afficher dans la page de profil
13:25

Corriger l'authentification vérifiée sur notre fakeUser + divers
08:22

Générer un 'claim' de type 'role' qui varie en fonction des privilèges
05:32

Afficher du contenu différent en fonction du rôle décodé depuis le token JWT
05:20
+
Gérer l'accès à des ressources protégées à l'aide de JWT
4 Lectures 41:57
Créer un middleware permettant de récupérer un Header de type Authorization
09:29

Afficher le formulaire d'ajout d'annonces uniquement aux utilisateurs connectés
07:20

Envoyer un Authorization Header depuis un client Angular
15:18

Vérifier le token côté serveur
09:50
+
Enrichir la page de profil
5 Lectures 37:07
Afficher le pseudo de l'utilisateur
02:47

Récupérer les annonces passées par un utilisateur de base
12:46

Récupérer toutes les annonces lorsque l'on est logué en tant qu'admin
03:22

Afficher les annonces passées par l'utilisateur connecté
08:19

Créer un pipe qui tronquera les descriptions trop longues
09:53
About the Instructor
Samir Medjdoub
4.4 Average rating
334 Reviews
1,352 Students
7 Courses
Développeur web et mobile hybride

Plus de 10 années d’expérience en programmation web 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,  j’ai ainsi pris la vague Angular 2 dès les versions alpha et bêta fin 2015, celle de React en 2016 pour voir ce que le principal concurrent  proposait, celle de Node.js il y a cinq années de cela et ai 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 2017.