Firebase modules activeren en importeren.
Voor het vervolg van de toepassing ga je nog wat extra Firebase modules activeren.
Firebase Authentication zorgt ervoor dat de gebruiker eerst moeten inloggen voor hij de chat–pagina kan
gebruiken.
De gegevens die je van deze service terugkrijgt (uid, email, displayName, ...) kan je desgewenst in de database
kopiëren. Zo kan de gebruiker zijn eigen profiel verder aanpassen met extra gegevens (bijvoorbeeld een andere
foto) of kan de beheerder aan elke gebruiker een accesLevel toekennen.
Binnen Firebase kan je uit twee databases kiezen. Je hebt de iets oudere Realtime Database en de recente
Cloud Firestore. Wij gaan voor de nieuwe Firestore.
Beide databases hebben een aantal voordelen t.o.v. ander NoSQL-databases zoals de populaire MongoDB.
Beide databases gebruiken Real-time data synchronization. Dit wil zeggen dat elke wijziging dadelijk wordt doorgegeven aan alle geconnecteerde gebruikers. Je hebt dus geen ingewikkelde constructies nodig die de pagina om de zoveel tijd gaat reloaden. Firebase pushed elke wijziging automatisch naar alle gebruikers. Dus ideaal voor een chat-applicatie.
Een tweede belangrijk voordeel van beide databases is dat ze serverless werken. Bij de meeste databases
moet je om veiligheidsredenen de data steeds tweemaal valideren voor je de gegevens daadwerkelijk in de database
plaatst. De eerste maal valideer je in de browser (clientside) en daarna valideer je nog eens op de
server (serverside).
Voor MongoDB heb je voor de serverside-validatie altijd een webserver nodig. Meestal gebruik je dan de Express
webserver in een Node omgeving (= MEAN stack).
Voor Firebase heb je helemaal geen serverside-validatie nodig omdat je de security rules voor de database
rechtstreeks vanuit de console kan beheren.
Authentication activeren.
- Open de Firebase console voor je project en klik links op Authentication.
- Klik vervolgens op Inlogmethoden instellen.
- Schakel Inlogproviders zowel voor E-mail/wachtwoord als voor Google in. De default instelling volstaat.
Cloud Firestore activeren.
- Klik links op Database en klik vervolgens rechts op Cloud Firestore uitproberen.
- Kies In testmode starten. (De veiligheidsregels worden later wel aangepast.)
Installeer Firebase in het project.
Binnen Angular heb je nog twee extra modules nodig, namelijk firebase en angularfire2.
Firebase is de officiële JavaScript module om met Firebase te communiceren. In principe kan je
hiermee verder, maar zoals de naam al laat vermoeden verzorgt Angularfire2 de connectie tussen Angular en
Firebase. Hiermee kunnen we binnen Angular o.a. via observables met de backend communiceren.
- Update de Firebase CLI en installeer vervolgens beide modules.
- Kopieer vanuit de Firebase console de configuratie-parameters en voeg deze zowel aan src/environments/environment.ts als aan src/environments/environment.prod.ts toe.
- Let op dat je de waarde van production niet overschrijft. (In environment.ts is deze false, In environment.prod.ts is deze true.)
Firebase modules importeren.
- Open src/app/app.module.ts en importeer alle modules die je in het project gebruikt.
- Voeg de modules eveneens aan de imports array toe.
