/Team-5YES-WuMo-FE

🍩 모임 일정 계획 및 공유 플랫폼 WuMo

Primary LanguageTypeScript

WuMo logo WuMo(우리들의 모임)

5YES's Team Project WuMo Front-end

🔗 배포 링크 https://5yes-wumo.vercel.app/

🍩 Back-end Repository

WuMo logo

가족, 친구와 모임 일정을 계획하고 공유하는 서비스

우리들의 모임을 관리하는 플랫폼, WuMo

평소 여행이나 모임을 계획할 때 어떻게 하시나요?
그룹채팅방에서는 모임과 상관없는 이야기도 오가면서 모임에 필요한 장소나 사진 등이 잊히기 쉽습니다.
그렇다면 모임과 관련된 내용만 모아보면서 함께 계획을 완성하고 추억을 기록할 도구가 있다면 어떨까요? 

⭐️ 주요 기능

  • 모임을 만들어 친구를 초대한다.
  • 가고 싶은 장소를 등록하여 의견을 공유한다.
  • 장소가 결정되면 후보지를 일정으로 등록한다.
  • 일정을 하나의 타임라인으로 묶어 한눈에 파악한다.
  • 다녀온 장소의 피드를 작성하여 추억을 기록한다.
  • 영수증 기능을 활용하여 정산할 때 도움을 받을 수 있다.
  • 다른 사람들과 일정을 공유하거나 지역을 검색해 추천 일정을 확인한다.
  • 마음에 드는 일정을 관심 목록에 추가하고 모아본다.

기능 미리보기

이메일 회원가입 및 로그인

이메일 회원가입 및 로그인

모임 추가 및 관리

모임 추가 및 관리

초대 및 후보지 추가

초대 및 후보지 추가

일정 관리 및 피드

일정 관리 및 피드

추천 일정 및 관심 목록

추천 일정 및 관심 목록

🍩 팀 소개

김민재 김유리 유지영 주천욱
mxx-kor
glassk
YJZero
chunwookJoo
- 회원가입 및 로그인
- 프로필 조회 및 수정
- 모임 목록
- 모임 계획
- 후보지 및 댓글
- 메인 페이지
- 모임 일정 및 피드
- 모임 초대
- 추천 일정, 관심 일정 목록
- 모임 추가 및 관리
- 랜딩, 404 페이지
- react-hook-form을 활용한 리렌더링 최소화, 유효성 검증 구현
- axios interceptor를 활용하여 API 요청, 에러, 응답 및 JWT 토큰 관리
- kakao maps API를 활용한 지도 뷰 및 검색 기능 구현
- 프로젝트 초기 세팅
- 백엔드 서버 부하를 고려한 대용량 이미지 압축
- tanstack query의 에러 핸들링과 refetch를 활용한 데이터 통신
- 컴포넌트 재사용성을 위한 Modal 등 공통 컴포넌트 분리
- react-router-dom의 동적 라우팅을 이용한 초대 기능 구현
- 추천 일정 좋아요 디바운싱 커스텀 훅 분리
- recoil을 활용한 모임 추가 단계 및 유저 데이터 상태관리

🛠️ 기술 스택

언어
번들러
라이브러리        
     
상태관리  
패키지
포맷터        
배포
협업            
IDE  

🌿 Commit Convention

prefix description
feature 새로운 기능 추가
fix 버그 수정
rename 파일 또는 폴더명 수정, 이동
remove 파일 삭제
design UI 디자인 변경
docs 문서 수정
style 코드 포맷팅
refactor 코드 리팩토링
chore 빌드 업무 수정, 패키지 매니저 수정

📁 폴더 구조

Team-5YES-WuMo-FE 
├── public
└── src
    ├── api
    ├── components
    │   ├── base
    │   ├── main
    │   ├── navigation
    │   ├── party
    │   ├── place
    │   ├── profile
    │   ├── routeList
    │   ├── signIn
    │   └── signUp
    ├── hooks
    ├── pages
    ├── store
    ├── styles
    ├── types
    └── utils
        └── constants

📓 프로젝트 관련 문서


🗓️ 프로젝트 일정

  • 23.02.16 - 23.02.21 프로젝트 기획 및 설계(초기 프로젝트 기획 및 설계, 프로젝트 세팅, API 명세서 작성)
  • 23.02.22 - 23.02.28 MVP 기능 개발(API 명세서를 토대로 FE/BE MVP 기능 개발)
  • 23.03.01 - 23.03.07 기능 개발 및 배포(FE/BE 기능 개발, API 연결 및 배포)
  • 23.03.08 - 23.03.14 QA, 버그 수정 및 리팩토링(전체적인 서비스 안정화 및 문서화)
  • 23.03.15 - 리팩터링 및 UI/UX와 기능 개선