230701 개발일지 TIL - Firebase: Error (auth/invalid-api-key)

Firebase: Error (auth/invalid-api-key).

env 환경변수 파일
.env 파일은 프로젝트에서 사용할 환경 변수를 설정하는 파일이다.
환경 변수는 프로젝트 설정, API 키, 데이터베이스 연결 정보 등과 같은 중요한 구성 값들을 포함할 수 있다.

firebase.jsx 파일

import { initializeApp } from 'firebase/app';
import { getAuth, signOut } from 'firebase/auth';
import { getFirestore } from 'firebase/firestore';
import { getStorage } from 'firebase/storage';

// Your web app's Firebase configuration
export const firebaseConfig = {
 apiKey: process.env.REACT_APP_FB_API_KEY,
 authDomain: process.env.REACT_APP_FB_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);
export const auth = getAuth(app);
export const db = getFirestore(app);
export const storage = getStorage(app);
export { signOut };

.env.local 파일 (프로젝트 폴더 root안에 위치)

REACT_APP_FB_API_KEY=""
REACT_APP_FB_AUTH_DOMAIN=""
REACT_APP_PROJECT_ID=""
REACT_APP_STORAGE_BUCKET=""
REACT_APP_MESSAGING_SENDER_ID=""
REACT_APP_APP_ID=""

.gitignore 파일
.env.local 추가

로컬서버에서 에러발생시
yarn add force로 설치하고 실행