Firebase

React Native에서 이미지를 업로드하기 위해선 react-native-image-picker 라이브러리를 사용하면 된다. 이 라이브러리를 사용하면 서진첩에서 이미지를 선택하거나 카메라로 사진을 촬영할 수 있다. 유사한 라이브러리로는 @react-native-community/cameraroll이 있는데, 이 라이브러리는 이미지를 선택하는 UI를 react-native로직으로 직접 만들 수 있다. 1. 라이브러리 설치 먼저 react-native-image-picker 라이브러리를 설치해준다. $ yarn add react-native-image-picker $ npx pod-install 2. iOS 설정 ios/프로젝트명/Info.plist 파일 하단에 아래 코드를 추가한다. 이 작업은 카메라 ..

이 전 글에는 Firebase로 회원 가입, 로그인을 구현해보았다. 이번에는 회원가입 후 사용자의 닉네임과 프로필 사진을 Firebase에 저장해보자. Firestore는 Firebase에서 제공하는 NoSQL 베이스이다. Firestore에 데이터를 읽고 쓸 때는 규칙을 지정할 수 있다. 이 규칙을 통해 데이터베이스 안에 저장된 데이터에 대해 사용자의 권한을 지정할 수 있다. Firestore 데이터베이스 만들기 먼저 Firebase 콘솔 페이지에 접속해 사이드 메뉴에 있는 Firestore Database를 선택한 뒤 데이터베이스 만들기 버튼을 클릭한다. 테스트만 진행할 것이기 때문에 테스트 모드에서 시작을 체크하고 다음 버튼을 클릭한다. Cloud Firestore의 위치는 asia-northeas..

이 전 글에는 React Native 프로젝트와 Firebase를 연동하는 방법을 살펴보았다. 이제 Firebase로 회원 인증을 구현해보자. Firebase 프로젝트 설정 먼저 이 전 글에서 생성한 Firebase 프로젝트에 접속해 왼쪽 사이드 메뉴에 Authentication을 클릭하고 시작하기 버튼을 클릭해준다. 이메일과 비밀번호를 사용해 예제를 구현해볼 것이기 때문에 이메일/비밀번호를 클릭한다. 나머지 제공업체들도 나중에 추가가 가능하다. 이메일/비밀번호를 사용 활성화해주고 저장 버튼을 클릭한다. 여기까지 했다면 이제 리액트 네이티브 프로젝트로 돌아가서 로그인, 회원가입, 로그아웃 기능을 구현해보자. Firebase로 회원 인증 하기 프로젝트에 lib 디렉터리를 만들고, auth.js 파일을 만들..

React Native 프로젝트에서 연동하고 사용하는 예제를 정리해보겠다. Firebase 프로젝트 생성 먼저 구글 로그인 후 Firebase에 접속해보면 시작하기 버튼이 보일 것이다. 이 버튼을 클릭하고 프로젝트를 추가해준다. 프로젝트 이름을 입력하고 계속 버튼을 클릭한다. 구글 애널리틱스를 사용하려면 Google 애널리틱스 사용 설정을 체크하고 계속 버튼을 누르고 애널리틱스 계정을 선택하거나 만들고 프로젝트 만들기 버튼을 클릭하면 프로젝트가 생성된다. 그럼 이제 안드로이드와 iOS에 Firebase를 설정하고 연동해보자. 안드로이드에 Firebase 설정하기 1. 앱 등록 프로젝트를 생성 후에 이동하는 페이지에 '앱에 Firebase를 추가하여 시작하기'라는 문구와 함께 안드로이드 아이콘이 보일 것이..

FCM란? Firebase 클라우드 메시징(FCM)은 무료로 메시지를 안정적으로 전송할 수 있는 교차 플랫폼 메시징 솔루션이다. 간단히 말해서 무료로 웹, 앱에 푸시를 보낼 수 있는 플랫폼이다. 사용법 Firebase console에 접속해 프로젝트를 생성한다. 프로젝트 설정 -> 서비스 계정 -> 새 비공개 키 생성 다운받은 비공개 키를 resources 하위로 이동 Firebase의존성 추가 dependencies { ... // Firebase SDK implementation 'com.google.firebase:firebase-admin:6.8.1' ... } 엔드포인트 확인 프로젝트 설정 -> 일반에 프로젝트 ID를 확인할 수 있을것이다. 요 프로젝트 ID를 서버 엔드포인트에 넣어줄것이다. 엔..