2021-05 기술 아티클 읽기

왜 React Element에는 $$typeof 프로퍼티가 있을까?

0512 Frontend Clean Code

:클린코드는 유지보수시간을 단축시킨다. 클린코드!==짧은코드, 클린코드 ===원하는 로직을 빠르게 찾을 수 있는 코드. 1. 같은 목적의 코드는 뭉쳐두기(but, 코드 파악에 필수적인 요소와 디테일을 구분한다.) 2.단일책임 함수, 단일책임 컴포넌트 3. 추상화: 중요개념을 담은 네이밍으로 추상화시키고, 추상화의 단계는 다양하게 할수있지만 추상화단계를 통일시키도록 하자. 개인적으로 클린코드를 위해 당장 적용해볼 액션 ▶ 팀과 함께 공감대형성하기 (명시적으로 이야기할 시간 필요),▶문서(글)로 적어보기(향후 문제점, 개선방법)

0516 How to Cleanup Event Listeners in React

: 언마운트 시에는 불필요한 행위를 줄이자. 이벤트 리스너를 한번 등록하고나면 브라우저에 인식되니 계속하여 이벤트를 추가할 필요가없다. 메모리가 사용될것이고(특히, SPA에서는 더욱!) 여러 이벤트 리스너들이 중복될 때 에러를 발생시킬 수도 있기 때문이다. 사용 후 정리 필수, Always Cleanup
(방법, useEffect에서 이벤트리스너를 추가했다면 return으로 리무브 이벤트 리스너를 실행할 것)

0517 성장에 은탄환은 없다

늘 성장하고 발전하는 개발자에 대한 회고글. 나만의 이유있는 주관이 담긴 코딩 습관을 키우는 것이 중요하구나라는 걸 코쿼에서 느끼고 있다. (중요한 건 이유를 알고있어야 한다는 것) 또 친절한 개발자가 되고 싶다는 다짐을 하고있는 요즘이다.

0518 21 Best Practices for a Clean React Project

좀 늦게 읽게된 글.

• 이번 미션에 적용해볼 사항:
  - Take Advantage of Object Literals(case: 2개이상의 선택사항의 경우 삼항연산자 대신 사용하기, 컴포넌트 반환)
  - Use Memo : 불필요한 렌더링 피하기 (아마 지금 미션에서는 모달컨트롤시에 유저버튼이 다른 공간을 클릭할때마다 렌더링되는지를 체크해보고 적용해보자)
  - Import in Order : 슬슬 신경쓰였던 부분인데 Built-in > External > Internal 이 순서대로 해바야제~
• 새로 알게된 것 :
  - div말고 <> Fragments : 가상dom을 그릴때 생성되는 노드가 적기때문에 성능상 이점이 있다.