env란?

env는 Environment Variable 의 줄임말로 환경변수 를 의미한다.

웹, 앱을 개발을 하다보면 포트, DB관련 정보, API_KEY 등 개발자 혼자서 또는 팀원만 알아야 하는 값 즉, git, 오픈소스에 올리면 안되는 값들이 있다. 이때 필요한 것이 dotenv 라이브러리 이며 환경변수 파일을 외부에 만들어 URL, 포트, API_KEY 등을 저장시켜 소스코드 내에 하드코딩 하지 않고 사용할 수 있다.

.env 파일

외부 파일(.env)에 환경변수를 정의하여 변수로 받아오는 이유는 보안과 유지보수에 용이하기 때문이다. .env 파일은 프로젝트의 최상위 루트에 파일을 만들어 놓는다.

*create-react-app 에서는 보안이 필요한 환경변수의 유출을 미연에 방지하기 위해 REACT_APP_으로 시작되지 않는 환경변수는 무시한다.*

사용 방법은 아래와 같이 .env 파일을 생성하여 사용할 수 있다.

Untitled

.env 사용하기

*process.env.REACT_APP_ 는 예약어이므로, 다른 이름을 사용하면 React가 인식하지 않는다.*

*process.env 는 실행 시 로드 되기 때문에 .env 의 설정을 바꾸게 되면 React 프로젝트를 다시 구동해야한다.*

// .js
const config = {
	key: process.env.REACT_APP_지정할변수명,
}
// .env
RAECT_APP_지정할변수명=값