API 키 같은 정보는 github repository처럼 오픈된 장소에 올려서는 안된다.
악용의 여지가 있기 때문이다.
dot-env라는 녀석을 이용해서 키를 관리해보자
yarn add dot-env
그리고 루트 경로에 .env파일을 만들고 아래처럼 작성해보자. 발급받은 키도 같이 입력해준다.
rapidApiKey=발급받은키 입력
next js에서는 dotenv를 사용하기 위해서 추가 설정이 필요하다
next.config.js 파일을 생성해준다.
module.exports = {
env: {
rapidApiKey: process.env.rapidApiKey,
},
};
여기까지 작업한 내용을 깃에 올려보자
*** .env파일은 깃에 올리지 않는다 -> .gitignore파일에 추가한다.
잘따라왔다면
git status
위 사진처럼된것을 확인하고
git add .
git commit -m "add swr api fetch with dotenv"
git push -u origin master
이제 남은 .env파일은 어떻게 처리해야할까?
깃허브에서는 키들을 관리해주는 기능을 제공한다.
'Front end > React 따라하기1' 카테고리의 다른 글
마지막) vercel에 무료로 배포하기 (0) | 2020.08.01 |
---|---|
7) styled-components 적용하기 (0) | 2020.08.01 |
5) 리액트에서 API 요청하기 SWR (0) | 2020.07.17 |
4)날짜 처리하기 date-fns (0) | 2020.07.16 |
3) 코로나바이러스 무료 api 테스트하기 (1) | 2020.07.16 |
댓글