Was ist Firebase überhaupt?

Firebase ist eine Software-Entwicklungsplattform zur Bereitstellung von Webanwendungen, welche seit 2014 zu Google gehört. Firebase bietet Lösungen zur Authentifizierung, Datenbank & Echtzeit Datenbank, File Storage, Hosting, Cloud Functions und Machine Learning.

Dieser Beitrag befasst sich mit dem Thema Hosting durch Firebase.

Voraussetzungen: Node JS

Das folgende Beispiel beschreibt das Deployment mit Firebase für eine Angular Anwendung.

1. Angular Anwendung erstellen und bauen
   1. npm install –g @angular/cli
   2. ng new my-cool-app
   3. cd /my-cool-app
   4. ng build –prod
      1. Anschließend befindet sich im Hauptverzeichnis eine Ordnerstruktur /dist/appname/
2. Firebase CLI Tools installieren
   1. npm install -g firebase-tools
3. Firebase Login durchführen
   1. firebase login
      1. Hierbei öffnet sich ein Browser Fenster und erfordert einen Google Login.
4. Firebase Projekt initialisieren
   1. firebase init
      1. Are you ready to proceed? 
         1. Y
      2. Hosting selektieren mit Leertaste
         1.  Enter
      3. Create new project (or choose existing)
         1. Create new project, wenn vorher noch kein Projekt auf der Google Plattform erstellt wurde.
         2. Enter
      4. Please specify a unique project id
         1. my-cool-doubleslash-app
      5. What would you like to call your project?
         1. Enter
      6. What do you want to use as your public directory?
         1. dist/my-cool-app
            1. Hier geht es um den tatsächlichen Appnamen, kann unter package.json unter dem Feld „name“ gefunden werden.
      7. Configure as a single-page app?
         1. Y
      8. Set up automatic builds and deploys with GitHub
         1. N
      9. File dist/my-cool-app/index.html already exists. Overwrite?
         1. N
5. Angular Anwendung über Firebase deployen
   1. firebase deploy
6. Hosting URL öffnen
   1. https://my-cool-doubleslash-app.web.app/
7. Seitenanalyse und Konfiguration
   1. https://console.firebase.google.com/

Firebase bietet eine sehr schnelle und vor allem einfache Möglichkeit Webanwendungen in HTTPS bereitzustellen.

Die oben genannten Komponenten von Firebase lassen sich alle miteinander verknüpfen. So kann zum Beispiel die Datenbank von Firebase mit der Authentifizierung sowie der Hostingkomponente verbunden werden, um dann ggfs. für eine einfache Frontendanwendung auf ein eigenes Backend zu verzichten.

Die Anwendung wird über die Projektkonsole von Firebase verwaltet und kann so beliebig erweitert und analysiert werden. So kann beispielsweiße in der Projektkonsole eine Custom-Domain für die Anwendung definiert werden.

Mehr über Frontend Entwicklung erfahren

Quellen:

Firebase Hosting

Angular-App entwickeln