월간 회고록 - 23.06

se-een·2023년 7월 23일
0
post-thumbnail

👍 Liked

컨디션 회복

레벨 2 막바지에 반쯤 죽어가다가 방학식을 맞이하여 푹 쉴 수 있었다. 레벨 2 방학이 2주 이상이라 그간 못 만났던 친구들도 좀 만나고~ 졸업한 학교도 가보고~ 하면서 컨디션 회복을 할 수 있었다.

레벨 인터뷰 무사히

이전 회고록에서도 꾸준히 작성했던 내용이지만, 레벨 초반에 React를 잘 몰라서 미션을 진행하는데 애를 좀 먹었다. 레벨 로그를 작성할 때 그간 무엇을 배웠고 깨달았는지 잘 정리가 되지 않았다.

이번에야 말로 'React'를 끝내보자 시리즈를 쓰면서 공부했던 내용을 위주로 작성하였고, 이전 미션들을 돌아보며 노력했던 부분 등 어찌저찌 로그를 작성하여 인터뷰를 진행하였다.

코치 준과 교수님 급 프론트 크루 두 분을 포함해서 총 7명이서 진행했고 이전 인터뷰와 동일하게 내 학습 수준을 점검하고자 하는 마인드로 임했다. 서버 상태와 클라이언트 상태, 렌더링 최적화, Context API를 왜 썼는지 등 다양한 질문을 받았고 어렵지 않게 답변할 수 있었다.

이전 레벨 인터뷰에서도 피드백 받았던 내용으로 '어..', '음..' 하는 추임새가 있었는데, 이번 인터뷰 때 해당 추임새를 자각했지만 의식해서 안 하려다보니 스스로가 어색해져서 답변 자체가 버퍼링 걸리는 새로운 문제를 발견했다. 🤪 꾸준히 노력해야하는 부분 같다..

📚 Learned

useReducer

useState 조금 더 잘 쓰기에 이어 같은 state 훅인 useReducer에 대해서 알아보고 정리해보았다. useReducer는 예전에 Redux를 공부할 때 잠깐 썼던 것 같은데 우테코 미션 중에는 딱히 쓸 일이 없어서 어떻게 사용하는지, 무슨 용도의 훅인지조차 까먹었었다.

state 자체가 복잡한 구조를 가질 일도 적고 관심사 분리, 재사용을 위한 커스텀 훅을 만드는 것을 자주했기 때문에 더더욱 useReducer을 사용할 기회가 없었다. 페이먼츠 미션 때 사용해볼 법 했을수도?

아무튼 useReudcer에 대한 글을 정리하면서 state 업데이트 로직을 한 곳에 몰아두는 것이 왜 도움이 되는지, reducer 함수의 용이함 등 다방면으로 알아보고 연습해 볼 수 있어서 찝찝했던 부분을 확실히 짚고 넘어갈 수 있었다.

ref 객체

ref 객체란 무엇이고, 어떻게 활용해볼 수 있을까? 편을 정리하면서 ref에 대한 개념을 다시 잡을 수 있었다. 글을 정리하기 전까지는 ref는 Real DOM에 접근할 때 사용하는 것? 리렌더링이 발생하지 않는다? 정도로 생각했었다.

ref 객체의 특성과 일반 변수, state 와 무슨 차이점이 있는지 정리해보면서 언제 응용해보면 좋을지, 왜 React에서 ref 객체를 탈출구라고 칭하는지 등등 알아볼 수 있었다.

제어 컴포넌트와 비제어 컴포넌트

테코톡 발표 주제로 삼은 주제이다. ref 객체와 state를 정리하면서 자연스럽게 접하는 개념이라 이 또한 정리해보았다. 이전 페이먼츠 미션에서 제어 컴포넌트 방식으로 미션을 진행했었는데, 그 때는 개념을 잘 모르고 마감기한에 치여 '그냥 이렇게 하는건가보다~' 하면서 진행했었다.

리뷰어님께서 React가 Form을 제어하는 방식들에 대해서 잘 알아볼 것을 권하셨고 '조만간 확실하게 알아가야겠다.' 라고 다짐을 했다가 방학이 되서야 정리를 할 수 있었다.

결국 두 방식의 큰 차이는 React가 Form을 제어하느냐 아니냐이다. 성능면에서도 차이가 있었지만 일반 사용자가 느끼는 차이라고 한다면 실시간적인 반응정도이지 않나 생각이 든다. 그래서 작성한 글에 UX 측면의 비교 예시도 살짝 넣어보았다.

이 글을 수정하는 시점에서는 테코톡 발표가 업로드되었다.

useEffect

장바구니 미션에 들어서면서 API 통신을 하다보니 useEffect를 막 남발하고 있던 내 모습을 발견할 수 있었다. 의존성 배열 목록에 빠진 것은 없는지, Clean Up 함수는 한 번도 작성을 한 적이 없는데 괜찮은지 등 미션을 수행하면서 굉장히 찝찝했던 기억이 있다.

이 역시 공식문서에서 useEffect 파트를 읽어보며 깨달은 것을 위주로 벨로그에 업로드할 생각이었으나 useEffect 파트가 워낙 많아서 읽는데만 꽤 오래걸렸다. 경합 조건 (Race Condition) 등 새로운 개념도 접했는데 정말 흥미로웠고 조만간 쓸 개념인 것 같아 꼭 기록으로 남기고 싶었다.

하지만 Storybook과 MSW도 다시 정리해봐야하기에 잠시 미뤄야할듯하다.

이 글을 수정하는 시점에서야 기록을 시작했다. (무슨 내용을 쓸려고 했는지 거의 까먹어서 다시 복습하고 있다..🤪)

💦 Lacked

Storybook과 MSW 설정

Storybook도 일종의 문서라 기존의 미션에서 제출한 Storybook을 가독성 좋게 리팩토링할 필요가 있어보였다. 그런데 MSW가 같이 들어가니 에러가 도통 해결되질 않는다. 공식문서에서 언급한 preview 설정을 완료하였는데도 잘 되질 않는다. 😬 그리고 Storybook을 7 버전을 사용하고 있기 때문에 레퍼런스가 많지 않다는 점도 한 몫 한 것 같다.

급한대로 이전 페이먼츠 미션에서 사용한 Storybook으로 리팩토링을 끄적여보았다. 레벨 3가 시작되면 크루들에게 물어봐서 설정 좀 잡아두고 글로 정리해볼 필요가 있어보인다.

7월부터는 팀 프로젝트를 진행 중이므로 프로젝트 괜찮을지도 시리즈로 월간 회고록을 대체한다.

profile
woowacourse 5th FE

0개의 댓글