[Git] Commit Author 변경하기

이미지
  문제 캡쳐 사진 현재 맥을 사용하고있는데 big sur가 아직 오류가 많은듯 싶어서 big sur로 업그레이드는 하기싫고, 현재 카탈리나 최종 업데이트 버전으로 업데이트 하고싶었는데 버전을 선택해서 업데이트할 수는 없었다.  찾아보니 최종버전으로 업데이트 가능한 방법이 노트북 초기화뿐이였다. 초기화를하면 처음에 구매했을때 설치되어있던 OS의 최종 버전으로 설치가 된다. 그리고 노트북을 구매하고 코딩 공부하면서 이것저것 막 설치해보고 설정도 바꿔보고 했었다. 특히 국비학원다니면서 프로그램을 이것저것 많이 깔았었는데 현재는 사용하지 않아서 지운다고 지웠지만 깔끔하게 지워진것같지 않았다. 그래서 초기화를 했는데 ... 초기화 후 설정을 잘 마치고 난 뒤 코드 작성 후 commit 한다고 했는데 나중에 확인해보니 한글 내 본명으로 commit이 되고 있었다. 한글 본명이 노출된다는 점도 문제였고, commit 하여도 github 잔디밭에 잔디가 심어지지 않는 문제점이 발생했다. 해당 문제를 해결하기 위해서 한국 블로그들도 참고해봤는데 조금 햇갈릴만하게 적은 부분들이있었는데 stakoverflow가 설명이 제일 간결하면서도 좋았다. 해결 방법 순서 1. 일단 github에서 commit 내역을 확인하거나, 해당 프로젝트를 git clone 한 뒤 $ git log 를 찍어보면 로그내역이 출력된다. 2. 수정하고자 하는 commit 내역의 바로 이전의 hash코드를 복사한 뒤 아래 처럼 입력 $ git rebase -i <<hash 코드>> 또는  수정하려는 commit 이전의 hash코드 말고 수정하고자 하는 commit의 hash코드 값에 ^ 기호를 붙이기 $ git rebase -i <<hash 코드^>> ^ 특수 기호를 작성하면 해당 commit 이 바로 선택된다. 특수 문자 없이 작성할 경우에는 이전의 hash 코드 값을 작성해야지만 수정하고자하는 commit 내역이 선택된다. 3. 위에 ...

[AWS] WARNING: UNPROTECTED PRIVATE KEY FILE! ssh 연결 오류 해결하기

이미지
  @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ @         WARNING: UNPROTECTED PRIVATE KEY FILE!           @ @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ Permissions 0644 for 'share-video2.pem' are too open. It is required that your private key files are NOT accessible by others. This private key will be ignored. SSH에 접속하기위해서는  EC2 인스턴스를 생성하면서 제공된 .pem 확장자를 가진 키파일이 필요하다. .pem 확장자 파일이 있는 해당 폴더에서 aws에서 제공해주는 SSH 접속 주소를 입력해주면 SSH로 연결이 되어야한다. 그런데 위와 같이 EC2 인스턴스에 접속할때 WARNING: UNPROTECTED PRIVATE KEY FILE! 이라는 오류가 발생했다. 해당 문제는 권한에 관련된 문제이다. 첫줄에 Permission ~ too open 즉 해당 파일이 모든 사람에게 읽기 또는 쓰기가 허용되고 있기 때문에 경고가 발생한것이다. chmod 600 자신의키파일.pem 를 입력하면 소유자에게만 읽기 쓰기 권한을 주는것으로 변경할 수 있다. ➜   AWS chmod 600 ./share-video2.pem 해당 명령어를 입력하고 난 후 다시 SSH 접속 명령어를 입력하면 내용이 주르륵나오고 최종적으로 아래와같이 접속이 된것을 확인할 수 있다. (ip 숫자는 혹시몰라서 변경해놨다.) ubuntu@ip-000-00-0-00 : ~ $   내 블로그에 chmod 에 관하여 이해하기 쉽게 정리한 포스팅이 있으므로 아래 링크 참고 http...

React에 Google Fonts 적용하기

이미지
구글 폰트 (Google Fonts) https://fonts.google.com/  방법은 간단하다. 구글 폰트에 들어가서 원하는 폰트를 선택한 후 CSS 파일을 생성해서  해당 폰트에 대한 코드를 붙여 넣기 한 후 적용하고자 하는 Component 에서 import "./LeftMenu.css" 를 아래와 같이 입력하여 적용하면 된다. 작성한 .Logo-Font 를 아래와 같이 className 으로 적용한다. 적용 성공!

[MongoDB] Mongoose(몽구스) populate 사용해서 다른 collection의 documents ObjectId 참조하기

이미지
Mongoose(몽구스)에서 populate을 사용하면 다른 Collection에 있는 documents의 ObjectId를 이용하여 documents 참조가 가능하다. 조금 더 보충하자면 MongoDB 자체에서 Documents 마다 자동으로 만들어주는 고유값인 ObjectId가 있는데 다른 Collection에서 populate 메서드를 사용해서 하나의 Documents에 또 다른 Documents의 정보들을 같이 담을 수 있게 해준다. example) User.js (Model) const mongoose = require ( " mongoose " ) ; const bcrypt = require ( " bcrypt " ) ; const saltRounds = 10 ; const jwt = require ( " jsonwebtoken " ) ; const userSchema = mongoose . Schema ( {      email : {      type : String ,      unique : 1 ,      },      name : {      type : String ,      },      nickname : {      type : String ,      unique : 1 ,      },      password : {      type : String ,      minlength : 6 ,      }, ...

nvm 설치하기 ( mac )

이미지
Node Version Manager (nvm)깃허브 주소  https://github.com/nvm-sh/nvm#install--update-script 터미널 열고 입력 $ sudo curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.37.2/install.sh | bash 위에 명령어 입력하면 아래처럼 나온다. 설치된줄알고 $ nvm --version 을 입력해보지만 제대로 설치되지 않았다. export NVM_DIR="$HOME/.nvm" [ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"  # This loads nvm [ -s "$NVM_DIR/bash_completion" ] && \. "$NVM_DIR/bash_completion"  # This loads nvm bash_completion 환경변수 설정에서 해당 부분을 추가해주어야한다. 아래 명령어 입력 $ vi ~/.zshrc 들어가서  i 를 눌러서 위에 코드를 복사 붙여넣기 후 ESC 눌르고  :wq 입력해서 나온다 나온다음에 복사 붙여넣기한 환경변수 적용하기위해서 아래 명령어 입력 $ source ~/.zshrc 그다음 아래 명령어 입력 $ nvm --version 설치 완료

Node.js 완전히 삭제하기 ( mac )

이미지
프로젝트마다 다른 버전의 Node를 사용해야될 일이있어서 NVM(Node Version Manager)로 노드버전을 관리하기위해서 Node.js를 삭제 후 재설치 하였다. Node.js 삭제하는 방법  1. 터미널에 아래 두줄을 입력한다. $ lsbom -f -l -s -pf /var/db/receipts/org.nodejs.pkg.bom | while read f; do  sudo rm /usr/local/${f}; done $ sudo rm -rf /usr/local/lib/node /usr/local/lib/node_modules /var/db/receipts/org.nodejs.* 2. /usr/local/lib 에 있는 node로 시작하는 directory를 삭제한다. $ cd /usr/local/lib $ sudo rm -rf node* 3. /usr/local/include에 있는 node로 시작하는 directory를 삭제한다. $ cd /usr/local/include $ sudo rm -rf node* 4. brew에 설치된 node를 삭제한다. $ brew uninstall node 이때 에러가 발생했는데 yarn 이 설치되어서 오류가 발생했다. yarn 삭제 $ brew uninstall yarn 5. /usr/local/bin 에 있는 node 와 node_modules를 삭제한다. $ sudo rm -rf /usr/local/bin/npm $ sudo rm -rf /usr/local/bin/node $ ls -las 6. 추가적인 것들을 삭제한다. $ sudo rm -rf /usr/local/share/man/man1/node.1 $ sudo rm -rf /usr/local/lib/dtrace/node.d $ sudo rm -rf ~/.npm

[TypeScript] interface와 type 비교(인터페이스, 타입 별칭) 그리고 변경 불가능한 interface와 type 만들기

이미지
Interface 와 type의 차이 1번. 확장 방식 interface(인터페이스)와 type(타입 별칭)의 가장 큰 차이점은 extends 키워드로 타입의 확장이 가능하냐 불가능하냐 이다.  interface(인터페이스)는 extends로 확장이 가능하지만 type(타입 별칭)은 확장이 불가능하다. extends로만 확장이 불가능할 뿐 type 또한 아래와 같은 방식으로 확장이 가능하긴하다. ex) type test1 = {name: string} type test2 = test1 & {age: number} const test3: test2 = { name: 'd', age: 33 } extends로 확장이 필요한 경우가 많기 때문에 interface를 사용하는것이 좋다. 추가적으로  interface의 경우 다른곳에서 동일한 이름의 interface를 정의하게되면 동일한 명칭의 interface를 하나의 interface로 합친다. 그래서 특정 라이브러리에 내가 원하는 타입을 추가하거나 확장할 때 d.ts 파일에서 interface로 정의하면 해당 라이브러리에 선언된 interface 와 내가 추가적으로 작성한 interface가 합쳐진다.  반면에 type을 사용하여 동일한 이름으로 다른곳에서 type을 정의하게되는  경우에는 에러가 발생한다. 2번. 상세 타입 정보 제공 아래 사진과 같이 interface는 상세 타입정보가 나오지 않지만 type의 경우 상세 타입정보가 나온다. 하지만 interface를 사용하더라도 해당 interface를  cmd + 클릭하면 interface가 정의된 곳으로 바로 가서 타입을 확인할 수 있다. interface (인터페이스) type (타입 별칭) 3번 interface 는 객체를 정의하는것이고, type 은 타입과 객체를 두개를 모두 정의할 수 있다. interface RSP { ROCK : string ; SISSORS : string ; P...

[Firebase] auth 소셜(Social) 로그인 설정하기

이미지
1번. Firebase 콘솔(console)로 이동한다. 아래와 같이 메뉴를 클릭하면 해당 로그인을 제공해줄 업체에서 제공하는  Client ID( 클라이언트 ID) 와  Client secrets(클라이언트 보안 비밀번호)가 필요한것을 확인할 수 있다. 구글 로그인의 경우 Firbase가 구글것이기 때문에 따로 설정할 필요는 없다. github 로그인을 예로 들어보았다. 2번. github에 와서 Settings ---> 메뉴바에 Developer settings ---> OAuth Apps 클릭 ---> New OAuth App 클릭 3번. New OAuth App으로 설정하고나면 위에서와 같이 login-auth가 생긴것을 확인할 수 있다. 해당 App을 클릭해보면 아래와같이 화면이 나온다. 빨간색 네모박스안에 있는 Client ID와 Client secrets 를 Firebase로 돌아가서 입력하면 된다.

[JavaScript] null 병합 연산자 (??) - (nullish coalescing operator)

null 병합 연산자 (??) 를 사용하면 여러 피연산자 중 확정 되어있는 변수를 찾을 수 있다. 확정되어있는 변수라는 말은 정의된 값을 말한다. 즉, null과 undefined 값이 아닌 모든 값을 true로 인식한다는것이다. null 병합 연산자를 사용하는 이유 const age = 45 ; const userAge = age || "secret" ; console . log ( userAge ); // 45 const num = null ; const count = num || "undefined" ; console . log ( count ); // undefined 위 예제와 같이 or 연산자를 사용하여 코드를 많이 작성한다. 앞에 값이 false이면 뒤에 값을 반환하고, 앞에 값이 true이면 뒤에 값을 반환한다. 하지만 여기서 문제점이 발생한다. 일반적으로 false로 인식되는값들은 아래와 같다. false, '', 0, null, undefined 이러한 false로 인식되는 값들이 상황에 따라 문제를 발생시킨다. 상황에따라 사용자에게 값을 받을때 0을 받거나 ' ' 공백을 받을 수 있다. 그런데 이러한 경우에도 false로 인식되어 원하는 방식대로 코드가 동작하지 못하게된다. 아래에 예시로 문제점을 확인해보자. // ex1) 애기의 나이를 사용자로부터 받아올 떼 const babyAge = "" ; const userAge = babyAge || "secret" ; console . log ( userAge ); // secret // ex2) 물 섭취 횟수를 사용자로부터 받아올 떄 const drinkCount = 0 ; const totalCount = drinkCount || "undefined" ; console . log ( count ); // undefined or 연산자를 사용...