dukDukz

[데브로드] 6주차 주간회고 본문

프론트엔드 데브로드/주간회고록

[데브로드] 6주차 주간회고

헤일리_HJ 2023. 3. 12. 17:34

잘한 것은 무엇인가?

  • 퇴근후 모각코
    • 퇴근하자마자 바로 달려가서 접속함.. 진짜 정신없는 평일이였다..
    • 평균적으로 한시간 반정도 학습할 수 있었는데 짧은 시간동안 집중할 수 있어서 만족스러웠다.
    • 앞으로도 꾸준하게 참여할 예정
  • 관심사의 분리에 대해 알게 된 점
    • 이번주 강의 내용은 전체적으로 관심사를 어떻게 분리할지. (프론트니까 UI 와 비지니스 로직으로 보통 나누게 된다.)
    • 이렇게 나눠야 테스트, 재사용 하기 편해진다고 한다.
    • 막연하게 컴포넌트는 UI만 관리하고 나머지 로직 처리는 다른곳에서 해줘야 한다고 얘기만 들었었는데 이게 뭔지 좀 알게 된 것 같다.
  • 과제 통과
    • 저번주 과제를 통과를 못했었다..
    • 요한님 도움을 받아서 통과를 했는데 build 문제였다.
    • 왜 build 폴더 없이는 테스트가 통과되지 않는지?
      • dist 폴더에 mockServiceWorker 파일이 존재해서 통과하게 됩니다. 배포 환경에서는 빌드후에 dist에 index.html 파일과 번들링된 파일이 떨어지는데 번들링된 파일에서 dist에 있는 mockServiceWorker를 읽어야 msw 셋업이 되고 e2e 테스트가 통과하는 것 같습니다.
      • 번들링된 파일... dist... msw 셋업... 하... 아직은 너무 어렵다...

잘못한 것은 무엇인가?

  • 데브노트를 금요일에 완성한 것.
    • 강의 자체는 월요일에 다 들었다. 들었지만 이해가 안되는 부분이 너무 많았고 순식간에 지나가 버린듯한 느낌에 여러차례 강의를 다시 들을 수 밖에 없었다. 그러다보니 자연스레 정리가 늦어지고 결국에는 금요일까지 오게 되었다.
    • 학습 속도가 많이 느려진 것 같다.
  • 너무 어렵다... 깊이 이해하기 힘들다는 점
    • 지난 주 테스트 수업 부터 상태 관리로 들어오면서 이전에 경험해보지 못한 부분들을 새롭게 배우게 되니까 학습이 마냥 즐겁지만은 않다.. 물론 새로운 걸 배우고 써먹을 수 있는것들이 늘어나서 좋지만..
    • 나만 이렇게 이해가 안가는건가? 나만 모르는 것 같은데??? 싶은 생각들의 연속으로... 점점 조급해지고 그로 인해 깊이 이해하며 학습하기 보다는.. 이런 느낌인건가..?? 그런건가,, 이렇게 넘어가게 된다. 너무 어려워서.. 반복이 필요할 것 같다.

무엇을 배웠는가?

  • 관심사의 분리 
    • 비지니스 로직과 UI를 분리한다는 점
      • 그럼 컴포넌트에서 useState를 아예 다빼라는건지?? - 그건 아니다!
      • UI 수준에서 관리되는 상태라면 해당 컴포넌트 내에서 useState 정도로 관리를 하시는게 좋고, 그게 아니라면 스토어를 통해 상태를 관리하는게 좋습니다.
    • 순수 ts로 구현하는 부분이 비지니스 로직에 가깝고 그 외에 UI 관련된 부분은 리액트에서 처리하게 두어야 한다는 점.
    • 모듈화를 통해 재사용성을 높이고 캡슐화를 통해 UI 단에서는 몰라도 될 setState같은것.. 그런것들에 접근하지 못하도록 보호할 수 있다.
      • 1학년때 캡슐화 모듈화~~ 이렇게 배웠었는데 그 때는 정말 무슨말인지 알 수 가 없었다.. 일단 외우기는 하는데 이걸 어디에 써먹는다는거지 싶었는데 이제야 조금 알게 된 것 같다.
  • 의존성 주입
    • 의존성 : 어떤 함수나 클래스 등이 내부에서 다른 함수나 클래스를 사용하는 것
    • 주입: 어떤 함수나 클래스 등이 내부에서 사용하는 다른 함수나 클래스를 내부에서 생성하지 않고 외부에서 생성하여 넣어주는 것
    • 바로 바로 관심사의 분리였던 것이다. 모듈화를 통해 관심사를 분리하고 사용하는 쪽에서는 그냥 가져다 쓰기만 하면 되게 하는것.
  • Redux
    • 리덕스 따라하기 강의를 들으면서는 ... 대략 멍해진 상태였다.. 이게 ... 뭐지?? 이걸 내가 해야하는 것인가?? 싶었는데 마지막에 아샬님이 이럴거면 그냥 리덕스를 갖다 쓰는게 낫죠? 하는걸 보고 안도의 한숨을 쉬었다.. 
    • 리덕스가 마법이 아니라는것... dispatch, selector로 리덕스 설치하고 그냥 냅다 쓰기만 했었는데 이런 구현 과정이 있었다는 것을 알게 되었다. 구독과 발행의 개념까지...
  • usestore-ts
    • 이거는 상태관리 툴인데 `npm i usestore-ts`로 사용한다.
    • class 형태의 문법을 알아야 한다... 사실 class 형태의 문법 ... 잘 몰라서 많이 어렵다.. 근데 소개하는 강의에서는 우리가 익숙한 객체 형태의 문법을 가져다 사용했다고 하는데... 뭔가 다른 세상 같다.. 
      • 테스트를 먼저 쓰고 구현한다는게 어떤 의미인지 궁금했는데 소개 강의에서 확인해 볼 수 있어서 좋았다.
      • 그거랑 별개로 소개 강의 자체도 굉장히 빠르고 어려워서 아직은 좀 버겁다는 점.. 
    • 관심사 분리를 통해 상태 관리 하는 곳을 분리하고 UI는 가져다 쓰기만 하고.. 수많은 useState에서 벗어날 수 있다는 점.. forceUpdate(상태를 변경하기) 와 같은 개념을 배울 수 있었다.
    • 아쉬운 점은... 현재 목표가 이직인 상황에서 많은 회사들이 사용하는 상태관리 방법으로 배울 수 있으면 좋겠다는 점이다..
      • 채용공고에서 recoil, zustand, mobx 등을 보게 되는데 이런 부분에 대해서는 따로 학습이 필요할 것 같다..

해결해야할 문제/남아있는 의문은 무엇인가?

  • 이번주 관심사의 분리 - 상태관리 강의가 참 어렵고 깊이 이해하기 어려웠다... 좀 더 많은 연습이 필요할 것 같다.