React에서 .env (환경변수) 파일 사용하기

DB 관련 정보나 API_KEY 등 외부에 공개되면 안 되는 값들이 개발 중에 발생할 수 있다.

 

이런 값들을 관리하기 위해서 .env라는  환경변수 파일을 만들어 사용해준다.

 

. env 환경변수 파일을 사용하는 방법은 다음과 같다.

1. 파일 생성

프로젝트 최상위 폴더에. env 파일을 만들어 준다.

2. 환경변수 설정

환경 변수로 저장할 내용을 작성한다.

이때 REACT_APP_으로 변수명을 선언해주어야 사용이 가능하다.

그리고 = 이후 문자열에 따옴표를 따로 붙이지 않는다.

REACT_APP_API_KEY=dafsdlfjaoweonvaenvdapjf

3. 환경 변수 사용

사용할 때는 process.env.변수명을 통해 사용이 가능하다

process.env.REACT_APP_API_KEY

 

환경 변수 설정은 배포 판과 개발 과정에서 사용하는 것이 다르게 적용되어야 하는 경우가 있다고 한다.

그때는 배포 판에 올라갈 환경변수와 개발과정에서 테스트하는 경우 두 가지로 파일을 나누어서 저장한다고 한다.

이경우 아직 구글링을 통해 여러 사례를 보긴 했지만 이후 두 가지를 구분하는 경우를 직접 경험해보고

그때 다시 경험을 바탕으로 블로그 기록을 남길 예정이다.