env?

처음에 뭔가 했는데 공개되면 안되는 민감한 정보를 저장하는 환경변수 (숨김파일 같은) 이다.

env 파일은 루트 경로에 만들어줘야 한다. 만들게 되면 아래와 같이 뜨게 될 것이다. 배포할 용도가 아니기 때문에 .env.development로 만들어준다.

이 파일에 변수와 값을 지정해줘서 사용하는데, 변수명은 항상 앞에 REACT_APP_을 붙여줘야 한다.

REACT_APP_CLIENT_ID = gsfg309gj903gm-wegk9egj

CLIENT_ID라는 변수에 값을 지정해준 것이다. 지정한 변수를 JSX에 맞춰 사용하려면 사용하고자 하는 곳에서 proccess.env.을 붙여서 사용한다.

{process.env.REACT_APP_CLIENT_ID}

gitignore

해당 내용을 배포하거나 공유하지 않을 것이기 때문에 github을 이용할 때는 gitignore에 넣어줘야 한다.

.env.local
.env.development
.env.development.local
.env.test.local
.env.production.local

Tip

Github에 push를 하고 나서 merge된 것을 받고 브랜치에 가서 merge나 rebase를 하게 되면 다른 작업 branch에서 변동사항에 env가 뜰 수도 있다. 그건 해당 브랜치에서는 gitignore에 넣어주지 않았기 때문이다. 그렇기 때문에 각 작업 브랜치에 가서 env와 gitignore한 내용을 합쳐줘야 한다.