.env란?
- 웹,앱 개발을 하다보면 포트, DB관련 정보, API_KEY등.. 개발자 혼자서 또는 팀만 알아야 하는 값 즉, git, 오픈소스에 올리면 안되는 값들이 있다. 이때 필요한 것이 dotenv 패키지 이며 환경변수 파일을 외부에 만들어 URL,포트, API_KEY등.. 을 저장시켜 소스코드 내에 하드코딩하지 않고 사용할수 있다.
.env 파일
외부 파일(.env)에 환경변수를 정의하여 변수로 받아오는 이유는 보안과 유지보수에 용이하기 때문이다.
.env 파일은 프로젝트의 최상위 루트에 파일을 만들어놓는다.
React에서 .env 파일 사용법
.env파일을 프로젝트 최상단에 생성해준다.package.json파일과 동일한 선상에 둔다고 생각하면 된다.env파일에는 민감한 정보들을 변수로 적어두면 된다.
react 환경에서는REACT_APP_이름=값으로 앞 부분에REACT_APP을 꼭 넣어주어야 react에서 사용할 수 있다.
참고사항
키=값=양 옆에는 띄어쓰기는 쓰지 않는다.
주석 처리하는 법 = 앞에#을 사용
값을 “”으로 감싸지 않아도 string으로 인식한다.
- 사용법
process.env.REACT_APP_이름
Next.js에서 .env 파일 사용법
클라이언트에서 사용
React처럼 접두사를 반드시 사용 NEXT_PUBLIC_이름=값
서버측에서 사용
접두사 없이 사용
주의할 점!
.env 파일을 변경했으면 개발 서버를 다시 시작해야 한다.
배포하는 경우 배포 사이트에서 설정 대시보드를 통해 환경 변수를 입력해야 한다.
.env 파일을 만들고 github에 올리면 만드는 이유가 사라지니 .gitignore에 .env를 추가해서 올리지 말아야 한다.
참고자료
