오늘 배운 것
- 고양이 사진첩 과제
- 고양이 사진 검색기
어려웠던 내용
- 컴포넌트 조율을 위한 App의 역할 이해 및 코드 작성
- 컴포넌트의 책임에 따라 코드 위치 지정하기
- 내 코드와 비교했을 때 개선점
- ImageViewer의 모달을 열고 닫는 것을 App과 NodeList의 이벤트함수에서 처리해주고 있었는데, 이를 ImageViewer 내부로 넘겨, 해당 책임을 가지는 컴포넌트에서 코드가 존재하도록 개선
- 의존성이 없는 모듈/utils 함수를 작성하는 것
궁금한 내용 / 부족한내용 🤔
- 의존성이 없는 함수, 컴포넌트 만들기
- 컴포넌트간 책임 명확히 하기
느낀점
- 노션프로젝트를 하면서도, 지금 고양이 사진첩 과제를 하면서도 많이 느끼는 것은, “
많은 기능 욕심낼 필요 없구나" 이다. 가장 기본적이고 핵심적인 기능, 또 기능구현 그 이전에 앞서 컴포넌트를 구상하고 state를 설계하는 것에서 부터 코드 퀄리티가 달라질 수 있다고 느낀다. 한 번 시작을 잘못해버리면, 특정 기능의 추가 상황이 왔을 때 올바르고 깔끔한 대응을 하기 어렵다는 느낌을 받았다. 내가 많이 어려웠던 부분은 의존성이 없는 함수나 컴포넌트를 고민하고 만드는 부분이었다. App이 자체적으로 render를 하고 있어 불필요한 책임을 가지고 있다거나, 하위컴포넌트인 nodeList에서 data를 fetch해와 전체적으로 사용하는 등 컴포넌트가 가지고 있어야하는 상태들에 대한 사용이 부족했다고 느꼈다. 다행이도 roto의 코드를 참고하며 스스로 이를 리팩토링 할 수 있었고, 단순히 강의를 보는 것이외에 더 큰 문제의식을 느끼고, 개선할 수 있을 것 같다는 자신감을 얻게 되었다.
참고
- 프로그래머스 과제관_고양이 사진첩 만들기
- 프로그래머스_데브코스