🐶 PETSTIVAL 🎉

반려동물과 함께 참여할 수 있는 페스티벌 정보를 모아서 확인하고, 페스티벌 관련 커머셜 상품을 구매할 수 있는 쇼핑 플랫폼

🗓️ 프로젝트 일정: 2024년 10월 18일 - 2024년 11월 7일 (3주)

⛳️ Project Overview (프로젝트 배경 및 기획의도)

• 최근 반려가구 추이가 증가함에 따라 페스티벌 관련된 행사도 전국 곳곳에서 열리고 있습니다.
• 따라서 현재 분산되어 있는 반려견과 함께할 수 있는 축제 정보를 제공합니다.
• 이를 통해 반려견과 함께할 수 있는 페스티벌 문화를 확산하고 지역 경제 활성화를 기대합니다.
• 더불어 축제와 관련된 상품을 기획하고 판매하는 커머스 서비스까지 도입하여 반려견 동반 페스티벌 시장확보를 통한 수익모델을 구축할 수 있습니다.
• 궁극적으로 일상 속에 반려견 문화가 자리잡을 수 있도록 기대합니다.

🌈 Team Members (팀원 및 팀 소개)

김다연	김영동	신혜민	유성현	최명지
개발리드, FE	FE, Data	팀장, PL	FE, BE	FE
✨ 프론트엔드 개발 리드 ✨ 결제 및 취소 기능 구현 ✨ 상품 주문 전체 플로우 구현 주문, 결제 관련 페이지 구현 홈페이지, 인증 팝업창 구현 페스티벌 관련 페이지 구현 마이페이지 구현	✨ 공공 데이터 API 연동 ✨ DB 데이터 생성 견종 검색 자동완성 기능 구현 주소 검색 API 배송지 입력 구현 페스티벌 참여 신청 기능 구현 페스티벌 상세 페이지 구현	✨ 전체 프로젝트 리드 ✨ 전체 UI 디자인 ✨ 반려견 프로필 기능 구현 개발 환경 세팅 ERD 작성 및 DB 세팅 전체 페이지 퍼블리싱 장바구니, 주문하기 기능 구현	✨ 소셜 로그인 기능 구현 ✨ QR 인증 기능 구현 로그아웃, 회원탈퇴 구현 DB 유저 생성 기능 구현 로그인 페이지 구현 QR-Scanner 페이지 구현	✨ 장바구니 기능 구현 ✨ 장바구니 페이지 구현 UI 와이어프레임 디자인 쇼핑 관련 페이지 구현 페스티벌 신청 목록 페이지 구현

팀프로젝트 노션 및 피그마

• Notion Link
• Figma Link

🪐 주요 기능 및 서비스 구조도

💫 서비스 화면 및 기능소개

1. 로그인/로그아웃 화면

2. 반려견 등록 페이지

3. 쇼핑 페이지

4. 결제 페이지

5. 펫스티벌 조회 페이지

6. 펫스티벌 참여 인증 페이지

🛠️ 기술 스택 및 아키텍쳐 구조도

🧩 DB 설계 및 FE 프로젝트 구조

project/
├── supabase/                # Supabase Edge Function 모음
│   ├── functions/  
│   ├──├── _shared/ 
│   ├──├── payment-cancel/
│   ├──├── payment/
├── src/
│   ├── assets/              # 이미지, 폰트 등 정적 파일
│   ├── components/          # UI 컴포넌트 모음
│   ├── stories/             # 디자인 재사용이 가능한 UI 컴포넌트 및 storybook 배포 파일 모음
│   ├── hooks/               # 커스텀 훅 모음
│   ├── service/             # Supabase Client 및 DB 관련 파일 모음
│   ├── pages/               # 각 페이지 컴포넌트 모음
│   ├── App.js               
│   ├── index.js             
│   package-lock.json    
│   package.json         
├── .gitignore               
└── README.md                

🪄 커밋 컨벤션

기본 구조

type(영문): subject(한글)

type 종류

커밋 태그	설명	예시
feat	새로운 기능 추가	feat: …
fix	버그 수정	fix: …
style	HTML, CSS로 UI 구현 시 작성	style: 로그인 페이지 UI 구현
refactor	코드 리팩토링	refactor: update login logic
docs	문서 (README, 템플릿) 수정	docs: …
test	테스트 코드	test: …
build	빌드 관련 파일 수정	build: …
ci	CI 설정 파일 수정	ci: …
pref	성능 개선	pref: …
chore	의존성 추가 등 기타 작업	chore: …

😍 프로젝트 회고