env파일이란?

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

env 파일

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

환경변수란?

• 환경변수는

env 파일 사용법

• .env.{mode명}
• .env.--- 파일의 내용을 수정하면 npm으로 다시 시작해야 한다.

React에서 .env 사용하기

.env
.env 파일에서 환경변수는 key = value형태로 들어간다.
react에서 .env의 환경변수를 설정할때는 REACTAPP변수네임 = value로 작성해주면 된다.

REACT_APP_지정한 변수 = 값

.js
.env 파일에 저장된 환경변수값을 다른 js에서 파일에서 사용할때는 process.env.REACTAPP변수네임을 적어주면 된다.

const abc = {
	key : process.env.REACT_APP_지정한 변수
}

정리

• .env 파일은 '환경 변수 파일'을 의미한다.
• .env 파일은, 애플리케이션이 실행될 때 넘기고 싶은 특정 값을 담고 있는 변수가 기록되어 있다.
• .env파일은 프로젝트의 최상위 루트에 생성해야 한다.
  -REACT환경에서 .env파일안의 key값은 REACTAPP으로 시작되어야 한다.
• 파일에서 .env파일의 환경변수를 불러오기 위해서는 process.env.(.env파일의 key값)을 적어주면 된다.
  -.env파일을 .gitignore에 추가한다.(git의 배포 관리항목에서 제외되어 보안을 지킬수 있다.)

***참고
https://tooo1.tistory.com/582