TIL_210319(First Project)

📝 오늘 한 일 / 배운 것

---

🖋 MainPage 관련 상태관리 및 렌더링 구현

MainPage에는 총 3개의 Section이 존재하는 데 각 Section 마다 나타내는 정보가 달라서 상태를 어디서 관리해야 할 지 고민을 했다. 결론적으로는 MainPage 컴포넌트에서 useEffect를 이용해 서버에 요청을 보내고 응답을 redux store에 저장한 후, 각 Section 컴포넌트에서 store 값을 사용하기로 했다. 그런데 이게 효율적인지 차근차근 생각해봐야겠다.

또한 목표는 인터렉티브하게 만드는 것!

 

🖋 NavBar, SearchPage

NavBar의 검색창은 모든 라우팅(페이지)에 존재하지만 SearchPage에서는 사용하지 않고 SearchPage 자체 검색창을 사용할 것이다.  따라서 우선 순위가 높은 NavBar의 검색 기능을 먼저 구현하기로 했다. 또한 NavBar의 검색창에서 검색 시 SearchPage로 이동하도록 했는데, 'react-router-dom' 을 통해 쉽게 할 수 있었다. 또한 history 객체는 정말 유용한 것 같다.

 

🖋 fakeData 사용

서버와 데이터베이스 구현은 되어있지만 데이터를 직접 넣을 엄두가 나지않아, 만들어 놓은 API 문서를 활용해 실제 서버 응답과 동일한 fakeData를 만들었다. 역시 직접 눈으로 결과를 보면서 일일이 console.log를 찍어봐야 조금이나마 알 것 같다.

 

🙏 기억할 것 / 느낀 점

---

🖋정리하는 법

프로젝트를 진행하면서 처음 시작할 때 잡았던 목표는 발생하는 모든 이슈를 정리해보자! 였다. 그런데 문제 해결하는 시간이 아까웠는지? 이걸 정리할 생각은 하지도 않고 주구장창 오랜 시간을 보냈다. 나름 정리를 한다고 생각했지만 수기로 적은 A4용지만 수두룩 쌓이고 결국 정리는 커녕 분리수거를 할 것이다.. (복습을 하고싶은데 내 글을 알아볼 수 없다.)

지금 다시 생각을 해보니 문제가 발생했을 때 정리하는 과정을 통해 분명히 뒤죽박죽이던 머릿 속이 정리가 되고, 천천히 생각해볼 수 있는 시간이 될 것이다.

따라서 앞으론 정리를 잘 해보자!

 

🖋명확하게 할 일 정하기

지금까지 태스크 카드를 통해 각자 몇 시간동안 얼만큼의 기능을 구현할 것인지를 정하면서 하긴 했다. 그런데 어느순간 태스크 카드 작성은 하지 않고 이것저것 건드리다 아무것도 완성하지 못하고 머릿속만 혼란해진 나를 볼 수 있었다. 물론 해야 할 컴포넌트, 함수가 독립적이 아니고 연관이 되어있기때문에 아예 신경을 쓰지 않을 순 없지만 우선 명확하게 목표를 잡고 이를 우선적으로 해결하도록 노력할 것이다.