메인 프로젝트 회고(19~23일차) 230521

황에녹·2023년 5월 21일

회고

목록 보기

12/13

한동안 생활패턴이 망가지고, 맡은 페이지 완성에 집중하느라 회고를 못했다.

멘토님의 다음과 같은 말씀이 없었다면,
난 아마 프로젝트가 마무리될 때까지 회고를 미뤘을 것이다.

행군만으로도 충분히 지치고 힘들겠지만,
우리는 그 와중에 군가도 부르고, 보폭도 맞춰야한다.

페이지 개발 구현에도 집중해야하지만,
팀원간의 커뮤니케이션 / 기능 공유 / 성장한 부분을 기록 / 학습 내용 문서화
등등... 도 함께 해나가야 한다는 것이다.

밀린 회고를 매듭짓고 다시금,
지친 몸과 마음을 일깨워 나아가보도록 하자.

현재 발생한 문제는
우리가 최초 기획한 일정보다
❗️실제 일정이 많이 밀렸다는 것이다.

기획을 제외한 개발 기간이 약 2주 남짓하여
주차별로 기능을 나눠 개발하도록 기획하였지만,
1주차의 기능들이 2주차까지 밀리면서
2주차에 개발 예정이었던 페이지들에 지장이 와버렸다..🥲

나는 메인 페이지를 담당했다.
우리의 개발 시간은 2주였고,
메인 페이지는 크기가 큰 만큼 2주차까지 개발하기로 기한을 정했었지만
개인적으로는 1주차에 마무리하고 싶었다.

하지만 1주차가 지나고
2번째 마감일로 17일(수),
3번째 마감일로 19일(금)로
완성 일정이 점점 밀려만 갔다.

페이지 구현에 대한 경험이 없고,
때문에 내가 특정 페이지를 구현할 때에
시간을 얼마나 투자해야하는지(얼만큼 쓰면 완성가능한지),
특정 기능을 구현하기 위해서는 어떤 것을 학습해야 하는지 등에 대한 지식이 없었고,
일정 계획에 착오를 야기했다.

일정이 밀린 것은 사실상 나의 부족함이 가장 컸다.

메인 페이지는 기능에 비해 디자인의 비중을 크게 가져가고 싶었고,
1주차 동안은 css의 늪에서 열심히 헤엄치기 바빴다.

여러 페이지의 폴더구조도 분석해보고,
나름 컴포넌트 단위로 기능/디자인을 나눠서 구현하고 싶었는데,
너무 많은 css 구조가 결국 나중에 나의 발목을 잡았다.

이제 와서 코드를 보면 쓸데없는 div(StyledComponent)들이 많은 것 같고,
이로 인해 반응형을 구현하는데 어려움도 있었다.

컴포넌트를 나누지 않으면 상태관리가 편하겠지만,
리액트 컴포넌트 단위로 작업을 하기 위해서는 나눠야했다.

특히 Category 페이지에서는
서버에서 받아온 식당 데이터 중,
랜덤 카테고리를 필터링하여 각 컴포넌트에 전달해줘야했다.

이 때 데이터를 전달해줄 최상위 컴포넌트도 애매하고,
나중에 메뉴 추천 버튼에 의해 이 데이터들이 한 번에 바뀌어야하기 때문에
Redux 전역상태관리 구현이 필수적이었다.

2주간의 개발 기간 중, 약 3~4일을 Redux학습에 투자했다.
이만큼이나 투자하고 싶진 않았지만, 상상 이상으로 난이도가 높았고
삽질하다 보니 시간이 많이 흘러갔다...

Redux 기본 개념도 학습하고,
Redux로 서버에서 받아온 데이터를 관리하는 방법도 학습해야했는데,
이 부분에 대한 정보가 많지 않았다.

chat gpt, 블로그와 한국/외국 영상을 닥치는 대로 뒤져봤다.

처음에는 시간이 여유롭지 않다보니,
개념학습을 통해 응용해서 구현하기보다는
필요한 코드를 얻어내는데 급급했다.

결국 서버에서 데이터를 받아와
각 컴포넌트로 필터링하여 전달하는 것은 가능했지만,
시간이 많이 흘렀고, 구현해야 하는 다른 페이지도 있었기에
메뉴 추천 기능을 삭제하기로 결정했다.
(추가 학습하는데 드는 시간이 내 예상보다 훨씬 많을 것이기 때문)

: 메인페이지 95% 완성
(크로스 브라우징, Main - Review 더미 데이터/반응형 테스트 X)

(FoodRecommend →) Main - FoodPedia

1. 메뉴 추천 버튼 삭제 ❌
: 타 페이지 구현이 우선이라 판단하여 기능을 축소, 메인 페이지의 개발시간을 단축시킴.

2. FullPage 애니메이션 구현 (@ap.cx/react-fullpage 라이브러리)
: 스크롤 시, vh100으로 나눠진 페이지 덩어리 단위로 부드럽게 스크롤 된다.
🥲
❗️현재 라이브러리 적용 후 Link 이동시, 'clientHeight' null 에러 발생
Main - Category