[#ionic] ionic 프로젝트에 firebase 세팅하기

 

ionic 프로젝트에 firebase를 세팅하는 방법

1. firebase console에서 프로젝트 및 웹 앱 생성하기

https://console.firebase.google.com/u/0/?hl=ko

로그인 - Google 계정

firebase console에 들어가 프로젝트 및 웹 앱을 생성해준다. 그리고 설정 화면의 아래쪽에서 생성한 앱을 선택하고 Firebase SDK snippet을 CDN으로 선택해주면 앱 설정 소스코드가 표시된다. 이 소스코드를 복사해두자

firebase 앱 설정 소스코드

 

 

2. ionic 프로젝트에 firebase 설치 및 세팅

ionic 프로젝트 디렉토리에서 아래 명령어로 firebase를 설치해준다.

 
npm install firebase --save

 

 

그리고 src/app/app.component.ts 파일에 firebase를 import하고 아까 복사해둔 설정 소스코드로 firebase를 초기화한다.

...
import * as firebase from 'firebase';

....
export class AppComponent {
  constructor(
    ....
  ) {
    this.initializeApp();
  }

  initializeApp() {
    ....
    // 아까 복사한 설정 소스코드
    firebase.initializeApp({
        apiKey: "xxxxxxxxx",
        authDomain: "xxxx-12345.firebaseapp.com",
        databaseURL: "https://xxxx-12345.firebaseio.com",
        projectId: "xxxx-12345",
        storageBucket: "xxxx-12345.appspot.com",
        messagingSenderId: "xxxxxxxxxxx",
        appId: "1:xxxxxxxxxxxx:web:asde3453311f6d0d123asd",
        measurementId: "G-ABCDE12FGH"
    })
  }
}