리액트에서 환경변수 설정하기

Hmm·2022년 6월 21일
0
.env.local파일

REACT_APP_PATH=/tutor-schedule
  1. REACTAPP으로 시작해야 한다.
  2. 나는 local에서 develop모드에서 보고 싶었기 때문에 .env.local파일에 넣었다.

우선순위가 높은 파일 -> 낮은 파일 순으로 써있다.
npm start: .env.development.local, .env.local, .env.development, .env
npm run build: .env.production.local, .env.local, .env.production, .env
npm test: .env.test.local, .env.test, .env (note .env.local is missing)

https://create-react-app.dev/docs/adding-custom-environment-variables/
https://stackoverflow.com/questions/49579028/adding-an-env-file-to-react-project

  1. 사실은 .env의 환경변수도 노출될 수 있다.

    WARNING: Do not store any secrets (such as private API keys) in your React app!
    Environment variables are embedded into the build, meaning anyone can view them by inspecting your app's files.

그래서 .env파일에 api key를 넣기보다는, api key가 필요할 때마다 클라이언트가 api key를 서버에 요청하는 식으로 코드를 짜는 게 더 좋다.

https://stackoverflow.com/questions/48699820/how-do-i-hide-api-key-in-create-react-app

0개의 댓글