2021/06__WEEK4 TIL

06/21 (Mon.)

• TDD
  수업에서 테스트코드를 접하게 됐다. TDD는 테스트코드를 먼저 설계한 후에 코드를 작성하게 된다. TDD를 잘하기 위해서는 테스트 단위, 컴포넌트 단위를 유닛하게 작성하는 것이 유리하다.

  테스트 단위가 깃헙에서 발행한 이슈단위와 비슷한 것 같았다. TDD를 잘 적용하게 된다면 이슈는 조금 범위가 넓게~ 이슈 체크리스트들을 TDD단위로 설계하면 좋을 것 같다!
  (연봉 2-3천 올리는 방법: 2년간 TDD로 개발하기😄)
  

• 미션: 로그인 기능은 로그인페이지에서 하도록 분리: 테스트 삼아서 작성함.
  메인페이지는 오로지 메인화면에 맞는 로직만 갖도록~

이번주는 싱숭생숭. 집중못하고 코쿼끝남....

• 공부할 것: 리액트에서의 이벤트 위임
• 미션 구현 계속하기: 꼭 할것 -> recoilloadable적용해보기, error처리, 로딩이 늦는 곳 skeleton 처리, 최적화함수 적용, fetch반복작업 함수로 빼기, input입력 함수 적용, api객체 카테고리별 정돈하기.
• 다른 팀 코드 읽기

06/26-27 주말

• 알고리즘 조합 살펴봄 '-'

• 프리티어 설정:

  • 프리티어가 잘 안됬었는데, 나의 경우엔 format on save가 풀려있었다. 참고링크: 프리티어안될때!!!
  • pr후 depth에 이상이 있을 시엔 Editor: Insert Spaces 를 체크해보기.

• 미션 구현:

  • useMemo, React.memo 공부 및 적용함
    -React.memo: 리렌더링이 필요한 상황에서만(값이 변경될때만) 컴포넌트를 렌더링을 하도록한다. 컴포넌트를 감싸주면 된다.
    export default React.memo(Component)
    -useMemo: 렌더링될때 선언한 함수를 반복해서 실행하지않고, 함수의 값이 변경될 경우에만 새로 불러오도록 한다. useMemo(()=>func1,[deps])
  • API구조 재정리 (API.getIssueDetail => API.ISSUE_DETAIL.GET)
    :API가 많아져서 구조적으로 접근해 쉽게 찾을 수 있도록 변경!

06/29 (Tue.)

• 리뷰/미션/알고/이력서
• 이력서 리뷰를 받았는데 생각보다 구체적으로 쓰라고 하셔서 블로그 포스팅처럼 했다. 이렇게 써야하는건가..?

06/31 (Wed.)

• 미션: 검색창 부분 작업

검색창의 조건 설계가 까다로웠다.
검색창의 기존 조건+새로운 검색어가 연결되어 검색을 할 수 있었는데, 백엔드 API는 검색어만 입력받도록 되어있었음, 백엔드의 API상태를 그대로 쓰게되면 사용자가 기존 조건과 함께 검색어를 입력하면 에러가 나버리는 상황이 되었다. 그래서 백엔드의 API를 변경해달라할까 진지하게 고민하다 클라이언트에서의 뷰 동작을 변경하는 방식으로 변경했음

입력창을 클릭하면 '기존의 조건+검색어'가 아닌 기존의 조건을 없애고 '검색어'만 입력하게함.
사용자 입장에서 '기존의 조건+검색어'로 입력할 경우를 없애서 에러가 날 상황을 없애주었다.
복잡한 코드가 될뻔한 걸 간단하게 수정한게 기억남음

최근 유튜브에서 좋은코드에 대한 영상을 봤는데, 엘레베이터에 비유한게 생각났다.
엘레베이터 속도가 느린 것 같다는 사람들의 의견에
A. 막대한 비용을 들여 엘레베이터의 속도를 20% 단축,
B. 전신거울을 엘레베이터 옆에 설치해서 사람들의 주의를 분산시킴
꼭 코드가 정답은 아니다. 정확한 문제해결이 관건!