2차 프로젝트 코드리뷰

1. 카카오 KEY 숨기기

일단 되고 보자라는 심정으로 카카오 로그인 API를 index.html에 넣어놓았었다.
지금은 가짜(?) 서비스이지만, 회사에서 내 목숨보다 중요한 그거슨 보안....환경변수를 사용해 API key는 숨겨야 한다.
CRA에서는 따로 설치하지 않아도 된다는데 나는 삽질하면서 안되길래 설치했다...

.env

최상단 root에 .env파일 생성하고 gitignore에 추가
react에서 env를 사용할 때는 이름이 REACT_APP으로 시작해야 함
변수이름=어쩌구저쩌구(공백없이)
import, export 필요없음

.env 파일은 gitignore에 반드시 추가해야 한다!

2. validation && 활용해 수정

signup, login input이 유효하지 않으면, none으로 처리되어있던 p태그와 input의 border가 나타난다.

props를 이용해서 조절했었는데, &&연산자를 이용해 p태그를 간단하게 바꿀 수 있었다!

3. requset body 삼항연산자 활용해 수정

signup에서 host/user를 구분하고 내용을 body에 실어 보냈다.
내가 느끼기에도 signup, login, kakaoLogin 각각에서 코드 중복이 많이 발생하고 있었다.

아래처럼 body에 삼항연산자를 활용하여 코드 길이도 줄이고 의미도 더 명확히 할 수 있었다.

코드의 중복이 느껴질 때는 방법을 고민해보자.