[ReactJS] firebase _트위터 클론코딩

https://firebase.google.com/

Firebase

 

 

firebase 홈페이지에서 프로젝트 생성

src/firebase.js 생성

 

src/firebase.js

import firebase from "firebase/compat/app";
import "firebase/compat/auth";
import "firebase/compat/firestore";
import "firebase/compat/storage";

const firebaseConfig = {
    apiKey: "AIzaSyA5mG6njbjd4flGqr8TMo4Nn7tu-RcJgdA",
    authDomain: "nwitter-dae11.firebaseapp.com",
    projectId: "nwitter-dae11",
    storageBucket: "nwitter-dae11.appspot.com",
    messagingSenderId: "1024494686068",
    appId: "1:1024494686068:web:753843bda3c598f5fc6621"
  };

export default firebase.initializeApp(firebaseConfig);

 

• 리액트에서 환경변수를 생성할 때는 REACT_APP_'환경변수이름'을 써줘야 함. (원칙)
• 그리고 사용할 때는 process.env.REACT_APP_'환경변수이름' 으로 사용하기

 

생성한 환경변수들을 .env 파일에 넣고 .gitignore 파일에 추가해준다. -> 깃 버전관리대상에 포함되지 않음

깃헙에 키를 직접 업로드하지 않기 위함임