Angular CLI
  • Initialiser un nouveau projet à l'aide de Angular CLI
  • Structure du projet Angular généré par Angular CLI
  • Générer un composant Angular
  • Importer le module HttpModule ou HttpClientModule
Créer la partie Frontend avec Angular 4
  • Effectuer une requête Ajax à l'aide de RxJS
  • Intégrer (twitter) bootstrap
  • Créer le service job-service
  • Créer le modèle d'un formulaire de type 'reactive forms'
  • Créer la vue d'un formulaire de type 'reactive forms'
  • Générer un menu déroulant
  • Générer des boutons radio
  • Gérer les dates à l'aide de date-fns et créer le pipe 'daysAgo'
  • Utiliser un input de type date
  • Faire communiquer des composants frères à l'aide d'un Subject RxJS
  • Créer un panel à l'aide de (twitter) bootstrap
Le routage côté Frontend
  • Mettre en oeuvre le routage
  • Créer un menu de navigation
  • Afficher les données existantes et ajoutées
Créer un backend Node et interagir avec un client Angular 4
  • Créer une API REST avec Express.js
  • Envoyer un tableau d'objets via notre API REST
  • Créer un middleware autorisant l'accès de notre API à tous les clients
  • Gérer le POST
  • Gérer le POST (suite)
  • Vider un formulaire après soumission
  • Créer une route comportant un paramètre permettant un GET par id
  • Créer un lien dynamique
  • Gérer les requêtes visant à obtenir le détail d'un objet
  • Créer le pipe toShortDate
  • Créer une page de détails
  • Créer un pipe de formatage de monnaie
Implémenter la recherche en Node et Angular
  • Implémenter la recherche côté serveur
  • Implémenter la recherche côté client
  • Afficher les résultats de recherche à l'aide d'un subject RxJS
  • Désactiver le bouton de soumission du formulaire de recherche
Implémenter un système de création de comptes et de login avec JWT
  • Créer le composant 'authentication'
  • Gérer le login côté Frontend et Backend
  • Générer un token JWT
  • Persister le token reçu du serveur dans localStorage
  • Afficher une vue spécifique à l'état "authentifié"
  • Gérer la déconnexion (le logout)
  • Créer le composant 'register'
  • Création du nouvel utilisateur côté Backend et Frontend
  • Décoder le token et l'afficher dans la page de profil
  • Corriger l'authentification vérifiée sur notre fakeUser + divers
  • Générer un 'claim' de type 'role' qui varie en fonction des privilèges
  • Afficher du contenu différent en fonction du rôle décodé depuis le token JWT
Gérer l'accès à des ressources protégées à l'aide de JWT
  • Créer un middleware permettant de récupérer un Header de type Authorization
  • Afficher le formulaire d'ajout d'annonces uniquement aux utilisateurs connectés
  • Envoyer un Authorization Header depuis un client Angular
  • Vérifier le token côté serveur
Enrichir la page de profil
  • Afficher le pseudo de l'utilisateur
  • Récupérer les annonces passées par un utilisateur de base
  • Récupérer toutes les annonces lorsque l'on est logué en tant qu'admin
  • Afficher les annonces passées par l'utilisateur connecté
  • Créer un pipe qui tronquera les descriptions trop longues
Bonus
  • Bonus : coupon vers des formations complémentaires