환경변수들 관리해주는 .env파일 따로만들어주면, api key등 개인정보를 직접적으로 노출하지 않고 파일 관리가 가능하다.
.env는 파일의 최상단 루트에 만들어줄 것!
REACT_APP_FIREBASE_API_KEY = ""
REACT_APP_FIREBASE_AUTH_DOMAIN = ""
REACT_APP_FIREBASE_PROJECT_ID =""
REACT_APP_FIREBASE_STORAGE_BUCKET = ""
REACT_APP_FIREBASE_MESSAGING_SENDER_ID = ""
REACT_APP_FIREBASE_MEASUREMENT_ID = ""
REACT_APP_CLIENT_ID = ""
👉 리액트 내에서는 REACT_APP을 시작으로 적어줄 것
👉 const 등으로 변수를 따로 선언해주지 않음
👉 세미콜론(;) 붙히지 않음
const firebaseConfig = {
apiKey: process.env.REACT_APP_FIREBASE_API_KEY,
authDomain: process.env.REACT_APP_FIREBASE_AUTH_DOMAIN,
projectId: process.env.REACT_APP_FIREBASE_PROJECT_ID,
storageBucket: process.env.REACT_APP_FIREBASE_STORAGE_BUCKET,
messagingSenderId: process.env.REACT_APP_FIREBASE_MESSAGING_SENDER_ID,
appId: process.env.REACT_APP_FIREBASE_APP_ID,
measurementId: process.env.REACT_APP_FIREBASE_MEASUREMENT_ID,
};
👉 process.env.(저장한 환경변수 이름)