Tag: Angular

Angular 4 integration with Liferay DXP and Firebase

Angular and Firebase seed

A simple starter project demonstrating the basic concepts of Angular and Firebase integration.

Firebase

Firebase helps to build better Realtime Web Application and mobile apps for all the platforms to grow your business.

It provides the functionality like Realtime databases, Analytic, Cloud Messaging and Crash Reporting so we can move quickly and focus on our users. We can also test and deploy our application on Firebase Hosting With Free SSL Certificate. We can useĀ Firebase on client-side app developers (both web & mobile)

Before installing the Firebase, First of all, we need to make sure that below mention software installed properly with appropriate version as mentioned below.

Getting Started

  • Make sure you have node.js installed version 6+
  • Make sure you have NPM installed version 3.9+
  • Deploy using gradle or Eclipse Liferay tools

Install

Run this command in same project directory

npm install

Setting up the Project

  • Create a project in theĀ Console.
  • Click to Create New Project.
  • If you already have a project, click Add App from the project overview page.
  • Click to “Add Firebase” to your web app.
  • Note the initialization code snippet, which you will need to replace in environment.ts file.

src\main\resources\META-INF\resources\enviroments – sample code

  // Initialize
  // TODO: Replace with your project's customized code snippet
  production: false,
  firebase : {
    apiKey: "<API_KEY>",
    authDomain: "<PROJECT_ID>.firebaseapp.com",
    databaseURL: "https://<DATABASE_NAME>.firebaseio.com",
    storageBucket: "<BUCKET>.appspot.com",
    messagingSenderId: "<SENDER_ID>",
  };
  firebase.initializeApp(config);

Angular and Liferay DXP Github Code