Week 3
Day 1
- 주말 내 작업한
redux적용된 코드 잘 작동하는지 확인 - 서버와 API 통신하며 디테일한 부분 맞추기
오늘은 정말 어떻게 지나갔는지 그리고 뭘 했는지 전혀 모르겠다..ㅎㅎ 계속 로그인과 닉네임 페이지의 늪에 빠져 있는 듯 한데, 소소한 에러들을 수정하고 서버와 통신하며 맞추다보니 하루가 끝났다?!
오늘 유일하게 당황한 순간은 git때문인데, rebase가 제대로 안되어 있는 상황에서 커밋을 남기다보니 제대로 머지가 되지 않았고 그 과정에서 코드가 날아가버리는 문제 발생.... 심지어 미팅 1분 전에 문제가 발생해서 땀이 삐질삐질 났다. 그래도 git reflog를 잘 활용해서 다행히 코드를 안전하게 복구!!
내일부터는 다른 페이지 레이아웃과 기능 구현을 할 수 있으면 좋겠다.
Day 2
- 위클리 미팅 진행 : 지금까지 진전 상황 내부 공유 및 필요한 자료 요청
- 봇 페이지 레이아웃 구현 시작
- 로그아웃 프로세스 오류 fix
위클리 미팅, 개별 면담 등 업무 이외의 일이 많은 날이었다. 생각보다 많은 작업을 하지는 못했으나 물리적인 시간이 부족했던 탓!
Day 3
header에 유저 데이터 받아오는 로직 구현 :redux와 조건부fetch활용- 봇 페이지 레이아웃 및 미디어 쿼리 구현 완료
단순히 데이터를 받아오는 거라고 생각했는데, 로그인이 되어있지 않은 상태에서 데이터 요청을 하면 오류가 나는 상황을 발견했다. 그래서 로그인이 되었을 경우에만 fetch API가 작동하도록 코드를 구현하였다. useEffect내에도 if문을 쓸 수 있다는 생각을 해본 적이 없었는데, 두번 째 인자의 값을 적절하게 설정해주면 충분히 가능했음!
그리고 레이아웃 구현을 본격 시작하면서 다른 사람이 쓴 코드를 재구성한다는 건 생각보다 쉽지 않다는걸 절실히 느끼고 있다. 금방 처리할 수 있을 것 같던 페이지를 오늘 하루 전체를 투자해서야 겨우 미디어 쿼리까지 적용하다니... 레이아웃을 짜다보니 생각보다 소소한 부분도 구현할 기능이 많았다. 빨리 레이아웃을 마무리하고 기능 구현 하고 싶다!!
Day 4
- 어제 구현한
header내fetch API로직 status code를 활용한 것으로 수정 - 디테일 페이지 일부 컴포넌트화(예주님 작업)된 것 내 작업 페이지에 적용
- Nav 중 클릭된 메뉴만 디자인 변경될 수 있도록 기능 구현
- 모달 구현 :
useRef활용하여 모달 바깥 클릭 시 꺼지는 기능도 함께 구현 - 마이페이지 레이아웃 구현 시작
status code를 받기 위해서는 response를 json으로 변환하면 안되는데, 그럴 경우 받아온 데이터를 어떻게 처리할 수 있을지 항상 궁금했다. 이번에 백엔드 지은님이 정확하게 이 부분을 요청했고, 서칭해서 구현은 했는데 실제로 작동하는지는 확인 필요!
(확인했는데 걱정한게 무색할 정도로 매우매우 잘 작동한다 :))
메뉴 중 클릭된 것의 색상이 바뀌는 단순한 액션인데, 구현을 위해서는 로직을 이해하고 있지 않으면 너무 오랜 시간이 걸린다는 생각이 들었다. 다행히도 지난 번에 비슷한 구현을 해본 적이 있어서 힌트를 얻어 같은 방식은 아니지만 비슷하게 구현.
모달의 경우에는 기존에 코드가 잘 되어 있어서 꺼지고 켜지는 것만 잘 구현하면 되었는데, 모달 바깥을 클릭 했을 때 꺼지게 하는 프로세스가 생각보다 오래걸렸다. 되어야 하는데 안되서 왜인지 너무너무 머리가 아팠는데, 결국 답은 console.log... 콘솔을 하나하나 찍으며 문제를 파악하고 결국 해결!! typescript와 내 판단미스의 콜라보레이션이었다ㅎㅎ
한 주의 회고
레이아웃과 기능의 많은 부분을 구현하며, 완벽하게 잘 구현되어 있는데 왜 안되지!!!! 라고 느낄 때가 많았다. 이런 경우 10이면 8 정도는 오타 문제였다는거.. 코드는 오타와의 싸움이라는 말이 있듯이 조금 더 신중하게 코드를 짜야할 필요가 있는 것 같다.
그리고 크롬이노베이션 이사님께서 항상 강조해서 말씀해주시는 부분이 있는데, 개발자는 코드를 넣고 빼는 과정을 통해 작업 하는 사람이 아니라 스스로 생각하고 이해하며 코드를 짜는 사람이라는 이야기이다. 처음에는 이 말이 무슨 의미인지 이해하지 못했는데, 이번 한 주를 보내며 조금이나마 체감하게 된 것 같다. 구글링을 통해서 해결책을 찾고 내 프로젝트에 적용은 할 수 있으나, 구현해야하는 내용이 많다보니 그 해결책의 코드 한 줄 한 줄이 어떤 의미를 가지고 있는지 잘 모르는 문제 발생.
그런 의미에서 이번 주말에는 새로운 내용을 구현하기 보다는, 내가 지금까지 작성한 코드에 문제는 없는지 이해가 안되는 부분은 없는지 불필요한 부분은 없는지 살펴보고 리팩토링 하는 시간을 가져봐야겠다.
