[더블엔씨] 니콘내콘 모바일 웹페이

원티드 프리온보딩 부트캠프 - 더블엔씨 모바일 웹페이지 클론 과제 리포입니다.

배포

다음 페이지들을 클론하는 것이 이번 과제의 주된 요구사항이었습니다.

프로젝트 클론

  git clone https://github.com/wanted-pre-onboading-10/ncnc-app.git

프로젝트 디렉토리 들어가기

  cd ncnc-app

패키지 설치 및 프로젝트 시작

  npm install && npm run dev

이욱창	김태희	문현돈	이경은

@wook95	@tae100k	@hyundonny	@2kyung19

역할:
- 레이아웃, 헤더, 사이드 메뉴, 고객센터 페이지, e2e 테스트 작성 담당. 개인 블로그를 NextJS로 만든 경험 덕에 빠른 속도로 전반적인 레이아웃과 고객센터 페이지를 만들 수 있었다. 뿐만 아니라 이전 과제에서 사이드 메뉴를 만든 경험이 있어 이번에도 효율적으로 사이드 메뉴를 구현할 수 있었다. 다만 참고용으로 주어진 Figma 디자인과 실제 홈페이지 간에 차이가 존재해 어떤 방식으로 디자인을 구현해야 할 지 쉽게 파악하지 못한 부분도 더러 있었다. 이런 경우에는 팀원들과 함께 사용자가 가장 사용하기 편한 방식에 대해 논의했고, 이를 기반으로 페이지를 구현했다.
회고
- 이번 과제에서 처음으로 e2e 테스트 코드를 작성해봤다. Cypress 라이브러리에 대해 처음 알게 되었고 복잡하지는 않지만 내가 만든 부분의 기본적인 기능을 전부 테스트하는 코드를 작성해볼 수 있었다. Cypress 공식 문서가 워낙 깔끔하게 작성되어 있었기에 공식 문서를 기반으로 내가 원하는 부분을 테스트해볼 수 있어 만족했다. 앞으로는 e2e 테스트와 unit 테스트 코드를 적극적으로 활용해보고 싶다.

역할
- 홈 화면 및 상품리스트 구현
- 무한 캐러셀 구현
- 아이템 박스 컴포넌트 구현
회고
- NextJS를 처음 경험해보면서, 한 단계 성장했다!
- 이번에는 type이나 api 규칙도 정하는 등 과제를 진행하면 할 수록 팀내 규칙이 쌓여가는 것 같아 뿌듯했다!

역할
- 상품 상세 페이지 구현
- 3단으로 움직이는 버튼클릭,옵션 선택, 구매 기능
회고
- 백엔드와 소통할 할수 없는 상황에서, 데이터를 잘 만져 원하는 대로 바꾸면서 자바스크립트에 대해 더 잘 알수 있었습니다!
- SSR을 통해 pre-rendering을 시켜주는 경험이 좋아 앞으로도 쭉 next를 공부할 예정입니다!