약 한달동안 진행했던 프로젝트가 마무리 되면서 (서버연결빼고)
회고록 작성할 시기가 돌아왔다 😁
비어?비워! 🍻
' 세상에는 맥주가 너무 많아 ! 내가 좋아하는 맥주를 기반으로 추천받을 수는 없을까 ? '
라는 생각으로 시작 한 프로젝트다
이전에 테오의 스프린트에서 나왔던 아이디어 중 하나였는데 당시에 스프린트를 같이 진행했던 비비와 백엔드지인과 함께 3명이서 프로젝트를 진행하게되었다
소통은 Slack을 이용했고 일정관리는 Jira에 깃헙 이슈넘버로 연동시켜서 사용했다
진행하면서 어려웠던 점
1. 사용하기로 했던 맥주 API
받아오지는 데이터를 조회해보니 이미지 겹치는부분들도 꽤 있었고
실제로 한국에서 먹는 맥주의 종류가 많지가 않았다
그래서 검색할때에도 원하는 맥주의 종류를 많이 조회해 볼 수 없었다
다른 API사용도 고려해보았었지만 API호출에 제한도 있었고
구현해야 할 메인기능인 추천맥주 기능을 고려해봤을 때
기존에 사용하기로 했던 Punk API 를 이용하기로 했다
프로젝트를 하게 된 이유 ?
마지막으로 했던 프로젝트가 작년 12월에 끝낸 프로젝트였는데
시간이 지나오면서 알게 된 기술들도 많아졌고
이 기술을 사용해서 무언가를 만들어보고싶다는 생각을 하던 중에
마침 일정이 맞는 지인들과 함께 좋은 기회로 프로젝트를 진행할 수 있었다!
4L 회고
- Liked(좋았던 것)
- Learned(새롭게 배운 것)
- Lacked(아쉬웠던 것)
- Longed for(다음에 해보고 싶은 것)
Liked(좋았던 것)
- 프론트 팀원과 소통이 이루어지면서 프로젝트를 진행한 점
이전 프로젝트에서는 레이아웃작성도 하지않았고 각자 맡은 페이지작업을 했어서
소통할 일이 적었는데 이번프로젝트는 프론트 팀원과 소통을 많이하면서 진행할 수 있어 좋았다!
- 코드리뷰
프론트 팀원이 경력이 있으신분이였어서 코드리뷰에서 많은 피드백을 받을 수 있었다
작성하신 코드에서getlayout사용 등 여러가지도 많이 배울 수 있었다
피드백해준부분은 계속 코드작성에 신경썻고 마지막에는
작성한 코드에서 피드백 내용이 반영이 잘 된다는 좋은 평가를 받을 수 있었다
- typescript, next.js, react-query, recoil
리코일은 처음사용해보았고 나머지 세개의 스택들도 가볍게만 사용해봐서 프로젝트를 하면서
좀 더 자세하게 다룰 수 있어 개인적인 성장도 많이 할 수 있었다!
Learned(새롭게 배운 것)
- middleware
next.js에서 제공해주는 미들웨어 사용 법도 알게되었다.- ssr 사용법
serversideprops를 처음 사용해보게 되면서 ssr 동작방식에 대해 좀 더 높은 이해도를 가질 수 있게 됐다.- 공통컴포넌트, 재사용컴포넌트의 중요성과 작성법
이건 정말 같이 진행해준 팀원분께 감사한 부분인데 작성한 코드들에서
분리하면 좋을 거 같은 부분도 알려주셔서
컴포넌트화를 더 잘할 수 있었고,Button,Input공용 컴포넌트를 만들어주셔서
어떤방식으로 할 수 있는지에 대해서도 많이 배우게 되었다- useRouter = pathname , path 차이점
router에서 경로만 비교할 경우 router.pathname을 써주세요. 9버전 이하에서는router.route는 쿼리스트링까지 포함합니다라고 팀원분이 알려주셔서 이 부분에 대해서도 추가적으로 알고 갈수 있었다
Lacked(아쉬웠던 것)
- emotion을 styled 방식으로 사용했는데 헤더에 있는 이모티콘이
사이트 사이즈에 따라서 다르게 보여주는 훅을 구현했는데
이모션 기본옵션인 css를 이용해서 구현해주어도 되었을 것 같다
- 처음 사용해 본 스택들이나 익숙하지 않은 스택들때문에 초기에 진행속도가 많이 더뎠다
이 부분은 시간을 많이 투자해서 갭을 채워나가려고 노력했다!
- 초기에 서툴렀던 시맨틱 태그 사용
처음에 컴포넌트를 만들면서 시맨틱태그를 사용한다고는 했지만div를 정말 많이 사용했는데 팀원분이 지적해주신 덕분에 나중에는 훨씬 더 시맨틱태그를 활용해서 잘 사용할 수 있었다
Longed for(다음에 해보고 싶은 것)
- Jira를 이슈별로 관리하는 걸 프로젝트 중간부터 도입하게 되었는데
다음 프로젝트부터는 처음부터 일정관리를 세세하게 해도 좋을거 같다- 이번 프로젝트를 통해 배운것을 다음 프로젝트에 적용해보기
내가 맡은 기능
- 카카오로그인 REST API 방식으로 구현
- Admin
- 어드민 확인 후 페이지랜더링 SSR 사용
- Table 컴포넌트 화
- 페이지네이션 구현
- Mypage
/profiledebounce 실시간 닉네임 변경 구현
- Header
- useIsTablet Hook 구현해서 사이즈마다 로고 변경
- SearchBar
- 영문입력 가능하도록 구현
- 공통
- 공통 레이아웃 만들기
마지막으로 프로젝트를 진행하면서 느낀점
이 프로젝트를 진행하면서 얻은것과 배운점이 너무 많아서
같이 프로젝트를 진행한 팀원들에게 너무 감사할 따름이다.
내가 작성하지 않은 타인의 코드를 보면서모르는 부분에대해서 추가적으로 찾아보고 공부하는것도 너무 재미있었고,
백엔드와 소통할 때는 정확하게 내용을 서로 주고받아야되고
회의 진행과정속에서도 모르는 부분이 있을 때는 따로 체크해두고 명확히 짚고나가야
나중에 일을 두번 할 일이 없는거같다 ..!
