📚 Firebase

---

📕 Firebase란?

소개

• 실시간 데이터베이스, 인증, 스토리지, 분석 등 다양한 기능을 제공하는 모바일 및 웹앱 개발 플랫폼이다.
• 2011년 스타트업에서 시작했다. (실시간 채팅 기능) → 2014년 구글이 인수했다. (백엔드 서버리스)
• 백엔드 서버를 구축하고 관리할 필요 없이 google cloud platform 이용해 빠르고 효율적인 개발이 가능하다.
• 특히 실시간 기능 서비스나, 클라이언트 사이드 집중하고싶을 때, 초기 프로토타입 개발에 유용하다.

주요 기능

• Authentication : 다중 플랫폼 로그인을 간편하게 구현할 수 있다.
  • 이메일 인증, 소셜 미디어 계정 인증, 전화번호 인증방식을 제공한다.
  • 보안 강화, 사용자 인증 과정 안전하게 처리한다.
• Firestore : NoSQL 데이터베이스이다.
  • Firebase에서 제공하는 NoSQL 형식의 클라우드 데이터 베이스이다.
  • 실시간 데이터 동기화를 지원한다. (ex. 실시간 채팅)
• Storage: 사진 및 동영상을 저장할 수 있다.
  • 사용자의 파일 저장 및 공유가 가능하고, 강력한 보안을 기대할 수 있다.
• Hosting : 웹앱 호스팅이 가능하다.
  • 정적 및 동적 콘텐츠 모두 호스팅 가능하며, 웹 앱을 간단 배포할 수 있다.

---

📗 Firebase 특징

장점

• 백엔드 서버없이 개발이 가능해 시간이 절약되고, 클라이언트에 집중 가능하다.
• 사용자 데이터 실시간 공유, 실시간 채팅 등 실시간 데이터 베이스 기반 기능 개발이 쉽다.
• google cloud platform 서비스 간편하게 이용 및 분석 가능하다.

단점

• NoSQL 데이터 베이스의 간단한 쿼리만 사용 가능하다.
• 확장성이 중요한 경우 비용이 빠르게 증가할 수 있다.
• 타 백엔드 서비스로 전환하는 경우 추가적인 작업이 필요하다. (마이그레이션 어려움)

---

📘 Firebase 설정 방법

프로젝트 생성

• 프로젝트 만들기

Firebase 앱 설정

• 생성된 Firebase 프로젝트 페이지에서, “웹”을 선택하고 앱의 별칭을 입력할 수 있다.
• Firebase SDK를 추가하는 과정에서, Firebase가 제공하는 구성 객체를 복사한다.

React 프로젝트에 Firebase 설치

yarn add firebase

React 앱에서 Firebase 초기화

import firebase from 'firebase/app';

const firebaseConfig = {
	apiKey: "YOUR_API_KEY",
	authDomain: "YOUR_AUTH_DOMAIN",
	projectId: "YOUR_PROJECT_ID",
	storageBucket: "YOUR_STORAGE_BUCKET",
	messagingSenderId: "YOUR_MESSAGING_SENDER_ID",
	appID: "YOUR_APP_ID"
};

firebase.initializeApp(firebaseConfig);

React 앱에서 firebase 사용

import 'firebase/auth';
import 'firebase/firestore';

const auth = firebase.auth();
const db = firebase.firestore();