[firebase] 프로젝트 생성

1. firebase 접속

 

2. 새프로젝트 추가+ (애널리틱스 분석 사용안함)

 

3. 웹으로 만들기 때문에 웹 선택! 

 

4. 환경변수 적용  -> .env

 

src/firebase/config.js

const firebaseConfig = {
  apiKey: process.env.REACT_APP_API_KEY,
  authDomain: process.env.REACT_APP_AUTH_DOMAIN,
  projectId: process.env.REACT_APP_PROJECT_ID,
  storageBucket: process.env.REACT_APP_STORAGE_BUCKET,
  messagingSenderId: process.env.REACT_APP_MESSAGING_SENDER_ID,
  appId: process.env.REACT_APP_APP_ID
};

 

5. src/firebase/config.js. 

// Import the functions you need from the SDKs you need
import { initializeApp } from "firebase/app";
// TODO: Add SDKs for Firebase products that you want to use
// https://firebase.google.com/docs/web/setup#available-libraries

import { getAuth } from "firebase/auth";
import {getFirestore} from "firebase/firestore"


// Your web app's Firebase configuration
const firebaseConfig = {
  apiKey: process.env.REACT_APP_API_KEY,
  authDomain: process.env.REACT_APP_AUTH_DOMAIN,
  projectId: process.env.REACT_APP_PROJECT_ID,
  storageBucket: process.env.REACT_APP_STORAGE_BUCKET,
  messagingSenderId: process.env.REACT_APP_MESSAGING_SENDER_ID,
  appId: process.env.REACT_APP_APP_ID
};

// Initialize Firebase
const app = initializeApp(firebaseConfig);


// 인증 초기화 하기
const appAuth = getAuth();

// fireStore에 초기화된 firebase 전달
const appFireStore = getFirestore(app)

// export하기
export { appFireStore, appAuth }

 

 

JavaScript 프로젝트에 Firebase 추가