firebase 푸쉬 알림 (react native)

firebase 에서 새로운 프로젝트 다음다음 눌러서 프로젝트 생성

 

 

 

아래 사이트 참고

rnfirebase.io

 

 

 

 

**설치

yarn add @react-native-firebase/app

 

-> package.json에서 확인

 

 

**파이어 베이스로 가서 

프로젝트 설정 > 패키지명 추가 하고 구성파일 다운로드

 

 

 

*****안드로이드일 경우

 

**위에서 받은 파일을 android > app 하위에 추가

 

 

**android> build.gradle.

 

depandency 추가

classpath 'com.google.gms:google-services:4.4.2'

 

 

**android> app> build.gradle.

 

apply plugin: 'com.android.application'
apply plugin: 'com.google.gms.google-services' // <- Add this line

 

 

***messaging 라이브러리 설치

# Install & setup the app module
yarn add @react-native-firebase/app

# Install the messaging module
yarn add @react-native-firebase/messaging

 

 

 

***훅파일 만들기

 

ex) usePush.ts

fcm token 발급받아.그 토큰을 통해 푸쉬메시지를 보냄. 

 

 

***파이어베이스 콘솔에서 테스트 해보기. 위에서 만들어진  토큰 넣고.

 

->  messaging > 첫번째 캠페인 > firebase알림메시지 선택 

 

 

*** 푸쉬 알림 전송하는 api  만들기

 

-firebase 콘솔> firebase database > 데이터베이스 만들기. > cloud firestore 만들어짐

-> 여기서 컬렉션 만들어서 토큰 집합만들고 단체 푸쉬 보내기 가능

 

-functions 

 

 

 

 

 

***cli설치

npm install-g firbase-tools

 

 

firbase login

 

** 프로젝트 초기화

firebase init functions

 

-> 만든 프로젝트 리스트 나오면 선택. 

 

 

cd functions

yarn

 

 

**prettier 충돌날때

 

yarn add esling-plugin-prettier eslint-config-prettier prettier --dev

 

******.eslintrc.js 파일

>extends에 추가

plugin :  prettier/recommended

 

 

>rules 에서

import뺴고 지움

 

 

 

****index.ts

 

yarn run serve

-> 에뮬레이터 실행

-> 실행로그에 나온 주소 확인

 

 

이 파일에 로직 짜기(api)

fiebase-admin  라이브러리에 firestore, messaging  활용.

 

updateToken : firestore에  토큰 저장

sendUpdateMessage : 토큰 가져와서 messaging().send()

 

 

** axios 활용테스트

yarn add axios

 

 

 

**배포

yarn run deploy

 

-> firebase 사이트 function으로가서 만든 api 생성된거 확인

 

***최초 배포시 에러난 것 삭제후 다시 배포.