3. 파이어베이스 (Firebase) 연동하기

프로젝트/할일목록 앱 (RN)

syleemomo 2023. 9. 14. 14:23

728x90

Firebase | Google’s Mobile and Web App Development Platform

Discover Firebase, Google’s mobile and web app development platform that helps developers build apps and games that users will love.

firebase.google.com

react native firebase 연동

react native firebase 연동하기

velog.io

[React-native]리액트 네이티브와 Firebase 연동하기

🛠️ 라이브러리 설치하기 Firebase 프로젝트 생성하기 파이어베이스에서 로그인한 후 프로젝트 추가를 클릭한다. 프로젝트 이름을 적고 계속을 클릭한다. (* 구글 애널리틱스를 사용하지 않으면

velog.io

React Native 프로젝트에 Firebase 연동하기

React Native 프로젝트에서 연동하고 사용하는 예제를 정리해보겠다. Firebase 프로젝트 생성 먼저 구글 로그인 후 Firebase에 접속해보면 시작하기 버튼이 보일 것이다. 이 버튼을 클릭하고 프로젝트를

devbksheen.tistory.com

파이어베이스 콘솔로 이동하기

파이어베이스 콘솔에서 프로젝트 추가하기

안드로이드앱 등록하기

일반적으로 패키지 이름은 앱 수준 build.gradle 파일의 applicationId입니다.

패키지 이름은 프로젝트 경로에서 android > app > build.gradle 파일을 찾아서 입력해준다.

앱 등록하기 - google-service.json 파일 다운로드하기

앱수준 build.gradle 이 위치하는 android > app 폴더에 다운로드 받은 파일을 추가한다.

Firebase SDK 추가하기

Android와 Firebase의 문제 해결 및 FAQ | Firebase for Android

Google I/O 2023에서 Firebase의 주요 소식을 확인하세요. 자세히 알아보기 의견 보내기 Android와 Firebase의 문제 해결 및 FAQ 컬렉션을 사용해 정리하기 내 환경설정을 기준으로 콘텐츠를 저장하고 분류

firebase.google.com

프로젝트 수준 build.gradle (android > build.gradle) 에 Firebase SDK 를 추가한다. 콜론과 점을 잘 구분해서 작성하도록 한다.

앱수준 build.gradle (android > app)에 아래와 같이 google-services 플러그인을 추가한다.

앱수준 build.gradle (android > app)에 아래와 같이 Firebase SDK 를 추가한다.

안드로이드 스튜디오를 열어서 해당 프로젝트를 연다음에 우측 상단의 Sync Now 버튼을 클릭하여 생성한 안드로이드 앱을 Gradle 파일과 동기화환다. Sync Now 버튼이 보이지 않으면 ctrl + alt + y 키로 동기화를 진행한다.

리액트 네이티브에서 파이어베이스를 사용하기 위한 모듈을 설치해준다.

npm install @react-native-firebase/auth @react-native-firebase/firestore @react-native-firebase/storage

회원인증/데이터베이스/이미지 업로드를 위한 모듈도 설치한다.

728x90