template을 만들자

• template.js
• 소스 코드를 어떤 순서를

console.log 잘 관리하기

• propduct level에서는 보이면 안됨!
• 되도록 로거함수 만들어서 사용하기

const logger = (msg)=>{
	if(process.env.NODE_ENV === 'production'){
    	return;
    }
  console.log(msg);
}

• 포트폴리오용이라면 console을 잘 활용하면 면접관들에게 좋은 인상을 줄 수 있다!!

주석

• 함수의 경우, 이 함수가 하는 일, 파라미터로 받아오는 것, 리턴 값이 무엇인지, 함수 사용 방법
  -컴포넌트의 경우, 어떤 컴포넌트인지(역할), 필요한 props가 뭔지
• 컴포넌트 사용방법
• 기타..작업자가 누구인지, 수정을 했따면 어떤 걸 수정했는지

함수형 컴포넌트에서 return은 최대한 단순하게

• return이 단순해야 리렌더링될 때 성능이 좋아짐
• return 안에서 여러겹의 상항연산자는 좋지 않다.! 차라리 if문을 사용할 것

네이게이션, 해위 이동은 push말고 replace로

• push로 이동하면 history가 쌓임
• url이 기존 경로와 같은지 확인

axios 모듈화하기

• 헤더를 매번 설정하지 말것

immer를 잘 쓸것

• immer를 쓰면서 스프레스 문법을 쓸 필요없음

// bad
const a =[1,2,3];
const b = [...a,4]

// good
const a = [1,2,3]
a.push(4)

useSelector를 어떻게 사용해야할까?

• 공용 컴포넌트에서 큰 데이터를 받아오면 계속 렌더링됨
• 관련있는 컴포넌트들이 바뀌는건 괜찮음!

한번에 여러 api를 호출해야하는 경우?

• useEffect를 각각 사용하고 있는데 괜찮나요?
• api를 비동기로 여러개 호출해야하는 경우 async - await를 사용하세요!!!
• useEffect를 여러개쓰는 것은 괜찮지만, 리액트에는 여러 훅이 많다. 대체가능한것을 찾아볼 것

클린코드도 좋지만 코드가 지저분해지더라도 사용자에게 좋은 경험을 주는 것이 더 중요하다!!!

포트폴리오 팁!

• console.log를 잘이용하자
• 가고자하는 회사의 도메인(분야)을 이해하고 적용해보면 기특한 포트폴리오가 됨
• README 잘 적기!!!