Angular (9 et 10) et AngularFire 6 par la pratique

Créer vos applications FullStack avec Angular en Front et Firestore en Back

4.21 (7 reviews)
Udemy
platform
Français
language
Web Development
category
32
students
7.5 hours
content
Aug 2021
last update
$19.99
regular price

What you will learn

Créer des applications FullStack avec Angular en Front et Firestore en Back

Développer côté Front avec Angular

Développer côté Back avec Firebase

Gérer l'authentification et la connexion de vos utilisateurs de multiple façons (via email/password ou via de nombreux réseaux sociaux)

Persister des images dans un bucket Firebase

Créer des Cloud Functions qui s'exécutent dans le cloud et ainsi être serverless

Interagir depuis Angular via AngularFire 6

Description

La partie Backend de vos projets est très exigeante. Elle est donc longue et délicate à développer. Ce n'est pourtant pas elle qui fournit les fonctionnalités propres à votre application. Grâce à la plateforme Firebase, vous n'aurez plus à sacrifier le temps consacré au Front au profit du Back (ou vice versa). Firebase vous permet en effet de rapidement :

- stocker de données puis les requêter grâce à Firestore

- gérer l'authentification et la connexion de vos utilisateurs de multiple façons (via email/password ou via de nombreux réseaux sociaux)

- créer des Cloud Functions qui s'exécutent dans le cloud et ainsi être serverless


Le temps libéré par Firebase, qui vous permet de disposer d'un Backend robuste et sécurisé en quelques minutes, vous permettra de consacrer davantage de temps à créer une application Front qui pourra se distinguer de la concurrence.

Dans cette formation, nous prendrons en main Firebase dans le contexte d'applications Angular 9 et Angular 10, ceci grâce à la toute dernière version d'AngularFire : AngularFire 6.

Afin de créer une application à l'allure esthétique et professionnelle, nous utiliserons Angular Material. Nous verrons comment mettre en oeuvre les composants Angular Material les plus couramment utilisés. Parmi ceux-là, les redoutables "MatDialog" qui ne sont pas aisés à comprendre : deux vidéos détaillées sur le sujet vous permettront de prendre en main rapidement et efficacement.

Grâce à cette formation, vous apprendrez à créer des applications FullStack en déléguant à Firebase la partie Backend, afin de disposer de davantage de temps à d'énergie à développer votre Front, et cela, sans sacrifier l'un ou l'autre !

Content

Introduction

Introduction

Projet "Where To Eat" (application de vote)

Générer un nouveau projet Angular via Angular CLI + installer d'Angular Material
Utiliser un Reactive Form pour récupérer les saisies de l'utilisateur
Créer un Backend Firebase
Configurer AngularFire 6
Créer un document "restaurant" dans une collection Firestore
Lire nos documents persistés sur Firestore
Afficher les propriétés des restaurants + pipe 'date' en détail
Récupérer l'id d'un restaurant depuis le bouton de vote
Voter pour un restaurant
Ordonner les votes
Désactiver le bouton de soumission + pluraliser les votes
Styliser avec Flex
Ordonner les votes par nom de restaurant
Ordonner les restaurants par nom ascendant
Utilisation d'une MatList
Gérer le 'selectionChange' d'une MatList
Créer une modale de confirmation de suppression
Supprimer un restaurant
Modale : touche finale
Fix au redémarrage

Projet "Personal Space" (application d'upload de photos sécurisée par un login s

Générer un projet + installer Angular Material
Générer nos components et les routes correspondantes
Créer un menu et router vers ses différentes routes
Installer Firebase et AngularFire
Configurer AngularFire
S'authentifier à l'aide d'un compte Gmail via un GoogleAuthProvider
Se déconnecter
Créer un formulaire permettant l'upload d'images
Uploader une image dans un bucket Firebase
Créer un service afin d'interagir avec une collection 'personal-spaces'
Créer un personal space par utilisateur afin de stocker les urls de ses images u

Firebase serverless

Firebase HTTP functions
Firebase background functions

Projet "ng-users" (gestionnaire d'utilisateurs)

Générer un projet + installer Angular Material
Créer un menu latéral à l'aide du component Sidenav
Configurer AngularFire
Créer un formulaire avec les contraintes d'Angular 10 "strict mode"
Créer un utilisateur via son email / mot de passe
Loguer un utilisateur avec son email et mot de passe
Créer un document 'user' dans la collection Firestore "users" à la création du u
Récupérer tous les utilisateurs de la collection Firestore "users"
Récupérer l'id de chaque document
Créer dynamiquement un lien vers chaque document "user"
Récupérer un utilisateur par son id
Caster un Firebase Timestamp en date

Screenshots

Angular (9 et 10) et  AngularFire 6  par la pratique - Screenshot_01Angular (9 et 10) et  AngularFire 6  par la pratique - Screenshot_02Angular (9 et 10) et  AngularFire 6  par la pratique - Screenshot_03Angular (9 et 10) et  AngularFire 6  par la pratique - Screenshot_04

Reviews

Noël
September 20, 2021
Beaucoup d'imperfections. C'est vraiment dommage car vos cours sont habituellement bien mieux. Pas de réponse aux questions. Pas de support sous forme de résumé pdf ou autre. Le projet restaurant est aussi une reprise d'un ancien cours. Et puis du code qui ne fonctionne pas et qu'il faut debugger. Désolé.

Charts

Price

Angular (9 et 10) et  AngularFire 6  par la pratique - Price chart

Rating

Angular (9 et 10) et  AngularFire 6  par la pratique - Ratings chart

Enrollment distribution

Angular (9 et 10) et  AngularFire 6  par la pratique - Distribution chart

Related Topics

4222348
udemy ID
8/4/2021
course created date
8/18/2021
course indexed date
Bot
course submited by