리액트 2주차 회고

Hannah·2021년 1월 31일
1

코드숨

목록 보기
2/9
post-custom-banner

한 것

  1. 카운터앱 만들기
  2. 투두 앱 만들기

느낀것

  • 관심사의 분리라는 개념이 처음에는 어렵게 느껴졌지만 계속 시도해보고 코드리뷰를 받다보니 처음보다는 어떤것을 의미하는지 알것같다. 뭔가 공장같기도 하다. 서로 할일을 나눠서 그 할일에만 집중하는듯한?.. 내가 약통에 약을 채워서 보내면 너는 포장만해 너는 약이 몇개 들었는지 알필요없어😅 이런 느낌?..
  • App에서 상태만 관리하고 자식컴포넌트들은 상태를 받아 그리는데만 집중하니 상태값이 뭔가 추가가되도 App에서만 수정하면 되니 훨씬 효율적인것 같다. 뭔가 에러가 났을때 컴포넌트의 연결관계를 파악할 필요없이 상태를 관리하는 App만 확인하면 되니 에러를 잡을때도 좋은것 같다!
  • 질문을 많이할수록 뭔가 내가 얻어가는게 많은 것 같다. 다른 수강생 분들 코드리뷰도 계속 참고하면서 이해가 안가는 부분에대해 질문을 하니 내가 놓쳤던 부분에 대해서도 새로 알게되어 너무 좋다. 피드포워드를 받았을때 수정할게요로 끝내지말고 이해가 안가는 부분이 있다면 반드시 한번더 질문을 해야겠다.
  • 슬랙에 질문글을 한번 올려보았는데 좋은 답변들을 많이 받았다. 앞으로도 궁금한게 있을때 질문을 잘 정리해서 슬랙에 올려보아야겠다 ㅎㅎ

배운것

  • export한 모듈을 import를 이용해 가져올때 확장자를 생략하는 방법
  • 비지니스 로직의 관심사는 상태와 상태를 관리하는 함수이고, UI로직의 관심사는 받은 것을 그리는 것이다.
  • 내가 하는 행위가 어떤 결과를 불러오는지 정확히 알고 진행해야 한다. 그냥 무작정 분리하지말고 컴포넌트를 분리하는지, 분리했을때 장, 단점이 무엇인지에 대해 생각해보고 상황에 맞게 분리해야된다
  • 하나의 모듈하나의 책임을 가져야 한다 - SRP(단일책임원칙)
  • 컴포넌트를 props로 넘길 수 있다.
  • &&는 결과를 불분명하게 만들 위험이 있다
  • setState 자체를 자식컴포넌트에 넘기게 되면 상태 값이 어디서 어떻게 변경되는지 예측이 안되므로 우리가 의도한대로 변경이 될 수 있게 핸들러 함수를 만들어서 전달하자
  • 핸들러 네이밍은 handle 접두사를 사용한다(handleEvent, handleSubjectEvent), 핸들러를 props로 받을땐 on 접두사를 사용한다(onEvent, onSubjectEvent) => 이렇게 설정하면 이벤트 핸들러 역할을 한다는 의도를 드러낼 수 있다.
  • 컴포넌트가 범용적으로 만들어질수록 구조단순해지고 재사용성높아진다
  • 관심사가 잘 분리되어있으면 구조와 코드를 읽기가 훨씬 좋아진다
post-custom-banner

0개의 댓글