클라이언트 환경변수

당연하지만 우리에게는 당연하지 않았던 -

첫 프로젝트 회고에도 썼지만 개선하고 싶었던 것 중 하나가 환경변수 처리였다. 마지막에 CSS 작업을 하며 로컬환경, 배포환경에서 여러 번 번갈아가면서 테스트하는데 각 파일에 있는 localhost:8080 주소를 배포한 주소로 일일이 바꿔서 썼다. 이를 해결하기 위한 방법을 강구해보았다.

1) 내가 적용한 방법은 주소 부분을 환경 변수 처리하기 위해, 따로 모듈 파일을 만든 것이다. 그래서 파이널 프로젝트에서는 axios.create 을 이용해 base url 을 정의하고, 이 파일을 import 해서 사용함으로써 해결했다. 로컬, 배포 환경에 따라 base url 만 바꿔서 테스트하면 되었다.

2) dev, production 환경변수를 정의해두고, npm script 에 따로 빼서 써도 된다. npm run dev 하면 NODE_ENV=dev 이런 식으로.