프로젝트 설명

<aside> 💡 끼니는 근처 위치기반 음식점 랜덤 뽑기, 밥모임 생성/참여할 수 있는 서비스입니다.

</aside>

기획배경

끼니에 대한 고민을 해결하기위해 기획했습니다.

• 뭐 먹지? ⇒ 근처 음식점 중 한 곳 랜덤으로 뽑아줌
• 누구랑 먹지? ⇒ 밥모임 생성, 참여

협업

FE 3명, BE 4명 (FE로 참여) | FE기준 기여도: 35%

• 사용기술 : TypeScript, Next.js 13, TanStack Query, Axios, Recoil, Kakao Maps API, Chakra UI
• git 협업방식
  • 오늘 할 작업 이슈에 적고, 프로젝트를 연결함 (github project 칸반으로 진행상황 파악)
  • 작업한 pr을 pr템플릿에 맞춰 작성
  • 코드리뷰 진행 (코드컨벤션 체크, 궁금한 점, 변수명 제안 등)
  • 최소 1명의 approve후에 rebase merge 진행

프로젝트 결과물

• github : https://github.com/prgrms-web-devcourse/Team-DarkNight-Kkini-FE
• 배포서버 : https://kkini.vercel.app/

담당한 작업

• 렌더링 된 지도에 있는, 밥모임 보여주기
• 밥모임 신청서 페이지(받은 신청서, 보낸 신청서)
• 밥모임, 신청서 상태(대기 중, 승인..) 보여주는 Badge 컴포넌트
• 로그인 할 수 있는 모달 컴포넌트, 소셜 로그인 연결 작업
• Axios 인스턴스, 인터셉터 활용해 네트워크 요청 모듈화
• 반응형 고려한 Header 컴포넌트

구현 중 겪었던 문제

• Cross-Domain인 서버와 cookie 공유 중 마주한 CORS 에러
• 지도에 밥모임 보여줄 때, 성능에 대한 고민
• 로그인 후 참여하기 버튼 클릭 시, 로그인 성공한 다음 보여줄 페이지 처리에 대한 고민

회고

• 오픈소스 github 저장소
• 다양한 린트와 코드 컨벤션
• 코드리뷰
• 기획부터 개발까지, 전반적인 프로세스 경험