드디어 최종 프로젝트의 회고를 쓰는 날이 왔다.

프로젝트 설명

프로젝트 요구사항

• 기간 : 7/16(월)~8/21(수)

ㄱ6ㄴ6콩(A06조) 프로젝트 정보

혼자살때 링크

• 프로젝트 명 : 혼자살때(livingalone)
• 소개
  • 한 줄 정리 : 설레이는 첫 자취를 시작한 자취생의 걱정을 덜어주는 커뮤니티 웹서비스
  • 내용 : 자취를 시작하는 사람들을 위한 필수템 리뷰와 공동구매 정보를 제공하는 커뮤니티 웹사이트입니다. 회원들은 자취에 필요한 다양한 아이템을 추천하고, 특가 상품 공동구매를 통해 저렴하게 필요한 물품을 구입할 수 있습니다. 또한, 회원가입을 통해 맞춤형 서비스와 편리한 기능을 이용할 수 있습니다.
• 프로젝트 핵심 기능
  • [구해줘 자취템] 자취 필수템 커뮤니티 서비스
  • [같이 사 공구템] 자취템 공동구매 서비스
• 기술 스택
  • 커뮤니티 서비스 - supabase CRUD
  • 공동구매 서비스 - supabase CRUD
  • 주소 검색 - 다음 주소검색 api
  • “랜덤박스“ 상품 - 결제 - 포트원 api
  • “공구템 게시글 채팅” - supabase realtime
  • “게시글 쓰기 에디터” - toast ui editor

내가 담당한 부분

크게는 결제 기능, 공구템 페이지 관련 전체, 마이페이지 내가 쓴 공구, 다음 주소 검색 api, 카카오톡 공유 api 적용 등을 맡았다.

• 럭키박스 결제 관련
  • 랜딩 페이지
    • 남은 럭키박스 갯수 설정
    • 한 번 구매한 사람은 다시 구매할 수 없도록 설정
  • 폼 페이지
    • 포트원 api 연결하여 이니시스 결제 기능 구현
    • 등록된 유저 정보 통해 주소 및 이메일 자동 등록
  • 체크 페이지
    • 결제 완료 여부 체크 후 완료 혹은 랜딩 페이지로 이동하도록 설정
  • 완료 페이지
  • 결제 시 즉시 환불되도록 설정
• 같이 사 공구템 관련
  • 리스트 페이지
    • useInfiniteQuery 사용하여 더보기 기능 구현
    • 진행중, 종료됨 상태에 따른 sort 구현
  • 상세 페이지
    • 인기 공구템 슬라이드 적용
  • 공구 신청 모달
  • 작성 페이지
    • 이전 날짜는 등록 못하도록 설정
    • 가격 0원 이하 불가능하도록 설정
  • 수정 페이지
  • supabase에서 sql 코드 등록하여 매 자정에 기간 지난 공구템 종료로 상태 변경
• 자랑해 자취템 관련
  • 상세 페이지 댓글 페이지네이션 구현
• 마이 페이지 관련
  • 내가 쓴 공구 페이지
    • 공구 종료 및 입금여부 설정
  • 결제 내역 페이지
    • 즉시 환불되지 않았을 경우 마이 페이지 결제 내역에서 환불할 수 있도록 설정
• 로그인, 로그아웃 관련
  • 비밀번호 보기/숨기기 기능 구현
• supabase DB 설계
• Restful API 설계
• 다음 주소 검색 api 사용하여 주소 검색기능 구현 (마이페이지, 결제 폼 페이지, 공구 신청 모달)
• 공유 모달
  • 현재 주소 복사 기능 제작
  • 카카오톡 공유 api 사용하여 카카오톡 공유기능 구현 (자취템 및 공구템 상세 페이지)
• 럭키박스 결제 관련 페이지, 공구템 관련 페이지, 마이 페이지 내가 쓴 공구 페이지 반응형 작업
• 유효성 검사가 들어가는 모든 input에 에러 메시지 추가 및 input border 색 변경되는 기능 구현
• 자취템, 공구템 상세 페이지에 게시물 제목으로 동적 메타데이터 설정
• 전화번호 입력 시 하이픈 자동 생성 기능 구현
• insert, update 기능에 쓰로틀링 적용

최대한 생략해서 적는다고 적었는데 아무래도 최종이다보니 양이 꽤 되는 것 같다...

발표 피드백

• 메인에 들어오자마자 어떤 사이트인지 알 수 있었다.
• 전체적으로 일관성을 띠기 때문에 완성도가 높게 느껴졌다.
• 성능 지표가 그렇게 좋지는 않았으나 애플리케이션 경험은 나쁘지 않았다.
• api 최적화는 잘 되어있는 것 같다.
• 글을 커스터마이징할 수 있는 에디터는 좋다.
• 알림이 오긴 하는데 새로고침해야 오는 버그가 있었다.
• 폴더 구조가 좋다. 직관적이라 프로젝트가 어떻게 구성되어 있는지 알기 쉬웠다.
• page 컴포넌트에서 searchParams 내려주는 방식이 좋다.
• 이런 식으로 고민하면서 개발을 해나가면 좋을 것 같다.
• (모든 수강생들에게) 프로젝트 끝내고 회고를 한 번 해라. 나중에 그러지 말자고 하는 것도 있지만, 캠프도 끝나니까 잘했던 점, 좋았던 점만 공유하는 시간을 가지면 좋을 것 같다. 왜 잘 끝낼 수 있었는지 머릿속에서 끄집어내는 시간을 가져봐라. 잘했던 모습을 가지고 나가기 편할 것이다. 면접 때 스토리텔링하기도 편할 것이다.

Liked

• 비교적 빠른 속도로 의도했던 프로젝트를 구현했다. 이로 인해 기능을 여러 번 더 추가하고 완성도도 높일 시간을 확보할 수 있었다.
• 확장성이 높았기에 1차적으로 완성 후에도 2차, 3차로 추가 기능을 제작할 수 있었다.
• 포트원, 주소 검색, 카카오톡 공유 등 여러 api를 써볼 수 있었다.
• 그 전의 프로젝트에 비해 기간이 길어, 전에는 시간이 부족해 디테일하게 제작할 수 없었던 부분까지 꼼꼼하게 신경쓸 수 있었다.

Lacked

• 빠르게 진행하고자 기획에 시간을 많이 투자하지 않았고, 1주씩 프로젝트를 진행하다가 갑자기 5-6주의 프로젝트를 진행하게 되었기에 기획의 스코프를 어떻게 잡아야할지 감을 제대로 잡지 못하여 생각보다 너무 빠르게 완성이 되어버려 추가 기능을 몇 번이고 추가하게 되는 문제 및 프로젝트 자체가 우리 마음에 크게 들지는 않는 문제가 생겼다.
• 다른 팀들의 많은 프로젝트는 대량의 정보가 들어있는 api를 사용하여 사이트가 풍부해보이는 느낌이 드는 것에 비하여 우리 프로젝트는 그런 api를 사용하는 것이 아닌 오로지 회원들의 게시물들만으로 이루어지는 사이트였기에 밋밋해보이는 느낌이 커서 아쉬웠다.

Learned

• 너무 빠르게 일을 진행하려다 보면 그때그때 해야 하는 중요한 것들을 놓치거나 불만족스럽게 처리할 수 있기에, 속도만 생각하기보다는 프로젝트의 각 단계에 맞춰 충분한 시간을 투자할 필요가 있다는 점을 느꼈다.
• 바꿀 수 없는 게 있고, 모두의 마음이 같을 수 없다는 것, 그럴 때 가장 중요한 것은 일단 나 자신이 그런 요소에 휩쓸리지 않고 내가 해야할 일들을 기본적으로 잘 해나가면서 가능한 물심양면으로 돕는 것. 너무 어렵지만, 팀장이 아닌 팀원의 입장에서는 그게 최선이라고 생각한다.

Longed for

• 급하게 생각하지 말고, 침착하게 순서대로 그때그떄 해야 하는 과제에 집중하기, 특히 기획에 신경쓰기.
• 평소에 해보지 않은, 사이트에 걸맞으면서도 좀 더 도전적인 기능을 많이 제작해보기.