원티드 프리 온보딩 1일차 TIL

강의 요약

1. 검색이 잘 되는 개발자가 되자!
2. 다른 사이트들을 구경해보자.
3. 코드리뷰 중 팁.

1. 검색이 잘되는 개발자가 되자.

개발자와 다른 일반적인 직업의 차별점은 아무래도 개발자는 자신의 경험과 노력 그리고 정성을 저장하여 남에게 보여줄 수 있다는 점이 아닐까?
그런면에서 강사님께서는 남에게 보여줄 수 있는 부분을 강조하셨다. 나도 이제 검색이 잘되기 위해서 velog에 TIL 그리고 내가 성취해낸 부분들으 저장해 나가려고 한다.

2. 다른 사이트를 구경해보자.

강사님은 다른 사이트를 구경하시면서 어떠한 부분을 구현한 것에 강한 호기심을 가지셨다. 그리고 말씀 하시길 자신의 코드에 자존심을 부리지 말라는 말을 하셨다. 그 말인 즉슨 나보다 더 좋은 코드를 짜는 사람이 있다면 기존의 나의 방식을 버리고 그 사람의 방식을 따르라는 의미이다. 그 말을 들으면서 나도 어쩌면 스스로 코드에 대한 자존심을 부리고 있었던게 아닌가 하는 생각이 들었다..

3. 코드 리뷰 중 배운 것들

• focusWithIn 사용해보기

• 스타일은 string이기 때문에 굳이 변형할 필요 없다.

• list key를 index로 절대 넣지 마라. index 그대로 넣으면 안되고 의미가 있게 가공하는게 좋다.
  (index가 겹치면 react가 제대로 작동하지 않을 수 있다.)

• 이벤트핸들러 콜백 함수는 handle~의 식으로 만드는 것이 좋다.

• email은 w3c 웹 표준 정규식을 사용하자.

• 이벤트 핸들러 사용할때 e.target이 아닌 e.currentTarget을 사용하자.

• svg는 이미지 태그가 아닌 리액트 컴포넌트로 받자. 그럼 크기나 색깔을 컨트롤 가능하게 된다.
  ex) 다크모드를 위한 svg가 따로 주어지지 않기에 우리가 핸들링 가능해야 한다.

• input 태그에는 적당히꺼 두어야할 기능들이 있다.

• useClickAway라는 hook을 사용해보자 => react-use라는 hook 모임 library를 사용해보자. (useMount, useUnmount 많이 사용해보자) => 물론 어떻게 동작하는 지에 대해서는 숙지필수!

• 상수명은 젤 윗단에 대문자로 지정하자. => component가 리렌더링 될때마다 새로 선언하고 할당되는 것을 막을 수 있다.

• checked + ball 사용해보기 => 아주 fancy한 방법이라고 하셨으니 나중에 꼭 이용해보도록 하겠습니다.

• css in js에 대한 강사님의 생각
  css in js html태그를 너무 추상화하는 느낌이다. 시맨틱하지 않게 쓰는게 되는 것 같다.

후기

약 4시간 30분 가량의 강의를 듣고나니 머리가 멍해진 느낌이었다. 강의를 들으면서 가장 많이 든 생각은 여기서 내가 얼마나 흡수를 할 수 있을까 라는 생각이었다. 최대한 많이 흡수할 수 있도록 노력하는게 급선무 아닐까?