“혼밥이 싫을 땐, 밥(BaB)”
맛집에서 함께 밥을 먹을 사람을 찾고, 새로운 인연을 만드는 소셜 매칭 플랫폼입니다.
회원은 관심사 기반으로 매칭을 개설하거나 참여할 수 있으며,
실시간 알림, 채팅, 이벤트, 포인트 시스템 등을 통해 풍부한 사용자 경험을 제공합니다.
BaB (Bond and Bite) 은 혼자 식사하기 어려운 순간, 근처 사람과 함께할 즉시 매칭 기반 식사 플랫폼 입니다.
대학생·직장인·유학생 페르소나를 활용하여 혼밥에 불편함을 느끼는 사용자가 주요 타깃으로,
위치 기반 매칭, 메뉴/맛집 중심 탐색, 1회성 만남 옵션, 채팅 기능,
체크리스트, 후기·신뢰 시스템을 핵심 기능으로 제공합니다.
이를 통해 준비 과정의 번거로움을 줄이고, 안전하고 가벼운 만남 경험을 지원합니다.
| 항목 | 내용 |
|---|---|
| 프로젝트명 | BaB (밥) |
| 기획 | Readdy.ai, Chat GPT |
| 개발기간 | 2025.09 ~ 진행중 (2025.11.13(완료예정)) |
| Front-end | React (Vite), TypeScript, Tailwind CSS, Emotion, Ant Design, NivoChart, KakaoMap Swiper, React-Paginate, Shadcn, Dayjs |
| Back-end | Supabase (PostgreSQL, Auth, Storage, Realtime), |
| SEO 분석 | GA4 |
| Design | Figma |
| 배포 | Vercel |
| 협업 | GoogleSheet, GitHub, Slack |
| 주요 기능 | 회원가입/로그인(OAuth), 매칭, 채팅, 알림, 이벤트, 리뷰, 포인트, 파트너 관리, 관리자 대시보드 |
- 기획 : 신동재 / 전도현/ 김지양
- 디자인 : 김지양 / 신동재/ 전도현
- 데이터베이스 : 전도현 / 김지양/ 신동재
| 이름 | 역할 |
|---|---|
| 전도현 | 라우터 구성, 초기 Supabase 연동, 주기적 코드점검으로 오류 해결, 멤버 회원가입 및 로그인 매칭 시스템 설계 및 구현, 카카오맵 기반 주변가게 연동, 고객센터 디자인작업, 파트너 회원가입 및 로그인 레스토랑 연동, 메뉴 관리 구성 |
| 신동재 | 커뮤니티, 이벤트, 고객센터, 프로필메뉴 (내가 쓴 게시글, 문의내역, 차단), 파트너 대시보드, 매출 및 정산 계정 및 보안, 어드민 사용자 계정 관리, 파트너 계정 관리, 문의내역 답글 기능, OK/Cancel 모달 |
| 김지양 | 맛집추천, 디테일페이지, 프로필페이지, 프로필 수정, 관심사 선택, 포인트 적립 및 사용, 1:1 채팅, 알림시스템 즐겨찾는 식당(찜 기능), 내가 쓴 리뷰, 파트너 회원 리뷰 알림기능, 파트너 리뷰 답글기능 어드민 매칭 관리페이지 차트표현 |
- 이메일 / 카카오 / 구글 로그인 (Supabase Auth)
- 프로필 생성 및 편집 (닉네임, 아바타, 관심사 등)
- 포인트 적립 및 활동 내역 조회
- 커뮤니티 서비스 활동 및 내역 조회
- 이벤트 참여
- 매칭 생성, 참여, 취소 기능
- 모집 인원 자동 계산 및 상태(
waiting,full,completed,cancel) - 유사 매칭 자동 추천 (거리 기반 + 카테고리)
- 결제 연동 (토스페이먼츠 - 목업진행)
- 1:1 실시간 채팅 (Supabase Realtime)
- 알림(Notification) 시스템 (채팅, 이벤트시작, 답글, 리뷰, 매칭완료, 모집완료, 매칭취소 알림 전송) (Supabase Realtime)
- 신고(Report) 시스템 내장
- 문의(help) 시스템 내장
- 파트너(사장님) 전용 페이지
- 매장 정보 등록 / 수정 / 이미지 업로드
- 메뉴 추가 및 관리 기능
- 리뷰, 평점 평균 및 리뷰 통계 표시
- 리뷰 알림 표시
- 이벤트 개설 / 참여 / 종료
- 포인트 또는 쿠폰 지급 시스템 (추후 구현)
- 기간별 상태(
예정,진행중,종료) 자동 업데이트
- 회원 / 매칭 / 이벤트 / 문의 관리
- 신고 내역 검토 및 처리
- 통계 차트 및 데이터 시각화
| 경로 | 설명 |
|---|---|
src/components/ |
공통 UI 및 기능 컴포넌트 |
src/contexts/ |
전역 상태 관리 (Auth, Modal, Matching 등) |
src/hooks/ |
커스텀 훅 |
src/lib/ |
Supabase 초기 설정 및 서비스 로직 |
src/pages/member/ |
일반 사용자용 페이지 |
src/pages/partner/ |
파트너(사장님)용 페이지 |
src/pages/admin/ |
관리자 페이지 |
src/services/ |
CRUD 및 API 통신 서비스 함수 |
src/types/ |
TypeScript 타입 정의 파일 |
src/ui/ |
UI 컴포넌트 및 스타일 시스템 (Button, Modal, Badge 등) |
App.tsx / main.tsx |
라우팅 및 프로젝트 진입점 |
- React 18 + Vite
- TypeScript
- TailwindCSS
- Emotion
- Ant Design
- NivoChart
- KakaoMap
- Swiper
- React-Paginate
- Shadcn
- Dayjs
- Supabase
- Vercel
| 구분 | 페이지 | 설명 |
|---|---|---|
/member/matching |
매칭 리스트 및 작성 | 매칭 진행중인 리스트를 확인할 수 있음 |
/member/matching/:id |
매칭 상세 (MatchingDetailPage.tsx) |
매칭 상세페이지 출력 (날짜, 인원, 식당, 위치) |
/member/community |
회원 커뮤니티 | 회원간의 소통 가능 |
/member/reviews |
맛집 검색 리스트 | 맛집을 검색하고 다녀온 가게에 리뷰 등록 가능 |
/member/events |
이벤트 목록 및 상세 | 진행중인 이벤트 및 예정된 이벤트 확인 가능 |
/member/support |
문의하기 | 이용 중 문제가 생겼을 때 스스로 해결할 수 있는 방법을 찾거나, 문의하는 공간 |
/member/profile |
사용자 프로필 | 사용자 프로필, 프로필 수정 및 관심사, 결제수단, 채팅, 회원별 메뉴 제공 |
SignUp.mp4
Matching.mp4
Community.mp4
Review.mp4
Profile.mp4
Chat.mp4
Point.mp4
Event.mp4
- 매칭 상세 및 참여 로직 완료
- 실시간 알림 / 채팅 시스템
- 파트너 매장 CRUD
- 이벤트 관리
- 반응형
- 관리자 통계 대시보드 개선
- 성능 최적화 (lazy loading 예정)
- 결제 시스템 완전 연동
- Notion : https://www.notion.so/About-Me-2069fbf8131280f899b0c956db8b84ff?source=copy_link
- Github : https://github.com/devdorong
- Email : [email protected]
- Notion : https://www.notion.so/2163900c3ef280348281c9ea6ba0dc07
- Github : https://github.com/devgsheep
- Email : [email protected]
- Notion : https://www.notion.so/DONGJAE-SHIN-21d56f06c7398060a3f1fd42aad01a6f?source=copy_link
- Github : https://github.com/seastj
- Email : [email protected]