[React].gitignore 설정으로 비밀 설정 정보 관리하기 ssh연동

2020년 11월 14일 by Xion

    [React].gitignore 설정으로 비밀 설정 정보 관리하기 ssh연동 목차

몽고 DB연결 기준으로

위와같이 민감한 정보들은 깃허브 업로드 시 빼고 업로드가 되어야한다.

이번에는 .gitignore을 통하여 배제하는 방법을 알아보겠습니다!

 

개발할 때 환경은 총 2가지로 구분할 수 있습니다

1.Local환경에서 즉, 개발환경

-> 위와 같은 경우에는 프로그램 안에 변수를 가져갈 수 있다.

 

 

2.배포 후 production 환경

->헤로쿠에서 따로 정보를 입력하고 일치 시켜야합니다. 즉 헤로쿠 사이트에서 직접적으로 관리해줍니다.

 

key.js 파일

환경변수 process.env.NODE_ENV 를 통하여 분기시켜줍니다.

prod.js 설정 (production 모드일 경우 여기로 들어옴)

->해당 파일에서 MONGO_URI 자리에 헤로쿠 사이트의 URI와 일치시켜야합니다.

KEY : MONGO_URI 를 추가한 후 VALUE값에는 맨 위에서 설정했던 몽고DB의 key값을 적어줍니다. (패스워드 포함 )

그 후, require를 통하여 바인딩시켜준 뒤 connect 인자값으로 config.mongoURI로 접근하여 데이터를 바인딩합니다.

이유는 dev.js 파일안에 module.export 안에 mongoURI 값이 설정되어있기 때문에 " . " 으로 접근합니다.

콘솔창에 npm run start를 입력하면 mongoDB에 연결되면서 정상적으로 실행이된것을 볼 수 있습니다.

최종적으로 dev.js파일을 .gitignore파일에 추가하여 깃허브에 올라가는 것을 방지합니다 ( dev.js 추가 )

changes 되는것들에 보시면 dev.js 파일이 없는 것을 확일할 수 있습니다 !

 

git add . 를 실행하여 git에 업로드 시킨 후 git status 를 확인해봅니다.

참고로 modified는 수정된 파일을 말합니다.

보시면 dev.js가 빠진것을 볼 수 있습니다.

git에 commit을 하기 위하여 git commit -m "아무 메시지 입력" 을 입력해줍니다.

마지막으로 이 커밋한 내용들을 깃에 업로드하기 위하여 git push origin master 명령어를 입력해줍니다.

 

 

지금까지는 Local에 연결하는 방법이었고 이제는 git의 Remote에 연결하는 방법을 알아보겠습니다

push한 파일들을 Remote에 올려야하는데 

안전하게 올려야합니다.

즉, SSH를 먼저 확인해야합니다

터미널 창에 먼저

위와 같은 명령어를 입력해줍니다. 만약 저 명령어를 입력했는데 id_rsaid_rsa.pub이라는 폴더가 있으면

SSH설정이 되어있다는것입니다.

 

안되어있는분들은 구글에 "git ssh"를 입력해줍니다.

 

docs.github.com/en/free-pro-team@latest/github/authenticating-to-github/generating-a-new-ssh-key-and-adding-it-to-the-ssh-agent

 

Generating a new SSH key and adding it to the ssh-agent - GitHub Docs

Generating a new SSH key and adding it to the ssh-agent After you've checked for existing SSH keys, you can generate a new SSH key to use for authentication, then add it to the ssh-agent. Mac Windows Linux All If you don't already have an SSH key, you must

docs.github.com

해당 페이지를 따라 들어가서 터미널창에서 입력해줍니다.

1.SSH KEY를 만들고

2.SSH Agent를 Background에 켭니다.

1->3 번을 순서대로 실행해 줍니다.

여기서는 add를 통하여 ssh를 등록시켜줘야합니다.

 

앞에서 설명한 id_rsa 와 id_rsa_pub 이라는 파일이란

id_rsa :  비공개 key

id_rsa_pub : 공개 key

라고 생각하면 되겠습니다.

위와 같이 만들어줍니다.

그 후 4번과정의 링크를 통하여 등록된 public key, id_rsa_pub 파일을 깃허브에 등록시켜줘야합니다.

링크 :docs.github.com/en/free-pro-team@latest/github/authenticating-to-github/adding-a-new-ssh-key-to-your-github-account

 

Adding a new SSH key to your GitHub account - GitHub Docs

Adding a new SSH key to your GitHub account To configure your GitHub account to use your new (or existing) SSH key, you'll also need to add it to your GitHub account. Mac Windows Linux All Before adding a new SSH key to your GitHub account, you should have

docs.github.com

"pbcopy < ~/.ssh/id_rsa.pub" 을 입력하면 ssh의 pub key가 복사가 이루어집니다. (메모장을 켜서 컨+v 눌러보면 key값이 뜹니다.)

 

이 복사된 key 값을 깃허브의 setting에 들어가줍니다.

그 후 

SSH 탭에 들어가줍니다.

이로써 computer와 github server가 안전하게 통신할 수 있게 되었습니다.

 

'React' 카테고리의 다른 글

[React]컴포넌트 이벤트 만들기  (0) 2020.11.21
[React]Bcrypt로 비밀번호 암호화 하기  (0) 2020.11.15
[React]React & Node & Mongoose & git연동  (0) 2020.11.13
[React] package.json이란?  (0) 2020.11.13
[React]Component문법  (0) 2020.11.11